秒懂JavaScript的原型对象与原型链

我们知道原型是一个对象,其他对象可以通过它实现属性继承。但是尼玛除了prototype,又有一个__proto__是用来干嘛的?长那么像,让人怎么区分呢?它们都指向谁,那么混乱怎么记啊?原型链又是什么鬼?

秒懂JavaScript的原型对象与原型链_第1张图片

var obj = {};
console.log(obj.prototype);  //undefined
console.log(obj.__proto__);  //Object {}

var obj2 = function(){}
console.log(obj2.prototype);  //obj2 {}
console.log(obj2.__proto__);  //function() {}

秒懂JavaScript的原型对象与原型链_第2张图片
/*1、字面量方式*/
var a = {};
console.log(a.__proto__);  //Object {}

console.log(a.__proto__ === a.constructor.prototype); //true

/*2、构造器方式*/
var A = function(){};
var a = new A();
console.log(a.__proto__); //A {}

console.log(a.__proto__ === a.constructor.prototype); //true

/*3、Object.create()方式*/
var a1 = {a:1}
var a2 = Object.create(a1);
console.log(a2.__proto__); //Object {a: 1}

console.log(a2.__proto__ === a1.constructor.prototype); //false(此处即为图1中的例外情况)

秒懂JavaScript的原型对象与原型链_第3张图片

var A = function(){};
var a = new A();
console.log(a.__proto__); //A {}(即构造器function A 的原型对象)
console.log(a.__proto__.__proto__); //Object {}(即构造器function Object 的原型对象)
console.log(a.__proto__.__proto__.__proto__); //null

你可能感兴趣的:(秒懂JavaScript的原型对象与原型链)