JavaScript原型学习

原型：
　　原型是一个对象，任何对象默认都有一个原型，唯一例外的是默认的对象原型，它在原型链的顶端。

 

对象：
　　对象是无需键值对的集合。
　　在JavaScript中，如果不是一个主数据类型(undefined/null/boolean/number/string)就是一个对象。
　　一个对象的原型，被对象内部的[[prototype]]属性(propety)所持有。

 

原型访问器：
　　①ECMA标准对象原型访问器：Object.getPrototype(obj)【FireFox、Chrome支持】
　　②非标准对象原型访问器：__proto__ 【除了IE都支持】
　　③当上述2种不起作用时，可通过对象的构造函数找到它的原型：obj.constructor.prototype【所有浏览器支持】

var a = {};Object.getPrototypeOf(a); //[object Object] a.__proto__; //[object Object] a.constructor.prototype; //[object Object]

　　当尝试获取一个主数据类型的原型时，它会被强行转换为一个对象：

false.__proto__ === Boolean(false).__proto__; //true

 

 在继承中使用原型：
　　原型的魅力在于多个实例共用一个通用原型。
　　让一个实例对象 继承一个已经存在的对象(如Array)的功能：

var a = {}; a.__proto__ = Array.prototype; //为a对象的原型 赋值 Array的原型属性 a.length; // 0

 　　原型对象【某个对象(如上述a)的原型引用的对象(如Array)】的属性【如Array.prototype】一旦定义，就可以被多个引用它的实例所继承。

 

 原型的继承也是构造函数之所以存在的原因：
　　构造函数是一种方便的跨浏览器机制，允许在创建实例时 为实例提供一个通用的原型。

constructor.prototype属性
　　JavaScript没有区别构造函数(constructor)和其他函数，故每个函数都有一个原型属性(prototype)，不是函数则没有。

Math.max.prototype; //[object Object]var a = function(name){this.name = name; }a.prototype; //[object Object] Math.prototype; // null

　　函数a的原型属性(prototype propety)是一个对象，当函数a创建实例时，函数的原型属性会作为原型 赋值给所有对象实例。
　　即，所有实例的原型(如oIns.__proto__) 引用的都是函数的原型属性(如a.prototype)。

//创建一个函数b var b = function(){ var one; } //使用b创建一个对象实例c var c = new b(); //查看b 和c的构造函数 b.constructor; // function Function() { [native code]} b.constructor==Function.constructor; //true c.constructor; //实例c的构造函数 即 b function(){ var one; } c.constructor==b //true//b是一个函数，查看b的原型如下 b.constructor.prototype // function (){} b.__proto__ //function (){}//b是一个函数，由于javascript没有在构造函数constructor和函数function之间做区分，所以函数像constructor一样， //有一个原型属性，这和函数的原型(b.__proto__ 或者b.construtor.prototype)是不一样的 b.prototype //[object Object] 函数b的原型属性 b.prototype==b.constructor.prototype //fasle b.prototype==b.__proto__ //false b.__proto__==b.constructor.prototype //true//c是一个由b创建的对象实例，查看c的原型如下 c.constructor.prototype //[object Object] 这是对象的原型 c.__proto__ //[object Object] 这是对象的原型 c.constructor.prototype==b.constructor.prototype; //false c的原型和b的原型比较 c.constructor.prototype==b.prototype; //true c的原型和b的原型属性比较//为函数b的原型属性添加一个属性max b.prototype.max = 3 //实例c也有了一个属性max c.max //3 上面的例子中，对象实例c的原型和函数的b的原型属性是一样的，如果改变b的原型属性，则对象实例c 的原型也会改变

 

一个函数的原型属性(function`s prototype propety) 与其原型(prototype)没有关系：

var a = function(name){this.name = name; } a.prototype == a.__proto__; //false a.__proto__ == Function.prototype; //true

 

改变原型引用的原型属性所在的函数，原型所在的实例会随着改变：

var A = function(name) {this.name = name;} var B = new A('alpha'); B.name; //'alpha' A.prototype.x = 23; //引用的原型属性所在的A添加属性x，原型所在的实例B会随着添加引用x B.x; //23

 

instance of：判断原型

var A = function() {} var B = new A();B.__proto__ == A.prototype; B instanceof A; //true; B.__proto__ = Function.prototype; B instanceof A; //false

 

 

原型的应用：实现复制字符串的方法

String.prototype.times = function(count) {return count < 1 ? '' : new Array(count + 1).join(this); //创建一个数组，将调用方法的字符串作为分隔符，转换为字符串 }"hello!".times(3); //"hello!hello!hello!"; 复制3次"please...".times(6);//"please...please...please...please...please...please..."; 复制6次

 

继承原理，原型链：
　　每个对象都有一个原型，对象的原型指向父，而父的原型指向父的父，通常把通过原型层层链接起来的关系 称为原型链。
　　原型链的末端一般是 默认的对象原型。

a.__proto__ = b; b.__proto__ = c; c.__proto__ = {}; //default object {}.__proto__.__proto__; //null

 

　　原型的继承机制 是发生在内部且隐式的，当要获取一个对象的属性时，JavaScript会在原型链中查找该属性，不存在则返回undefined。

 

译文：blog.jobbole.com/9648/#comment-15216
英文原文：http://javascriptweblog.wordpress.com/2010/06/07/understanding-javascript-prototypes/

转载于:https://www.cnblogs.com/slowsoul/archive/2013/05/28/3102618.html

总结

以上是生活随笔为你收集整理的JavaScript原型学习的全部内容，希望文章能够帮你解决所遇到的问题。

如果觉得生活随笔网站内容还不错，欢迎将生活随笔推荐给好友。