prototype 부모가 자식에게 물려준다~

Jo yun hee·2022년 6월 6일
0

javaScript

목록 보기
15/17

앞에서 정리한 constructor을 상속이라고도 한다. 부모가 자식에게 물려준다~
상속을 구현할 수 있는 문법 하나만 더 배워보자! 바로바로~~ 프로토타입!!

상속을 구현할 수 있는 prototype

한마디로 유전자!

constructor을 만들면 프로토타입(유전자) 공간이 자동으로 생긴다.

function 기계(){
  this.name = 'Kim';
  this.age = 15;
}

기계.prototype.gender = '남';
var 학생1 = new 기계();
var 학생2 = new 기계();

console.log(학생1.gender); //'남'이 출력됩니다

부모가 유전자에 등록을 하면 자식들도 .gender를 쓸수있다.

자바스크립트가 gender를 찾는 법
1. 학생1이 직접 gender를 가지고 있는지 확인한다.
2. 학생1이 없다면 부모에게 찾아가 확인한다.


학생1.toString(); (Object/Array에 붙일수 있는 내장함수)

학생 1은 toString을 가지고 있지 않아도 쓸수 있는 이유는?
부모유전자를 본다. 부모유전자에 있기때문에!! 사용가능하다

그 부모는 누구인가?

let arr = [1, 2, 3];
let arr = new Array (1, 2, 3); //실제 어레이가 만들어지는 방식

new Array() 이게 무슨 뜻입니까???
constructor의 의미와 같다. 어레이라는 기계로 부터 자식을 하나 만들어 주세요 라는 뜻!

위와 아래는 같은거다~~~

자바스크립트가 부모를 찾는 법
1. arr에 sort()가 있는가?
2. 그럼 arr 부모의 유전자에 sort()가 있는가? 콘솔창에 Array.prototype을 쳐보자~ 그러면 다양한 내장함수들이 나온다.

그럼 Object자료형은 어떻게 만들어지는지 살펴보자!

let obj = { name : 'Kim' };
let obj = new object(); //실제 obj가 만들어지는 방식

상속으로 만들어지고 있다

그러면~~상속시키는 방법 두가지 (constructor, prototype) 차이점은?

자식들이 값을 직접 갖고싶다면 constructor이고 부모만 가지고 참조해서 쓰고싶다면 prototype을 사용하자. 보통은 상속할수 있는 함수 같은 것들은 prototype으로 만들어 놓는다.

문제를 풀어보자

var 학생1 = { name : 'Kim', age : 20 }
var 학생2 = { name : 'Park', age : 21 }
var 학생3 = { name : 'Lee', age : 22 }
constructor문법을 사용해서 위의 오브젝트와 똑같은 오브젝트 3개를 한번 뽑아보자.

function Student(name, sge){
	this.name = name;
  	this.age = age;
  	this.sayHi = function(){
    console.log(`안녕 나는 ${this.name}이야`)
    }
}

let 학생1= new Student('Kim', 20);
let 학생2= new Student('Park', 21);

참고: 애플코딩

0개의 댓글