>웹 프론트엔드 >JS 튜토리얼 >JavaScript_javascript 기술에서 프로토타입과 프로토의 관계에 대한 심층 분석

JavaScript_javascript 기술에서 프로토타입과 프로토의 관계에 대한 심층 분석

WBOY
WBOY원래의
2016-05-16 15:32:191032검색

prototype, 각 함수 객체에는 객체의 프로토타입을 나타내는 표시된 프로토타입 속성이 있습니다(예외는 프로토타입 속성이 없는 Function.prototype 함수 객체입니다).

__proto__: 각 개체에는 해당 프로토타입 개체를 가리키는 __proto__라는 내부 숨겨진 속성이 있습니다(이름은 Chrome 및 Firefox에서 __proto__이며 액세스할 수 있음). 프로토타입 체인은 __proto__를 기반으로 구성됩니다

(참고: 함수 객체의 속성 프로토타입을 기반으로 하지 않음).

간단히 말하면: __proto__는 내부 프로토타입이고 프로토타입은 생성자 프로토타입입니다(생성자는 실제로 함수입니다)

생성자의 프로토타입은 객체입니다

그럼 생성자란 무엇일까요?

객체를 생성하려면 먼저 객체 생성자가 있어야 합니다. PHP에서와 마찬가지로 객체를 생성하려면 먼저 클래스가 있어야 합니다.
생성자의 본질은 함수입니다. 다음 질문은 이 생성자를 통해 객체를 생성하는 방법입니다.

정답: 새로운

생성자는 객체를 생성합니다.

1. 모든 생성자/함수의 __proto__는 빈 함수(빈 함수)인 Function.prototype을 가리킵니다.

Number.__proto__ === Function.prototype
//참
Boolean.__proto__ === Function.prototype
//참
String.__proto__ === Function.prototype
//참
Object.__proto__ === Function.prototype
//참
Function.__proto__ === Function.prototype
//참
Array.__proto__ ===
함수.프로토타입
//참
RegExp.__proto__ === Function.prototype
//참
오류.__proto__ ===
함수.프로토타입
//참
날짜.__proto__ ===
함수.프로토타입
//참

에서는 Number 등이 모두 생성자이며, 이러한 생성자는 실제로 Function의 객체라고 설명합니다. 즉, var Number = new Function();

과 동일합니다.

JavaScript에는 총 12개의 내장 생성자/객체가 있습니다(JSON은 ES5에 새로 추가됨). 다음은 액세스 가능한 생성자 8개입니다. 나머지 Global 등은 직접 접근이 불가능하고, Arguments는 함수 호출 시 JS 엔진에 의해서만 생성되며, Math와 JSON은 객체 형태로 존재하므로 new가 필요하지 않습니다. 그들의 __proto__는 Object.prototype입니다. 다음과 같이

Math.__proto__ === Object.prototype
//참
JSON.__proto__ === Object.prototype
//참

위에 언급된 "모든 생성자/함수"에는 확실히 사용자 지정 항목이 포함됩니다. 다음과 같이

// 함수 선언
함수 사람()
{}
// 함수 표현
바르 맨
=
함수()
{}
console.log(Person.__proto__ === Function.prototype)
//참
console.log(Man.__proto__ ===
함수.프로토타입)
//참

이게 무슨 뜻인가요?

모든 생성자는 Function.prototype에서 나오며 루트 생성자 Object와 Function 자체도 마찬가지입니다. 모든 생성자는 Function.prototype의 속성과 메서드를 상속합니다. 길이, 호출, 적용, 바인딩(ES5) 등이 있습니다.

Function.prototype은 XXX.prototype 유형이 "function"인 유일한 프로토타입이기도 합니다. 다른 생성자의 프로토타입은 객체입니다. 다음과 같이

console.log(Function.prototype 유형)
// 함수
console.log(Object.prototype 유형)
//객체
console.log(Number.prototype 유형)
//객체
console.log(Boolean.prototype 유형)
//객체
console.log(String.prototype 유형)
//객체
console.log(Array.prototype 유형)
//객체
console.log(RegExp.prototype 유형)
//객체
console.log(Error.prototype 유형)
//객체
console.log(Date.prototype 유형)
//객체
console.log(Object.prototype 유형)
//객체

아, 위에서도 빈 함수라고 했는데, Alert(Function.prototype)를 살펴보겠습니다.

우리는 모든 생성자(내장 및 사용자 정의 포함)의 __proto__가 Function.prototype이라는 것을 알고 있는데, Function.prototype의 __proto__는 누구입니까?

JavaScript의 함수도 일급 시민이라는 말을 들어보셨을 텐데요, 이를 어디서 보여줄 수 있나요? 다음과 같이

console.log(Function.prototype.__proto__ ===
Object.prototype)
//참

이는 모든 생성자도 일반 JS 객체이며 생성자에 속성을 추가/제거할 수 있음을 보여줍니다. 동시에 Object.prototype의 모든 메소드(toString, valueOf, hasOwnProperty 등)도 상속합니다.

Object.prototype의 __proto__는 누구인가요?

Object.prototype.__proto__ ===
널 //
사실

Function, Object, Prototype, __proto__의 메모리 관계 다이어그램을 공유하겠습니다

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.