주특기 주차 11조 (Node.js) 토론

Q1. for 문이 있는데 for ... in for...of 문법이 새로 나온 이유는 무엇일까요?

우리가 이것을 고르는 기준은 무엇일까요?

for...in

for문으로는 Array가 아닌 Object에 대해서는 원하는 값을 리턴할 수 없으므로

for ... in문법을 사용하여 Object의 key를 순회하며 value값을 리턴할 수 있다.

const obj1 = {
  one: "one",
  two: "two",
  three: "three",
  four: "four",
  five: "five",
};

for (let i = 0; i < Object.keys(obj1).length; i++) {
  console.log(obj1[i]);
} // undefined, undefined, undefined, undefined, undefined

for (let key in obj1) {
  console.log(key);
} // "one", "two", "three", "four", "five"

 

Array의 반복과 for…in

배열에 사용하기에는 정수가 아닌 이름을 가진 속성 또는

상속된 모든 열거 가능한 속성들을 반환하고 반복되는 순서가

구현에 따라 다르기 때문에 일관된 순서로 반복되지 않을수도 있어

순서가 중요한 배열의 반복시에는 숫자 인덱스를 사용할 수 있는

for문 또는 forEach(), for…of의 사용을 권장한다.

또, for문과 같이 Symbol.iterator는 무시하므로 사용할 수 없다.

(Symbol.iterator : iterable한 객체를 정의하기 위한 심볼)

 

for…in을 고르는 기준

객체의 반복을 위해 만들어졌지만 배열의 반복에 대해서는

위 설명과 같이 추천되지 않는 방법이다.

MDN에 따르면, 쉽게 **객체의 속성을 확인(ex.console)**할 수 있기에 실질적으로 디버깅에 사용될 수 있다.

또, 키-값(value) 쌍이 선호되는 데이터의 경우(속성이 ‘key’의 역할)

특정 값을 가진 키가 있는지 확인시 사용할 수 있다.

 

for...of

반복할 수 있는 객체(iterable object)를 순회할 수 있는 반복문이다.

const array = ["one", 2, 3, "four", "오"];
const object = {
  one: "one",
  two: 2,
  three: 3,
  four: "four",
  five: "오",
};

for (let i of array) {
  console.log(i);
} // "one", 2, 3, "four", "오"

for (let j of object) {
  console.log(j);
} // TypeError: object is not iterable

 

반복할 수 있는 객체(iterable object)

Array, Map, Set, String, TypeArray, arguments,Symbol.iterator 등이 있으나

예시는 Array, String, Symbol.iterator정도만 보려한다.

let arr = [10, 20, 30];

for (let i of arr) {
  console.log(i);
}
// 10
// 20
// 30

let string = "boo";

for (let i of string) {
  console.log(i);
}
// "b"
// "o"
// "o"

var iterable = {
  [Symbol.iterator]() {
    return {
      i: 0,
      next() {
        if (this.i < 3) {
          return { value: this.i++, done: false };
        }
        return { value: undefined, done: true };
      }
    };
  }
};

for (var value of iterable) {
  console.log(value);
}
// 0
// 1
// 2

참고자료 : MDN

 

for…in과의 차이점

Object.prototype.objCustom = function () {};
Array.prototype.arrCustom = function () {};

let iterable = [3, 5, 7];
iterable.foo = "hello";

for (let i in iterable) {
  console.log(i); // logs 0, 1, 2, "foo", "arrCustom", "objCustom"
}

for (let i of iterable) {
  console.log(i); // logs 3, 5, 7
}

for…in은 결과값이 속성을 출력하고

for…of는 결과값이 value 그 자체를 출력한다.

 

---

Q2. 자바스크립트에서 유사배열과 배열의 차이는 무엇일까요?

유사배열의 각 요소를 수정하고 싶다면 어떤 과정을 거쳐야할까요?

유사배열은 키 값이 0이상의 양수로 이루어져 있어

배열처럼 보이는 객체이지만 실제론 배열로 보지않기 때문에

배열 매소드를 사용 할 수 없습니다. (ex.forEach)

유사배열의 각 요소를 수정하려면, Array.from()을 이용하여

새로운 배열을 만들 접근하거나 for문과 for in을 사용해서

각 요소를 수정할 수 있습니다.

 

유사배열 예시

const youSaArray = {
  0: "one",
  1: "two",
  2: "three",
  length: 3,
};

 

유사배열의 각 요소를 수정하는 방법

const numbers = {
  0: "one",
  1: "two",
  2: "three",
  length: 3
};

numbers[0] = "zero"

console.log(numbers)
// { '0': 'zero', '1': 'two', '2': 'three', length: 3 }

 

Array.from()을 이용하여 새로운 배열을 만들어 수정하는 방법

const numbers = {
  0: "one",
  1: "two",
  2: "three",
  length: 3,
};

const newNumbers = Array.from(numbers);
newNumbers[0] = "zero";

console.log(newNumbers); // [ 'zero', 'two', 'three' ]

Array.prototype에서 Method를 빌려 수정하는 방법 (call, apply)

const numbers = {
  0: "one",
  1: "two",
  2: "three",
  length: 3,
};

const newNumbers = Array.prototype.push.call(numbers,"four");

console.log(newNumbers); // 4
console.log(numbers)
// { '0': 'one', '1': 'two', '2': 'three', '3': 'four', length: 4 }

 

Q3. restAPI의 put 과 patch 는 어떤 차이점이 있을까요?

어떤 경우에 사용하면 좋을까요?

PUT 요청시 보내야할 데이터 중 일부만 보낼경우는 나머지는 null값으로

수정되는게 원칙이므로, 변경하고자 하는 데이터를 포함하는

나머지 데이터 전부를 보내주어야 합니다.

그러므로 주어진 필드에서 일부 데이터만 수정이 필요한 경우 PATCH를 쓸 수 있습니다.

=> 필드의 전체적인 수정은 PUT, 필드의 일부만 수정은 PATCH

 

PUT과 PATCH의 차이점

PUT은 기존에 데이터가 존재하는 경우 그 데이터 전부를 덮어쓰기 때문에

멱등성이 보장되지만, PATCH의 경우 멱등성이 보장되는 경우도 있고,

그렇지 않은 경우도 있습니다.

개발자는 멱등성 보장 측면에서 선택하여 두 조건 중 하나를 선택할 수 있습니다.

 

멱등성이란 ?

API를 사용했을 때, 원본 데이터가 변경되지 않는다는 보장을 말합니다.

가령 GET, PUT, DELETE의 경우 멱등성이 반드시 보장되지만,

POST나 PATCH는 아닐수 있습니다.

 

 

 

Q4. 몽고DB로 테이블 설계를 해봅시다. 회원가입을 한 유저가 게시판에 글을 쓰는 서비스입니다.

게시판 목록 페이지에서는 게시글 제목, 작성자 이름 등이 보이겠죠?

각각의 모델은 어떤 모양새이면 좋을까요?

게시판 글 리스트를 불러오는 api 에서는 몽구스 데이터를 어떻게 가져오면 좋을까요?

 

회원가입 Schema → 이름, 패스워드,이메일,토큰

게시판 Schema → 제목, 글 내용, 작성날짜, 작성자

코멘트 Schema → 댓글내용,댓글 작성자, 작성날짜, 게시글 고유번호

몽구스는 noSQL방식인 mongoDB에서도 스키마를 지정하여 정해진 양식의 데이터를 저장하거나 가져올 수 있습니다. GET 방식으로 지정된 라우터로 접속한 뒤에 find() method를 사용하여 게시판 Schema의 인스턴스에 저장된 데이터를 가져올 수 있습니다.

 

 

 

 

Q5. 우리가 브라우저에서 구매한 도메인 주소를 입력하면 만들어 놓은

AWS EC2 서버까지 전달이 되어서 해당 서버에게 요청을 보낼 수 있습니다.

이 과정이 상세하게 어떻게 진행되는지 그림으로 한번 그려볼까요?