본문 바로가기

Front-end/Javascript

Effective Javascript(5,6,7장)

5. 배열과 딕셔너리


item43. 직접적인 객체의 인스턴스로 가벼운 딕셔너리를 만들어라

객체는 문자열 프로퍼티의 이름을 값으로 매핑하기때문에
딕셔너리, 즉 문자열을 값으로 매핑하는 collections를 구현하는데 매우 간편하다.

for...in 문을 통해 객체의 프로퍼티 명을 열거하기 쉬움

하지만, 모든 객체는 prototype객체의 프로퍼티를 상속하기때문에

인스턴스에서 관리하는 프로퍼티 외에  prototype에서 고정된 프로퍼티또한 포함하게 됨

 

  • 배열을 생성하고 배열에 프로퍼티를 추가하는 방식은 프로토타입을 오염시킬수 있음
  • 객체를 리터럴로 생성하고 프로퍼티를 추가하는 방식은 Object.prototype에 프로퍼티 추가가 가능하여 안전함이 보장되지 않음
  • 객체리터럴을 사용해 가벼운 딕셔너리를 만들어 사용
  • 가벼운 딕셔너리는 for...in 반복문 내에서 프로토타입 오염을 막기위해 Object.prototype의 직접적인 자손이어야함

 


item44. 프로토타입 오염을 막기 위해 null 프로토타입을 사용하라

프로토타입 오염을 막기위해 프로토타입이 비어있는 객체를 만들어야한다
var x = Object.create(null);
Object.getPrototypeOf(x) === null; // true

-> es5 에서 처음으로 프로토타입이 없는 객체를 표준적인 방법으로 제공

 

Object.create를 지원하지 않는경우

var x = {__proto__: null };
x instanceof Object;	// false(비표준)

-> 새로운 객체의 프로토타입 연결을 null로 초기화 할수있음

 

  • 딕셔너리의 키로 "__proto__"라는 이름을 사용해선 안됨

item45. 프로토타입 오염을 막기 위해 hasOwnProperty를 사용하라

빈 객체도 Object.prototype의 수많은 프로퍼티들을 상속함
Object.prototype은 hasOwnProperty를 통해 해당 프로퍼티가 인스턴스에만 포함된 프로퍼티인지 확인 가능

다만, 딕셔너리에 hasOwnProperty라는 이름으로 덮어씌워질 수 잇음

이런 상황에 대한 대안

var hasOwn = Object.prototype.hasOwnProperty

//or

var hasOwn = {}.hasOwnProperty;

hasOwn.call(dict, "alice") // 수신자 객체를 지정하여 어떤 객체에서도 호출할수 있음

 

  • 딕셔너리 연산들을 포함하고 __proto__가 키로 사용되는 막기위해 딕셔너리 클래스를 구현하여 사용하는것을 권장

 

'Front-end > Javascript' 카테고리의 다른 글

Effective Javascript(3,4장)  (0) 2023.07.30
Effective Javascript(1,2장)  (0) 2023.07.25
Core javascript(02-실행 컨텍스트)  (0) 2023.05.02
Core javascript(01-데이터 타입)  (0) 2022.11.23