Skip to content

Latest commit

 

History

History
81 lines (49 loc) · 2.54 KB

1-5.생성자함수내부에서의this.md

File metadata and controls

81 lines (49 loc) · 2.54 KB

back    |    write by Santos

1-5.생성자 함수 내부에서의 this


* 이 글은 코어자바스크립트 책을 참고하여 기록하였습니다.

생성자 함수는 new를 이용해 호출 할 수 있으며, 내부에서의 this는 새로 만들 구체적인 인스턴스 자신을 할당.

1. 생성자 함수 내부에서의 this

- 생성자 함수는 어떤 공통된 성질을 지니는 객체들을 생성하는 데 상용하는 함수.

- 프로그래밍적으로 '생성자'는 '구체적인 인스턴스를 만들기 위한 일종의 틀'.

- 예를 들어 인간의 공통 특성인 직립보행, 언어 구사, 도구 사용 등을 한데 모아 인간이라는 집합을 정의한 것이 '클래스', 이 클래스를 구체화 하는 것이 '인스턴스'.

- new 명령어와 함께 함수를 호출하면 생성자의 prototype 프로퍼티를 참조하는 __proto__라는 프로퍼티가 있는 객체(인스턴스)를 만들고, 미리 준비된 공통 속성을 해당 객체(this)에 부여.

- 생성자 함수와 관련된 내용은 7장에서 상세히 설명.

예시 😎

var Cat = function (name, age){
    this.bark = '야옹';
    this.name = name;
    this.age = age;
};

var choco = new Cat('초코', 7);
var nabi = new Cat('나비', 5);

console.log(choco);         // Cat { bark: '야옹', name: '초코', age: 7 };
console.log(nabi);          // Cat { bark: '야옹', name: '나비', age: 5 };

* 예시를 통해 알아야 할 것들 🤔

  1. Cat 생성자 함수 내부에서는 this에 접근해서 bark, name, age 프로퍼티에 각각 해당 값을 대입.

  2. new 명령어와 함께 Cat 생성자 함수를 호출해서 변수 choco, nabi에 각각 할당.

  3. choco, nabi를 출력해보니 각각 Cat 클래스의 인스턴스가 출력됨.

- new 명령어와 함께 Cat 생성자 함수를 호출했을 때 함수 내부에서의 this는 변수 choco, nabi의 인스턴스를 바인딩.

읽어 주셔서 감사합니다.


<참고자료>

[책] #코어자바스트립트 - 정재남 지음 -

생성자 함수 내부에서의 this end