기본 상속 (prototype)
function Person(name, age){
this.name = name;
this.age = age;
}
function Programmer(name, age, lan){
Person.call(this, name, age); // prototype을 추가해도 변수?들은 상속이 안된다. 기능만 된다.
this.lan = lan;
}
Programmer.prototype = Object.create(Person.prototype); // 새 객체를 생성해서 prototype을 할당한다.
// 새 객체를 생성하지 않고, Person.prototype을 그대로 넣으면, 추후 Programmer.prototype에 기능을 추가했을때, Person.prototype에도 같이 추가된다.
// Programmer.prototype = new Person(); // 파라미터는 어떻게...??
Programmer.prototype.constructor = Programmer; // constructor가 Person이다. 문제의 소지가 있으므로 고쳐야 함.
* prototype chain
생성자 A를 상속받은 생성자 B -> 생성자 B를 상속받은 생성자 C
생성자 C로 만든 객체 인스턴스는 생성자 A, B의 property를 사용할 수 있다.
property를 찾을때, 먼저 C에서 찾고 없을 경우 B, A 로 차례대로 위로 거슬러 올라감.
연결에 연결된거라 chain이라고 함.
출처 & 참고
상속 opentutorials.org/course/743/6572
prototype opentutorials.org/course/743/6573
function Car(color){
this.color = color;
}
const car1 = new Car('blue');
const car2 = Object.create(Object.prototype);
위와 같은 코드가 있을 때, car1은 생성자가 실행되면서 Car가 가지고 있는 모든 속성을 부여받는다.
car2는 Object.prototype 속성들을 부여 받지만 생성자가 실행되지 않음
무슨말이여!!!!!!!!!😳😳😳😳😳😭😭😭😭
car1은 생성자가 실행된 새로운 객체.
car2는 생성자가 실행되지는 않았지만 새로운 객체.
둘다 속성들은 부여받음.
그냥 이렇게 이해하기로 함.
출처 & 참고
mdn developer.mozilla.org/ko/docs/Learn/JavaScript/Objects/Inheritance
다른분블로그 helloinyong.tistory.com/60
Object.keys() VS Object.prototype.toString() 차이
function Person(){}
var o = new Person();
Person.greeting = function(){ console.log('hello'); };
o.greeting(); // 에러 : o.greeting is not a function
Person 생성자를 이용해서 객체를 생성하면, 그 당시의 생성자의 속성들을 가지고 객체가 만들어짐.
객체 o는 greeting함수가 없을 때 생성된 객체이기 때문에, o.greeting은 에러.
만약 Person.prototype.greeting으로 선언한다면 객체 o가 생성된 후에 greeting함수가 선언되었어도 사용가능.
상속받은 객체에 greeting을 넣었기 때문에.
** 정리 : Person.greeting은 생성자 내의 함수. 상속되지 않음.
** Object.keys() 와 같은 함수는 Object 생성자내에 직접 정의된 함수. -> 상속 불가능.
Object.prototype.toString() 과 같은 함수는 Object.prototype에 있는 함수 -> 상속 가능.
출처 & 참고
opentutorials.org/course/743/6578
추가
prototype의 함수로 선언된 경우.
for문으로 전체를 출력하면, prototype 함수까지 나온다.
그래서 Object.prototype의 함수로 선언하는 것(Object확장)은 위험쓰다!!
모든 객체들에 적용할 수 있지만,
모든 객체들에 적용되기 때문에 의도치 않게 영향을 미치게 되는 일이 발생할 수 있음 ㅜㅜ
그러나!
객체.hasOwnProperty(프로퍼티이름) 으로 객체에 직접 정의된 속성인지 확인하는 방법도 있다.
prototype으로 상속받은 속성의 경우에는 false로 반환된다.
출처
Object opentutorials.org/course/743/6578
'Front > Java Script' 카테고리의 다른 글
오브젝트의 가변성(참조형) & Spread Operator ([ ... ], { ... }) (0) | 2021.05.11 |
---|---|
전역객체 / this & this의 제어 (0) | 2021.04.20 |
객체의 생성 ( 생성자 & new ) (0) | 2021.04.20 |
함수의 호출(call & apply) (0) | 2021.04.20 |
arguments VS parameter (0) | 2021.04.20 |