프로토타입(Prototype)
hasOwnProperty
- 객체에는 자신의 프로퍼티인지 확인하는 메소드가 존재함.= hasOwnProperty
- 만든적이 없는데?
proto라는 객체가 있음.
이것을 프로토타입 이라고함.
일단 객체에서 프로퍼티를 읽으려 하는데 없으면
proto라는 객체에서 찾음. - 만약 이름이 hasOwnProperty인 메소드를 객체안에 만들면?
방금 만든 메소드로 동작
=객체에 그 프로퍼티가 있으면 탐색을 멈추고, 없을때만 프로토타입에서 프로퍼티를 찾음.
상속
프로토타입이 어떻게 동작하는지 보기위해 상속을 이용해봄.
위와 같은 3가지 객체가있는데
wheels랑 drive가 모두 동일, 그러면 이런식으로 차가 늘어나면 계속 새로운 변수가 만들어지는건데 비효율, 공통된 부분 처리? proto를 활용
car라는 객체를 만들어서 공통된 부분을 따로 넣어줌.
그리고 proto를 car로 지정하면
car가 bmw의 프로토타입이됨= bmw는 car의 상속받음
bmw.wheels를 했을때 bmw에서 탐색하고 없으면 상속받은 car에서 탐색
- 상속은 계속 이어질 수 있음.
bmw가 car의 상속을 받고,
x5는 또 bmw를 상속받을 수 있음.
- Prototype Chain
프로토타입 체인은 JavaScript에서 객체 간 상속을 구현하는 메커니즘입니다. JavaScript는 프로토타입 기반 언어로서, 모든 객체는 다른 객체를 기반으로 만들어집니다. 객체는 프로토타입이라고 불리는 다른 객체로부터 속성과 메서드를 상속받을 수 있습니다.
프로토타입 체인은 객체의 속성이나 메서드에 접근할 때 사용됩니다. 객체에서 특정 속성이나 메서드를 찾을 때, 해당 객체에 속성이 없다면 JavaScript는 프로토타입 체인을 따라 상위 프로토타입으로 이동하여 찾습니다. 상위 프로토타입에서도 찾지 못하면 계속해서 상위 프로토타입을 탐색하며 이 과정을 반복합니다. 이렇게 상위 프로토타입을 따라가면서 속성이나 메서드를 찾는 것을 프로토타입 체인 탐색이라고 합니다.
- for in 문으로 프로퍼티 탐색하기
상속받은 프로퍼티까지 모두출력됨.
name, color 제외하곤 프로토타입으로 정의한 프로퍼티 - Object.keys, Object.values 로 프로퍼티 탐색하기
키,값과 관련 메소드는 상속된 프로퍼티는 출력되지 않음. - 상속받은 프로퍼티 구분하기
hasOwnProperty는 객체가 직접 가지고 있는 프로퍼티만 반환해줌 - 생성자함수 이용하기
생성자함수를 이용하면 비슷한 객체를 간단하게 만들수 있었음.
그런데 여기서 매개변수로 넘겨준 칼라값 말고 휠이랑 드라이브는 동일하니까 분리할 수 있음.
그런데 매번 객체 만들때마다 proto작업 하면 귀찮
위와 같이 해줘도 똑같음.
생성자함수가 생성하는 객체의 proto를
설정하는거임.
prototype을 이용하면 중복코드 줄임.
한번만 작업해주면 생성자로 만들어진 모든 객체에 일일이 작업필요없음.
인스턴스
생성자함수가 새로운 객체를 만들어 낼때
그 객체는 생성자의 인스턴스 라고 불림.
- instanceof 연산자
자바스크립트에서는 이를 확인 할 수 있는
instanceof연산자가 있음.
이를 이용해 객체와 생성자를 비교할 수 있음.
해당 객체가 그 생성자로 인해 생성된 것인지 확인할 수 있음. true , false를 반환함. - constructor
생성자로 만들어진 인스턴스 객체에는 constructor 라는 프로퍼티가 존재함.생성자를 가르키게 됨
- 그런데 prototype을 풀어쓰지 않고 하나의 객체로 만든다면?
동일하게 동작하지만 constructor가 사라짐.
그렇기 때문에 프로토타입을 덮어쓰지 않고 하나씩 프로퍼티를 덮어쓰는게 좋음.
아니면 constructor를 수동으로 명시하거나.
이렇게 자바스크립트는 명확한 constructor를 보장하지 않음. 언제든 수정될 수 있음.
클로저 이용
위 같은 경우 아무나 색을 변경 가능.
위 같은 경우 초기에 셋팅한 칼라를 얻을 수 만 있고 수정불가. getcolot함수는 생성될 당시의 컨텍스트를 기억.
