JavaScript中的__proto__、[[prototype]]和prototype

目录

前言

  proto、[[prototype]]和prototype三个概念及相关内容是javascript比较复杂且容易混淆的内容。本文尝试进行总结和分析。


prototype相关介绍

  待续。


__proto__与[[prototype]]相关介绍

  待续。

一张图分析三者的关系


一系列案例分析

1
2
3
4
5
function Foo(){
console.log(1);
}
var a = new Foo();
console.log(a.prototype === Foo.prototype); //false
1
2
3
4
5
function Foo(){
console.log(1);
}
var a = new Foo();
console.log(a.__proto__ === Foo.prototype); //true
1
2
3
4
5
function Foo(){
console.log(1);
}
var a = new Foo();
console.log(a.prototype); //undefined
1
2
3
4
5
function Foo(){
console.log(1);
}
var a = new Foo();
console.log(a.__proto__); //object{}
1
2
3
4
5
6
function Foo(){
console.log(1);
}
Foo.prototype = { };
var a = new Foo();
console.log(a.constructor === Foo); //false
1
2
3
4
5
6
function Foo(){
console.log(1);
}
Foo.prototype = { };
var a = new Foo();
console.log(a.constructor === Object); //true
1
2
3
4
5
6
function Foo(){
console.log(1);
}
Foo.prototype = { };
var a = new Foo();
console.log(a.constructor);
1
2
3
4
5
6
function Foo(){
console.log(1);
}
Foo.prototype = { };
var a = new Foo();
console.log(a.__proto__); //function Object() { [native code] }
1
2
3
4
5
6
function Foo(){
console.log(1);
}
Foo.prototype = { };
var a = new Foo();
console.log(a.__proto__.__proto__ === Object.prototype); //true
1
2
3
4
5
function Foo(){
console.log(1);
}
var a = new Foo();
console.log(a.__proto__ === a.prototype); //false
1
2
var a = new Function();
console.log(a.__proto__ === Function.prototype); //true
1
2
3
4
5
function Foo(){
console.log(1);
}
var a = new Foo();
console.log(a.constructor.prototype === a.__proto__); //true
1
2
3
4
5
function Foo(){
console.log(1);
}
var a = new Foo();
console.log(a.constructor.prototype === Foo.prototype); //true