프로토타입의 예를 한번 만들어봐라
function Person() {}
Person.eyes = 2;
Person.prototype.nose = 1;
var kim = new Person();
var park = new Person();
console.log(kim);
console.log(kim.eyes);
console.log(Person.prototype.nose);
저렇게하면 person의 프로퍼티가 바뀌는게 아니라
인스턴스를 만들때마다 생성자로 인하여 인스턴스의 프로퍼티가 생기는거같다.
더 잘 볼수있는 예가 하나 있다.
function YalcoChicken (name, no) {
this.name = name;
this.no = no;
this.introduce = function () {
return `안녕하세요, ${this.no}호 ${this.name}점입니다!`;
}
}
// 본사의 정보와 업무
YalcoChicken.prototype.brand = '얄코치킨';
YalcoChicken.prototype.contact = function () {
return `${this.brand}입니다. 무엇을 도와드릴까요?`;
};
// YalcoChicken.brand = '얄코치킨';
// YalcoChicken.contact = function () {
// return `${this.brand}입니다. 무엇을 도와드릴까요?`;
// };
const chain1 = new YalcoChicken('판교', 3);
console.log(chain1.brand);
// 프로토타입의 있고 없고 차이가 큰걸 보길
function YalcoChicken (name, no) {
this.name = name;
this.no = no;
this.introduce = function () {
return `안녕하세요, ${this.no}호 ${this.name}점입니다!`;
}
if (!new.target) { // 이 부분을 지우고 다시 해 볼 것
return new YalcoChicken(name, no);
}
}
const chain1 = new YalcoChicken('판교', 3);
const chain2 = YalcoChicken('강남', 17);
console.log(chain1);
console.log(chain2);
YalcoChicken 생성자 함수에 if (!new.target) 코드가 추가되어 있습니다. 이 코드는 생성자 함수가 new 연산자 없이 일반적인 함수 호출로 실행되는 것을 방지하기 위해 사용됩니다. new.target은 new 연산자를 사용하여 생성된 객체를 가리키는 변수로, new 연산자를 사용하지 않고 생성자 함수를 호출할 경우 new.target 값은 undefined가 됩니다.
따라서 if (!new.target) 조건이 참이 되는 경우, 생성자 함수가 new 연산자를 사용하여 재귀적으로 호출되어 객체를 생성하고 반환합니다. 이를 통해 생성자 함수가 new 연산자 없이 호출되더라도 객체가 올바르게 생성되도록 보장할 수 있습니다.
예를 들어 const chain1 = new YalcoChicken('판교', 3); 구문은 new 연산자를 사용하여 생성자 함수를 호출하므로, if (!new.target) 조건이 거짓이 되어 객체가 생성됩니다. 반면 const chain2 = YalcoChicken('강남', 17); 구문은 new 연산자를 사용하지 않고 생성자 함수를 호출하므로, if (!new.target) 조건이 참이 되어 생성자 함수가 재귀적으로 호출되어 객체가 생성됩니다.
따라서 console.log(chain1); 구문은 생성된 객체를 출력하며, console.log(chain2); 구문도 동일하게 객체를 출력합니다. 두 구문 모두 생성된 객체의 name, no, introduce 속성이 포함된 것을 확인할 수 있습니다.
댓글 영역