딥다이브 책읽기_생성자함수, 일급객체, 프로토타입
17장. 생성자함수로 객체생성하기
1. Object 생성자 함수
new object()
- new연산자와 함께 호출하여 인스턴스를 생성한다.
객체리터럴에 비하면 번거롭지만 프로퍼티 구조가 비슷한 인스턴스를 여러개 만들때 효율적으로 사용할 수 있다.
*함수 호출 방식 ★☆
function foo() {
console.log(this);
}
foo(); //window or global - (일반객체로서 호출)
const obj = { foo }; //ES6 프로퍼티 축약표현 - { foo: foo }와 같다.
obj.foo(); //obj - (메서드로서 호출)
const con = new foo(); //con - 생성자함수로서 호출#1 일반함수로서 호출 : this는 전역객체를 바인딩함.
#2 메서드로서 호출 : 메서드를 호출한 객체(마침표 앞의 객체)
#3 생성자함수로서 호출 : 생성자 함수가 (미래에) 생성할 인스턴스
const person = {
name: 'Lee',
sayHi: function() {
console.log(`Hi ${this.name}`);
},
};
person.sayHi(); //Hi Lee -메서드로써 호출(caller)
console.log(new person.sayHi()); //Hi undefined -생성자함수로서 호출(constructor)const person = {
name: 'Lee',
sayHi() { //축약표현 - 동작이 달라짐.
console.log(`Hi ${this.name}`);
},
};
console.log(new person.sayHi()); //TypeError: person.sayHi is not a constructor함수객체
모든 함수 객체는 callable이다.
constructor인 함수객체와 non-constructor인 함수객체로 나뉜다.
- constructor: 함수선언문, 함수표현식, 클래스
- non-constructor: 메서드(ES6축약표현), 화살표함수
function Person(name) {
//this = {} -암묵적으로 빈객체가 만들어지고 this에 바인딩된다.
this.name = name;
this.sayHi = function() {
console.log(`Hi! My name is ${this.name}.`);
};
// return this -암묵적실행으로 this 리턴한다.18장. 함수와 일급객체
일급객체의 조건
- 무명의 리터럴로 생성할 수 있어 런타임에 생성이 가능하다.
- 변수나 자료구조(객체, 배열)등에 저장할 수 있다.
- 함수의 매개변수로 전달할 수 있다.
- 함수의 반환값으로 사용할 수 있다.
즉, 함수를 객체와 동일하게 사용할 수 있고
값을 사용할수 있는 곳에서 {}로 사용되면 함수객체=일급객체라고 볼 수 있다.
함수객체(일급객체)는 일반객체와 달리 호출이 가능하고
함수 고유의 프로퍼티([[caller]], [[argument]], [[length]],[[prototype]])를 가지고 있다. (-> console.dir메서드로 확인가능)
*argument의 값 = argument객체(인수정보를 담은 배열같은 객체)
**argument객체의 length프로퍼티 = 인자의 개수(초과된 인수포함) / 함수객체의 length = 매개변수의 개수
__proto__접근자 프로퍼티
내부슬롯 [[Prototype]] => 상속을 구현하는 프로토타입 객체
이 프로토타입 객체에 __proto__라는 프로퍼티로 간접접근
__proto__접근자 프로퍼티는 Object.prototype의 프로퍼티다. 즉 객체가 직접소유하고 있는 프로퍼티가 아니다.
*모든객체는 Object.prototype을 상속하고 있다. 즉 Object.prototype는 모든 객체의 최상위(부모)객체.
따라서 모든 객체는 __proto__를 사용할 수 있는 것이다.
*hasOwnProperty메서드 인수로 전달받은 프로퍼티키가 객체고유의 프로퍼티키면 true,
상속받은 프로토타입의 프로퍼티키면 false
19장. 프로토타입
자바스크립트 = 프로토타입 기반의 객체지향 프로그래밍 언어
상속 : 어떤 객체의 프로퍼티 또는 메서드를 다른 객체에서 상속받아 그대로 사용하는 것.
프로토타입객체를 만들고, 여러개의 인스턴스가 해당 객체의 메서드를 상속받아 사용함으로써
불필요한 중복생성을 방지하고, 재사용성을 높인다.
function Person(name) {
this.name = name;
// this.sayHi = function() {
// console.log(`Hi! My name is ${this.name}.`);
// };
Person.prototype.sayHi = function() {
console.log(`Hi! My name is ${this.name}.`);}
}
const me = new Person('Lee');
console.log(me);
me.sayHi();
//추가설명을 위한 슈도코드임(실코드x)
const Person = {
prototype: {construntor: person}
}