JavaScript 프로토타입 체인 및 프로토타입 객체 속성 인스턴스에 대한 자세한 설명

프로토타입 체인:

모든 함수는 생성자가 될 수 있고, 각 함수는 프로토타입 객체를 가지며, 각 프로토타입 객체는 인스턴스화된 객체가 될 수도 있습니다. 예를 들어 생성자 함수인 fun 함수를 생성하고 객체를 인스턴스화합니다. 함수의 프로토타입 객체는 Object의 인스턴스 객체이기도 합니다. 그래서 fun은 함수의 프로토타입 객체에 접근할 수 있는 _proto_ 속성을 가지고 있습니다. 또한 객체의 프로토타입 객체에 접근할 수 있는 _proto_ 속성을 가지고 있습니다. 프로토타입 체인. 인스턴스화된 각 객체는 체인 위의 메서드와 속성에 액세스할 수 있으므로 fun은 Object 프로토타입 객체 아래의 메서드와 속성에 액세스할 수 있습니다. 실제로 모든 객체는 Object의 프로토타입 객체에 액세스할 수 있습니다.

프로토타입 체인 접근 규칙: 먼저 자신 아래에서 검색한 후 프로토타입 체인 레벨을 레벨별로 올라갑니다.

다음과 같습니다:

function Aaa(){}
Aaa.prototype.num = 3;
var a1 = new Aaa();
a1.num =10;
alert(a1.num); //10

프로토타입 객체:

프로토타입 객체 아래에는 세 가지 속성이 있을 수 있습니다:

1 프로토타입 객체가 전달하는 메서드 및 속성 2 생성자 3_proto_attributes

constructor: 생성자 속성, 각 프로토타입 객체 함수 일부 기본 속성은 함수를 가리킵니다.

각 인스턴스화된 객체 자체에는 생성자 속성이 없습니다. 기본적으로 프로토타입 객체를 연결하는 데 사용되는 하나의 _proto_ 속성만 있으며 생성자 자체와 직접적인 연결은 없습니다. 따라서 해당 생성자는 액세스된 프로토타입 객체에 있습니다. 따라서 프로토타입 객체의 생성자가 변경되면 인스턴스화된 객체의 생성자도 변경됩니다. 그러나 객체 자체가 프로토타입 객체이자 인스턴스화된 객체인 경우 생성자 속성을 갖게 되며 프로토타입 객체에서 해당 객체에 액세스할 필요가 없습니다. **

우리가 말하는 내용을 확인하려면 다음 예를 살펴보십시오.

function CreatePerson(name){
 this.name = name;
}
CreatePerson.prototype.showName = function(){
 console.log(this.name);
 };
var p1 =new CreatePerson('haha');
p1.showName();
console.log(p1.constructor); // CreatePerson 来自CreatePerson.prototype
console.log(CreatePerson.prototype);
// {showName:{},constructor:CreatePerson,__proto__:Object.prototype}
//可见，原型对象保存了
  1 自身添加的方法，
  2 构造函数constructor
  3 _proto_(和上一层构造函数原型对象的连接)
console.log(CreatePerson.prototype.__proto__===Object.prototype);
// true 这个原型对象本身又是object的实例化对象，所有_proto_指向Object的原型对象
console.log(CreatePerson.prototype.__proto__===Object);
// false 可见是和构造函数下原型对象的连接，不是构造函数
console.log(CreatePerson.prototype.constructor);
//CreatePerson CreatePerson.prototype是Object实例化对象,也是原型对象，所以自身拥有constructor属性
console.log(Object.prototype.__proto__);
// null 原型链的终点是null
console.log(CreatePerson.__proto__); //function.prototype
// CreatePerson本身既是构造函数又是function的实例化对象，拥有_proto_属性，指向function的原型对象
console.log(CreatePerson.constructor);
// function 继承自function.prototype
console.log(CreatePerson.prototype instanceof CreatePerson )
//验证是否在一条原型链上 false

리터럴 메서드는 프로토타입을 정의합니다.

객체 코드를 보다 편리하게 생성하려면 리터럴 메서드인 다음 코드를 본 적이 있어야 합니다.

function Aaa(){}
Aaa.prototype = {
 showName:function(){},
 showSex:function(){}
};
var a1 = new Aaa();
console.log(Aaa.prototype);
//{showName:function(){},_proto_}
//你会发现constructor不见了，因为这种方式相当于重新赋值了Aaa.prototype
console.log(Aaa.prototype.constructor);
//Object 因为自身没有了constructor属性，就去上级原型对象找，找到了Object
console.log(a1.constructor );
//Object 也变了，验证了它是访问的原型对象上的

따라서 작성 시 프로토타입의 방향을 수정해야 합니다.

function Aaa(){}
Aaa.prototype = {
constructor:Aaa,
num1:function(){alert(10);}
}
var a1 = new Aaa();
a1.constructor // Aaa

위 내용은 JavaScript 프로토타입 체인 및 프로토타입 객체 속성 인스턴스에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!