본문 바로가기
타입스크립트로 함께하는 웹 풀 사이클 개발(React, Node.js)/TIL

웹풀사이클 16일차 - forEach, map, Delete, put, 리팩토리

by 슈크림 붕어빵 2023. 12. 14.

forEach

 

배열에서 foreach

const arr = ["a", "b", "c", "d", "e"];
arr.forEach(function (a, b, c) {
  console.log(`a: ${a}, b: ${b} c:${c}`);
});

순서에 따라서 a : 데이터 값, b: index, c: 전체를 가진다.

객체 foreach

 

let map = new Map();

map.set(1, "one");
map.set(2, "two");
map.set(3, "three");

map.forEach(function (a, b, c) {
  console.log(`a: ${a}, b: ${b}, c: ${c} `);
});

순서에 따라서 a : 데이터 값, b: index, c: 전체를 가진다.

 

 

Map

foreach와 map 비교

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

const arr1 = arr.forEach(function (a, b, c) { //foreach
  return a * 2;
});

const arr2 = arr.map(function (a, b, c) { //map
  return a * 2;
});
console.log(`forEach: ${arr1}`);
console.log(`map: ${arr2}`);

//forEach: undefined
//map: 2,4,6,8,10

 

forEach: undefined
map: 2,4,6,8,10

 

공통점

  • 두가지 모두 배열을 한바퀴씩 돌며 함수 내 명령 수행

차이점

  • forEach는 리턴한 값을 저장하여 반환해주지 않는다.
  • map은 배열에 리턴한 값 매핑하여 배열로 반환해준다.

유튜버 데모 Api 설계 - delete, put

1. 조회, 2. 추가는 이전 post 참조

 

3. 삭제

 

3-1. 개별 유튜버 삭제 - delete, youtubers/:id

 

app.delete("/youtubers/:id", function (req, res) {
  let { id } = req.params;
  id = parseInt(id);
  let youtuber = db.get(id);
  if (youtuber == undefined) {
    res.json({ message: `${id} 는없는 채널입니다.` });
  } else {
    const name = youtuber.channelName;

    db.delete(id);
    res.json({ message: `${name}님 채널이 삭제되었습니다.` });
  }
});

req : params.id

res: "채널명 님 채널이 삭제되었습니다."  => db에서 delete

 

3-2. 전체 유튜버 삭제 - delete, /youtubers

 

req: x

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

 

4. 개별 유튜버 수정하기 - put, youtubers/:id

 

req: params.id, body{channelName, description}

res: "채널명님 정보가 업데이트 되었습니다."

 

리팩토리

 

1. 이해하기 쉽게

2. 성능

3. 안정성

 

소프트웨어 코드 내부(구조)를 변경하는 것

 

내 코드에 나쁜 부분이 있는지 클린코드를 가질 수 있게됨.

 

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

  • 에러가 n회 발견되었을 때
  • 리팩토링을 하면서 에러를 발견할 수 있다.
  • 기능을 추가하기 전 => why? 기존 기능이 잘 돌아가는지 , 잘 추가되는지 통일감 등등 안정성 성능
    • ex - api url 설계
  • 코드 리뷰할 때

 

리팩토링 하면 안될 때(절대)

  • 배포, 운영 직전

 

HTTP 상태 코드

2xx - 성공

  • ex - 등록 성공 (201)

4xx - 클라이언트 오류 

  • 요청의 문법이 잘못되었거나 요청을 처리할 수 없다.
  • ex - 유효하지 않는 url (404)

5xx - 서버오류

  • 서버가 명백히 유효한 요청에 대해 충족을 실패했다.
  • ex - 서버가 죽었을 때 (500)