[데브코스] 25일차 TIL

전체 조회 feat.구글링

// youtuber-demo.js

// REST API 설계
app.get('/youtubers', (req, res)=>{
    console.log(db)
    res.json(db)
})

// 출력 결과
Map(3) {
  1 => { channelTitle: '십오야', sub: '593만명', videoNum: '993개' },
  2 => { channelTitle: '침착맨', sub: '227만명', videoNum: '6.6천개' },
  3 => { channelTitle: '테오', sub: '54.8만명', videoNum: '7260개' }
}

• console에는 잘 뜨는 데 postman에서는 {} 이 출력된다.

❓ map은 진짜 map 형태여서 key-value 처럼 생겼어도 바로 json형태로 보내줄 순 없는 거다.

// youtuber-demo.js
app.get('/youtubers', (req, res)=>{
    db.forEach(function(youtuber){
        console.log(youtuber)
    })

// 출력 결과
{ channelTitle: '십오야', sub: '593만명', videoNum: '993개' }
{ channelTitle: '침착맨', sub: '227만명', videoNum: '6.6천개' }
{ channelTitle: '테오', sub: '54.8만명', videoNum: '7260개' }

• 이제 콘솔에는 따로 출력되는 것을 볼 수 있다.

❓ 그렇다면 forEach를 json으로 바꾸는 거지

// youtuber-demo.js

// '/youtubers' 엔드포인트에 대한 핸들러 함수
app.get('/youtubers', (req, res) => {
    // 데이터베이스의 각 요소를 반복하면서 출력
    db.forEach(function(youtuber){
        console.log(youtuber)
    })

    // 데이터베이스의 각 요소를 객체로 변환
    var jsonObject = {}
    db.forEach(function(value, key){
        jsonObject[key] = value
    });

    // JSON 형식으로 변환된 데이터베이스 객체를 응답으로 전송
    res.json(jsonObject)
})

JS forEach

//foreach-demo.js

/*
* 배열
*/

const arr =[1, 2, 3, 4, 5]

/* 
* 콜백 함수가 하는 일?
* 객체 (또는 배열)에서 요소를 하나 꺼낸 다음 불리는 콜백함수.
* 
* 따라서 객체(또는 배열)에서 요소를 하나 꺼낸 다음 매개변수로
* 그 요소를 전달하여 호출되는 콜백함수
*/ 

arr.forEach(function(a, b, c){
        //      a : 데이터, b: 인덱스 c : 객체 통째로
    console.log(`a : ${a}, b : ${b}, c : ${c}`)
})

map과 foreach의 만남

//foreach-demo.js
let map = new Map()
map.set(7, "seven")
map.set(9, "nine")
map.set(8, "eight")

map.forEach(function(a, b, c){
             //  a : value, b: key c : 통째로
    console.log(`a : ${a}, b : ${b}, c : ${c}`)

})

JS map

• foreach와 map은 마지막에 어떻게 반환해주느냐에 대한 차이가 있다.

// map-demo.js
// map 함수(메서드) vs foreach 차이
const arr =[1, 2, 3, 4, 5]

arr.forEach(function(a, b, c){
        //      a : 데이터, b: 인덱스 c : 객체 통째로
    console.log(`a : ${a}, b : ${b}, c : ${c}`)
})
console.log()

arr.map(function(a, b, c){
    //      a : 데이터, b: 인덱스 c : 객체 통째로
console.log(`a : ${a}, b : ${b}, c : ${c}`)
})

// 출력결과
a : 1, b : 0, c : 1,2,3,4,5
a : 2, b : 1, c : 1,2,3,4,5
a : 3, b : 2, c : 1,2,3,4,5
a : 4, b : 3, c : 1,2,3,4,5
a : 5, b : 4, c : 1,2,3,4,5

a : 1, b : 0, c : 1,2,3,4,5
a : 2, b : 1, c : 1,2,3,4,5
a : 3, b : 2, c : 1,2,3,4,5
a : 4, b : 3, c : 1,2,3,4,5
a : 5, b : 4, c : 1,2,3,4,5

• 이렇듯 기능의 차이는 없어보인다.

❓ 그렇다면 반환은 어떤 차이를 보일까?

// map-demo.js
// map 함수(메서드) vs foreach 차이
const arr =[1, 2, 3, 4, 5]

const foreachArr = arr.forEach(function(a, b, c){
    return a * 2
})
console.log(arr)

const mapArr = arr.map(function(a, b, c){
    return a * 2
})
console.log(arr)

console.log(`foreach로 return하면 ${foreachArr},
map으로 return하면 ${mapArr}`)

// 출력 결과
[ 1, 2, 3, 4, 5 ]
[ 1, 2, 3, 4, 5 ]
foreach로 return하면 undefined,
map으로 return하면 2,4,6,8,10

• foreach는 return을 하는 척 만하고 저장을 안한다.
• map는 return을 하고 새로운 arr하나 더 저장을 해준다.

JS delete

🔥DELETE(삭제)를 활용해서 유튜버를 삭제🔥

3)개별 유튜버”삭제” → DELETE /youtubers/:id

• url이 개별 유튜버 조회랑 같은 데 괜찮낭 ❓
• 앞에 있는 http 메소드가 달라서 괜찮다. GET 과 DELETE로
• req : params.id
• res : “channelTitle님, 아쉽지만 다음에 또 뵙겠습니다. ”

// youtuber-demo.js
app.delete('/youtubers/:id', (req, res) =>{
    let {id} = req.params
    id = parseInt(id)

    const channelTitle = db.get(id).channelTitle
    db.delete(id)

    res.json({
        message :`${channelTitle}님, 아쉽지만 우리 인연은 여기까지 인가요..`
    })
})

• const channelTitle = db.get(id).channelTitle 삭제 하면 message 날릴 때, id를 모르니깐 삭제 하기 전에 미리 저장
• 만약에 없는 url로 localhost:1234/youtubers/7 이렇게 한다면?
• 당연히 오류 나지**, 예외처리**를 해주자.
• 삭제를 하기 전에 있어야 삭제를 하지 그러면 마찬가지로 삭제를 하기 전에 예외처리를 해주자.

// youtuber-demo.js
app.delete('/youtubers/:id', (req, res) =>{
    let {id} = req.params
    id = parseInt(id)
    var youtuber =db.get(id)

    if(youtuber == undefined){
        res.json({
            message :`요청하신 ${id}번은 없는 유튜버입니다.`
        }) 
    }else{
        const channelTitle = youtuber.channelTitle
    db.delete(id)

    res.json({
        message :`${channelTitle}님, 아쉽지만 우리 인연은 여기까지 인가요..`
    })
    }

})

• id 를 조회 해서 없으면 예외 처리
• 조회를 2번 하니 미리 저장 → 오류 방지

리팩토링 : 수정 후 추가

리 - 팩토링 은 다음과 같은 목적을 가지고 소프트웨어의 코드 내부(구조)를 변경하는 것

1. 이해하기 쉽게 바꾸고 싶을 거 같다.
2. 성능적으로 높이고 싶다
3. 안정성

리팩토링은 언제 해야할까 ❓

1. 에러(문제점)이 n회 발견되었을 때, 리팩토링은 해야한다.
2. 리팩토링을 하면서, 에러(문제점)을 발견할 수 있다.
3. 기능을 추가하기 전 ex. API URL “설계”
4. 코드 리뷰할 때,

언제 하면 안될까❓

1. 배포, 운영 직전에는 절대로 코드 수정이 일어나서는 안된다.

전체 + 전체 조회 : 없다 메시지

🔥DELETE(삭제)를 활용해서 유튜버를 삭제🔥

1. 전체 유튜버 “삭제” DELETE /youtubers

• req : x
• res : 전체 유튜버가 삭제되었습니다.

// youtuber-demo.js

app.delete('/youtubers', (req, res)=>{
    db.clear()

    res.json({
        message : "전체 유튜버가 삭제되었습니다. "
    })
})

• 유튜버를 n 번 삭제해도 같은 메시지가 나옴.
• 그러면 어떻게 해야될까?값이 없으면, 삭제할 유튜버가 없습니다.

  // youtuber-demo.js
  
  app.delete('/youtubers', (req, res)=>{
      var msg = ""
  
      if(db.size >= 1){
          db.clear()
          msg = "전체 유튜버가 삭제되었습니다."
      }else{
          msg = "삭제할 유튜버가 없습니다."
      }
      
      res.json({
          message : msg
      })
  })
  

• 엄연히 오류는 발생하지 않으니 예외처리는 아님.
• db에 값이 1개 이상이면, 전체 삭제를 해주고

put

1. 개별 유튜버 수정 → PUT /youtubers/:id

• req : params.id , body : channelTitle, 그 외 구독자나 다른건 수정할 필요가 없다.
• res : “(이전)channelTitle님, 채널명이 (새로운)channelTitle로 변경되었습니다.”

//youtuber-demo.js
app.put('/youtubers/:id', (req, res)=>{
    let {id} = req.params
    id = parseInt(id)
    var youtuber =db.get(id)
    var oldTitle = youtuber.channelTitle

    if(youtuber == undefined){
        res.json({
            message :`요청하신 ${id}번은 없는 유튜버입니다.`
        }) 
    }else{
        var  newTitle = req.body.channelTitle
        youtuber.channelTitle = newTitle
        db.set(id, youtuber)

        res.json({
            message : `'${oldTitle}'님, 채널명이 '${newTitle}'님으로 변경되었습니다.`
        })
    }
})

HTTP 상태코드

HTTP (인터넷 상에서 통신할 때 사용하는 규약) 안에 작성되어서 들어가는 “상태”

• 2 : 성공**
  • 조회 성공 : 200
  • 등록 성공 : 201
• 4 : 클라이언트 잘못**
  • 찾는 페이지(리소스)가 없음(url에 맞는 api) : 404
  • 요청 값 제대로 보내,.. : 400 요청한 연산(처리)을 할 때 필요한 데이터(req)가 덜 왔을 때
• 5 : 서버 잘못**
  • 서버가 죽었을 때(서버가 크리티컬한 오류를 맞았을 때) : 500

클라이언트와 소통을 정확하게 하기 위함