210222 + 혼자서 되묻는 질문 정리

오늘 한 일

• 아침QT
• 모던자바스크립트 Deep dive (219-312p)
  • 프로퍼티 어트리뷰트
  • 생성자 함수에 의한 객체 생성
  • 함수와 일급객체
  • 프로토타입
  • strict mode
• 실전 리액트 프로그래밍
  • 1-1. 리액트란 무엇인가
  • 1-2. 리액트 개발 환경 직접 구축하기

느낀점

프로젝트 기간을 거치고나서 요즘 일주일 정도는 이전에 읽었던 책들을 다시 읽고 있다. 오히려 프로젝트들이 끝나고 나니 이해되는 내용들이 많았다.
회독을 거듭할 수록, 이전에 놓치거나 궁금했던 부분들을 스스로 답하고 재정의할 수 있어서 효과를 거두고 있다. 아직 몇몇 내용은 세세히 나의 언어로 설명하기는 조금 어렵지만, 온전한 나의 블로그를 만들어 (github io) 제대로 한번 설명 해보고 싶다는 다짐을 하게 되었다.

자바스크립트는 프로토타입을 기반으로 상속을 구현하여 불필요한 중복을 제거한다

라는 문장이 자바스크립트라는 언어의 전체적인 맥을 관통하는 느낌이 들었다. 클래스기반 언어(C++ 자바 등)보다 상속면에서 오히려 더욱 효율적이고 생산적인 객체지향 프로그래밍 능력을 지니고 있음을 다시 깨달을 수 있었다.

스스로 묻고 답해 보기

• 스코프체인, 프로토타입 체인의 차이와 특징은? (287p)
  • 프로토타입 체인: 상속, 프로퍼티 검색을 위한 메커니즘
  • 스코프 체인: 식별자 검색을 위한 메커니즘
  • 별도로 동작하지 않고 서로 협력하여 식별자와 프로퍼티를 검색하는데 사용된다.
    • 특정 값을 검색할 때 스코프체인 순회 이후에 프로토타입에서 찾는다.
• Object.create 사용법에 대해 알고있는가?
• 생성자 함수의 정적 프로퍼티/메소드의 특징을 설명하시오.
  • 정적 프로퍼티/메소드는 prototype으로 객체 안에 포함되지 않기 때문에 상속될 수 없다.
  • 따라서 인스턴스에 포함되지 않기때문에, new 연산자에 쓰이지 않고 단독으로 사용 가능하다.
• for ... in 문을 권하지 않는 이유?
  • 모든 프로퍼티를 순회하기 때문에 객체 스스로의 프로퍼티가 아닌 상속받은 프로퍼티가 [[Enumerable]]일 경우에 문제가 생긴다.
  • 따라서 hasOwnProperty를 사용하거나 배열의 경우 for...of, for문, forEach등으로 대체하여 사용한다.
  • 객체의 경우 Object.entries/keys/values 메소드를 사용한다.
• instance of 메소드에 대해 설명하시오.
• 일급 객체의 특징?
  1. 무명의 리터럴로 생성가능 === 런타임에 생성이 가능
  2. 변수나 자료구조(객체, 배열 등)에 저장 가능 === 구조분해할당 가능
  3. 함수의 반환값으로 사용 가능 === return 값으로 사용 가능
  4. 함수의 매개변수(파라미터)로 사용 가능

// 1. 함수는 무명의 리터럴로 생성 가능
const increase = function (num) {
  return ++num;
}

const decrease = function (num) {
  return --num;
}

//2. 함수는 객체에 저장할 수 있다.
const predicates = { increase, decrease }


//3. 함수를 반환값으로써 사용한 예시
//4. 함수를 매개변수로 사용한 예시
function makeCounter(predicate) {
  let num=0;
  return function() {
    num = predicate(num);
    return num;
  }
};

//4. 함수 매개변수로 사용예시
const increaser = makeCounter(predicates.increase);
console.log(increaser()); // 1

const decreaser = makeCounter(predicates.decrease);
console.log(decreaser()); // 0

• 객체생성방식과 프로토타입의 결정에 대해 설명하시오 (280p)
  • 추상연산 OrdinaryObjectCreate 호출 알아놓기
  • 객체생성방식
    • 객체 리터럴 - OrdinaryObjectCreate: Object.prototype
    • Object 생성자 함수 - OrdinaryObjectCreate: Object.prototype
    • 생성자 함수(new 연산자 호출): 생성자함수의 prototype 프로퍼티에 바인딩되어있는 객체
    • Object.create 메소드
    • 클래스(ES6)
• __proto__ 접근자 프로퍼티에 대해 설명하시오. (257p)
  • [[Prototype]] 내부슬롯이 가리키는 프로토타입 객체에 접근하기 위해 사용하는 접근자 프로퍼티. (Link라고 생각하면 쉽다)
  • 모든 객체가 소유하고 있다.
• prototype 프로퍼티에 대해 설명하시오.(258p)
  • 생성자 함수로 호출할 수 있는 함수 객체 즉, constructor만이 소유하는 프로퍼티이다.
  • 따라서 화살표 함수, ES6 축약표현 메소드, 일반 객체 등은 사용이 불가능하다.