[JavaScript] 17. 프로토타입(3)

📖 모던 자바스크립트 교재) 19장. 프로토타입

12. 정적 프로퍼티/메서드

정적 프로퍼티/메서드는 생성자 함수로 인스턴스를 생성하지 않아도 참조/호출할 수 있는 프로퍼티/메서드이다.

정적 프로퍼티/메서드는 생성자 함수가 생성한 인스턴스로 참조/호출할 수 없다.

➡️ 인스턴스의 프로토타입 체인에 속한 객체의 프로퍼티/메서드가 아니기 때문이다.

 

⭐ 정적 메서드 vs. 프로토타입 메서드

 

예시로 살펴보자면,

Object.create 메서드 : Object 생성자 함수의 정적 메서드 -> Object 생성자 함수가 생성한 인스턴스로 호출 X

Object.prototype.hasOwnProperty 메서드 : Object.prototype의 메서드(모든 객체의 프로토타입 체인의 종점) -> 모든 객체가 호출 O 

---

13. 프로퍼티 존재 확인

1) in 연산자

key in object

key : 프로퍼티 키를 나타내는 문자열

object : 객체로 평가되는 표현식

 

💥 주의할 점!

in 연산자는 확인 대상 객체의 프로퍼티뿐만 아니라, 확인 대상 객체가 상속받은 모든 프로토타입의 프로퍼티를 확인한다.

 

반환값

true : 확인 대상인 객체 내에 특정 프로퍼티가 존재 O (상속받은 프로포타입의 프로퍼티 키인 경우 포함!)

false : 존재 X

 

➕ in 연산자 대신) ES6에서 도입된 Reflect.has 메서드를 사용할 수도 있다.

Reflect.has(object, key)

2) Object.prototype.hasOwnProperty 메서드

Object.prototype.hasOwnProperty(key)

반환값

true : 인수로 전달받은 프로퍼티 키가 객체 고유의 프로퍼티 키인 경우

false : 상속받은 프로토타입의 프로퍼티 키인 경우

---

14. 프로퍼티 열거

1) for...in 문

for (변수선언문 in 객체) { ... }

객체의 모든 프로퍼티를 순회하며 열거한다.

💡 더 정확히 표현하면, 객체의 프로토타입 체인 상에 존재하는 모든 프로토타입의 프로퍼티 중에서, 프로퍼티 어트리뷰트[[Enumerable]]의 값이 true인 프로퍼티를 순회하며 열거한다.

 

❓ 이게 무슨 뜻이냐 ❓ 

for...in 문은 순회 대상 객체 프로퍼티뿐만 아니라, 상속받은 프로토타입의 프로퍼티까지 열거한다.

하지만, 프로토타입 체인 상의 종점지인 Object.prototype의 프로퍼티는 열거되지 않는다.

➡️ Object.prototype의 프로퍼티의 프로퍼티 어트리뷰트 [[Enumerable]], 즉 프로퍼티의 열거 가능 여부의 값이 false이기 때문이다. 

 

💥 프로퍼티 키가 심벌 : 열거 X

💥 객체 자신의 프로퍼티만 열거하고 싶다면(상속받은 프로퍼티를 제외하고) : Object.prototype.hasOwnProperty 메서드 사용하여 확인

2) Object.keys/values/entries 메서드

상속받은 프로퍼티를 제외하고, 객체 자신의 고유 프로퍼티만 열거하기 위해 사용!

 

Object.keys 메서드

객체 자신의 열거 가능한 프로퍼티 키를 배열로 반환

 

Object.values 메서드

객체 자신의 열거 가능한 프로퍼티 값을 배열로 반환

 

Object.entries 메서드
객체 자신의 열거 가능한 프로퍼티 키와 값의 쌍의 배열을 배열에 담아 반환

 

 

📖 참고자료

https://www.inflearn.com/course/%EB%AA%A8%EB%8D%98-%EC%9E%90%EB%B0%94%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8-%EB%94%A5%EB%8B%A4%EC%9D%B4%EB%B8%8C/dashboard