본문 바로가기
Programming

[Javascript] __proto__ 접근자 프로퍼티 이해하기

by 개발자 염상진 2022. 5. 14.

Can I use __proto__ in javascript?

What is the difference between __proto__ and Object.getPrototypeOf?

 

 

 

 

 

 

 

[Javascript] Prototype 이란?

객체지향 프로그래밍이란? Javascript는 명령형, 함수형, 프로토타입 기반 객체 지향 프로그래밍 언어로 정의할 수 있다. 기존 객체지향 언어와 차이점이 있다면 객체 지향 언어보다 효율적인 객체

about-tech.tistory.com

 

 

 

 

__proto__ 접근자 프로퍼티를 사용하는 이유?

 

Javascript에서 [[Prototype]]은 Object.prototype에서 상속받게 된다. 프로토타입에 접근하기 위해 __proto__ 접근자 프로퍼티를 사용하게 되는데, 이 이유는 상호 참조에 의해 프로토타입 체인이 생성되는 것을 방지하기 위함이다.

 

프로토타입 체인은 단방향으로만 흘러가도록 설계해야 한다. 즉 링크드 리스트 구조로 구현되어야 한다. 만약 객체 A와 객체 B가 서로를 참조하는 순환 참조에 빠지게 되면 프로토타입 체인 종점이 사라지게 되기 때문에 무한 루프에 빠지게 된다.

 

객체 a와 객체 b를 생성했다. 이 후 서로의 prototype의 get 메소드를 호출해서 값을 설정한다. 만약 서로를 참조하는 형태의 체이을 형성하면 Cyclic __proto__ value 에러를 띄우게 된다. 

 

 

코드 내에서 __proto__ 사용할 수 있나요?

 

__proto__는 일부 브라우저에서 지원하고 있는 프로퍼티로 호환성 때문에 ES6에서 표준으로 채택되었다. 직접 상속을 통해 Object.prototype을 상속받지 않는 객체가 존재할 수도 있기 때문에 코드 내에서 __proto__ 접근자 프로퍼티를 사용하는 것은 표준에 맞지 않다.

 

아래 코드를 보면 Object.craete(null)로 객체를 생성한다. 즉 prototype 프로퍼티를 상속받지 않는 객체이기 때문에 __proto__ 접근자 프로퍼티로 프로토타입에 접근이 불가능하다.

 

위와 같이 생성된 객체의 프로토타입에는 __proto__  접근자 프로퍼티로 GET 메소드를 호출하면 undefined 결과를 리턴한다. Object.prototype을 상속받지 않기 때문에 __proto__로는 해당 객체의 프로토타입에 접근이 안된다.

// 객체의 프로토타입에 접근([GET] 메소드 호출);
console.loc(c.__proto__);

 

Object.prototype을 상속받지 않는 객체에 접근하기 위해서 사용해야 할 메소드는 Object.getPrototypeOf()Object.setPrototypeOf()을 사용해야 한다.

 

newObj 객체를 생성한다.

person 객체를 생성한다.

newObj 객체에 Object.getPrototypeOf() 메소드로 접근한다.

Object.setPrototypeOf() 메소드로 프로토타입의 값을 조작한다.

 

 

 

 

[Programming] JSON 이란?

JSON 이란? JSON(JavaScript Object Notation)은 데이터 포맷의 한 형식이다. 네트워크에서 다른 사용자에게 데이터를 전송할 때 특정 포맷을 사용해야 하는데, 이 중 XML, JSON 등의 포맷이 존재한다. 네트워

about-tech.tistory.com

 

댓글