Js中Prototype、__proto__、Constructor、Object、Function关系介绍总结

摘要： 1.js的对象都拥有内部属性 [[prototype]] 指向其原型对象。[[prototype]] 被称为原型属性。 2 内部属性不可以直接访问.error: obj[[prototype]],但是可以间接访问 [[prototype]]

Prototype

1 js的对象都拥有内部属性 [[prototype]] 指向其原型对象。[[prototype]] 被称为原型属性。

2 内部属性不可以直接访问.error: obj[[prototype]],但是可以间接访问 [[prototype]]

a ECMA:标准对象原型访问器Object.getPrototype(object)(到目前为止只有Firefox和chrome实现了此访问器);

b 非标准访问器:__proto__(除了IE)

c obj.constructor.prototype

js的一切皆是对象，所以 函数也是对象.又因为对象拥有内部属性 [[prototype]],所以
函数也拥有内部属性 [[prototype]].

其次:函数同时拥有属性 prototype.prototype属性和 [[prototype]]并非同一个属性。

prototype属性指向一个对象，称为原型对象。所以：一个函数的原型属性(function’s prototype property ) 和函数实际的原型(prototype)没有关系

原型对象的作用：当函数fn被用作构造函数时，其所创建的所有实例的内部属性 [[prototype]] 指向 fn 的 prototype属性。

原型的作用：

1 构建原型链

当对象调用某个方法时,如果其本身不存在此方法,就会往其原型中寻找，直到原型链的顶端

原型链的作用：多个实例都需要的方法可以被抽出放到原型中，从而只需要定义一次，实现多个对象共享方法

Constructor

JS的所有对象都拥有constructor属性，指向其构造函数。函数的原型对象也是对象,所以原型对象也拥有constructor属性。并且JS定下了规则：

fn.prototype.constructor == fn;

即： 函数的prototype属性的constructor字段,指向当前prototype属性的拥有者，也就是构造函数本身

由 fn.prototype.constructor == fn;推导出来的结论:构造函数的实例的 constructor属性 指向其构造函数

推导：

var a = new fn();

首先在a本身寻找:没有找到 constructor属性.再往原型链向上查找，找到a的原型，也就是 fn.prototype,发现了 constructor属性。所以就相当于 构造函数的实例的 constructor属性始终指向其构造函数

Prototype、__proto__与Object、Function关系介绍

Function、Object：Js自带的函数对象

prototype,每一个函数对象都有一个显示的prototype属性,它代表了对象的原型(Function.prototype函数对象是个例外，没有prototype属性)

proto:每个对象都有一个名为__proto__的内部隐藏属性，指向于它所对应的原型对象(chrome、firefox中名称为__proto__，并且可以被访问到)。原型链正是基于__proto__才得以形成(note：不是基于函数对象的属性prototype)。

关于上面提到的函数对象，我们来看以下例子，来说明：

var o1 = {};
var o2 =new Object();
function f1(){}
var f2 = function(){}
var f3 = new Function('str','console.log(str)');
f3('aabb');   // aabb
console.log('typeof Object:'+typeof Object);            //function
console.log('typeof Function:'+typeof Function);        //function
console.log('typeof o1:'+typeof o1);   //object
console.log('typeof o2:'+typeof o2);   //object
console.log('typeof f1:'+typeof f1);   //function
console.log('typeof f2:'+typeof f2);   //function
console.log('typeof f3:'+typeof f3);   //function

通常我们认为o1、o2是对象，即普通对象；f1、f2、f3为函数。但是其实函数也是对象，是由Function构造的，f3这种写法就跟对象的创建写法一样。f1、f2最终也都像f3一样是有Function这个函数构造出来的
f1、f2、f3为函数对象，Function跟Object本身也是函数对象

Js中每个对象(null除外)都和另一个对象相关联，通过以下例子跟内存效果图来分析Function、Object、Prototype、__proto__对象间的关系