5주차-파트01: Object.keys(), API설계

CHAPTER 1. 빈객체 확인하기: Object.keys()

처음 내가 작성한 로그인 코드이다. 너무 더럽기도 하고 DB양이 많으면 루프문 돌다가 한세월 다 가기 때문에 바꿔준다.

//로그인- userId가 db에 저장된 회원인지 확인 + pwd맞는지 비교
app.post('/login', function(req,res){
    const {userId, pwd} = req.body

    db.forEach(function(user){
        if (user.userId === userId){
            if (user.pwd === pwd ){
            res.status(200).json({
                message : `${user.name}님 환영합니다`
            })
        }
            else{
                res.status(404).json({
                    message : "패스워드가 틀렸습니다"
                })
            }
        }
        else{
            res.status(404).json({
                message : "없는 회원 정보입니다"
            })
        }
    })
})

 

 

 

다음과 같이 loginUser란 배열에 값을 넣어 확인하도록 바꾼다. 그런데 이 코드는 회원가입을 하지 않고 로그인을 해도

//로그인- userId가 db에 저장된 회원인지 확인 + pwd맞는지 비교
app.post('/login', function(req,res){
    const {userId, pwd} = req.body
    let loginUser = {}
    
    db.forEach(function(user){
        if (user.userId === userId){
            loginUser = user  //db에서 userId를 발견한 경우 loginUser 배열에 담음
        }

    })
    if (loginUser){   //loginUser객체가 있는지 없는지 확인해야함
        console.log("아이디 같은 거 찾았다")

        //pwd도 맞는지 비교
        if (loginUser.pwd === pwd ){
            console.log("패스워드도 같다")
        }
        else{
            console.log("패스워드 틀렸다")
    }}
    else{
        console.log("입력하신 아이디는 없는 아이디입니다.")
    }

})

 

 

다음과 같이 출력된다. 

 

이유는 다음 줄 때문인데 loginUser는 배열이고 로그인시 입력된 userId값이 db에 저장되어있으면 배열안에 데이터를 저장한다. 따라서 loginUser배열이 비어있으면 로그인시 입력한 userId값이 db에 없는 userId이므로 아이디를 틀리게 입력한 것이다. 

그러나 실제로 배열이 비어있는 상태여도 중괄호{}가 남아있으면 값이 있는 상태로 인식하기 때문에 다른 방법을 이용하여 배열이 비었다는 것을 알려줘야한다.

if (loginUser){   //loginUser객체가 있는지 없는지 확인해야함

 

 

 

다음처럼 고쳐준다.

 if (Object.keys(loginUser).length){   //loginUser객체가 있는지 없는지 확인해야함

 

회원정보를 저장하지 않고 입력하면 다음처럼 잘 작동한다.

 

 

 

---

 

빈 객체인지 확인하는데는 3가지 방법이있다.

✔️빈 객체 확인하는 방법

1. 객체.keys()  ⭐추천

2. for in

3. lodash 라이브러리 이용

 

 

객체.keys()형태에 대해 자세히 알아보자.

✅Object.keys(객체)

객체의 key값만 반환해준다.

const basket = {
    1: "apple",
    2: "banana",
    3: "orange"
}

console.log(Object.keys(basket)) //객체의 키 값만 출력

 

 

 

 

✅Object.values(객체)

 

객체의 value값만 반환해준다.

console.log(Object.values(basket))  //객체의 밸류 값만 출력

 

 

 

 

.length로 출력한 길이는 3이다.

console.log(Object.keys(basket).length)

 

 

 

 

이번에는 다음 객체들의 keys를 적용한 형태에 대해 알아보자.

const obj1 = {}
const str1 = "one"
const str2 = ""  //문자열도 객체이다

console.log(Object.keys(obj1).length) 
console.log(Object.keys(str1).length) 
console.log(Object.keys(str2).length)

 

문자열도 객체이기 때문에 적용된다.

 

 

 

.keys()를 활용하여 길이가 0이면 true를, 0이 아니면 false를 반환하는 함수를 만들어 모듈처럼 사용할 수 있다.

function isEmpty(obj){
    if (Object.keys(obj).length === 0){
        return true;
    }
    else{
        return false;
    }
}

---

 

추가로 .constructor를 이용하여 먼저 객체인지부터 확인해줄 수 있다.

if (obj.constructor === Object)

 

 

 

 

CHAPTER 2. 채널 API 설계

채널 생성 페이지 : 채널 생성버튼 클릭시 => 입력받은 채널명을 받아, 채널 생성(등록) API

채널 관리 페이지 : (1) 화면 출력 => 이 회원이 소유한 전체 채널 조회 API (2) 삭제 버튼 클릭 시 => 채널 삭제

채널 수정 페이지 : (1) 기존 개별 채널 정보 조회 API (2) 수정 완료 버튼 클릭 시 => 개별 채널 수정 API

 

 

 

.route를 이용하여 같은 경로를 이용하는 함수들을 하나로 묶을 수 있다.

app
    .route('/channels')
    .get()
    .post()

 

 

 

다음은 채널을 전체 조회하는 함수이다. 이전과 다르게 배열로 선언해주고 배열에 담아 res.json으로 전체 배열을 출력해줬다. json에 배열 형식도 담을 수 있다.

app
    .route('/channels')

    //채널 전체 조회
    .get((req, res)=>{

        if (db.size){
            let channels = []       //배열로 담음

            db.forEach(function(value, key){
                channels.push(value)
            })
            res.status(200).json(channels)
        }
        else{
            res.status(404).json({
                message : "조회할 채널이 없습니다."
            })
        }
    })

 

 

 

 

 

---

 

 

배우다 보니 자바스크립트에서 [],{}의 개념이 헷갈려서 정리해보았다.

 

✅배열 vs Object

[ ] : 배열 선언, 배열은 순서가 있는 리스트 데이터 구조

 

 

 

 

 

{ } : Object (객체)선언, 객체는 키-값 쌍으로 데이터를 저장하는 맵 형태의 데이터 구조