在编程语言中，对象并不像真实世界中那样随处可见，随口可以指代。通常我们只有少数的原生对象，剩下的，需要我们自己去创建。在Java语言中，创建一只会“咯咯咯”叫的鸡时，我们是这么做的：
public class Chicken{
public void makeSound(){
System.out.println("咯咯咯");
}
}
Chicken littleChicken = new Chicken();
先定义一个Chicken类，在Chicken中对其诸多特质进行一番描述，然后根据这些描述new一个littleChicken出来。
这是在以类为中心的编程语言中实现产生对象的方法，就像是先制造模具，然后根据模具浇铸模件。还有一种思想，是将已经存在的最原始最基本的对象复制一遍，然后在新对象身上修修补补，这个原始对象，就是原型，这种思想，就是原型编程的思想，其代表语言，便是Javascript。
比如：
var Chicken = function(){
this.sound = "咯咯咯";
};
Chicken.prototype = {
bark:function(){alert(this.sound)}
};
var littleChicken = new Chicken();
是不是和刚才定义类的方法看起来非常相似，同样是先定义类再根据类new一个对象。实际上，其原理是很不一样的。从原型讲起。
在Javascript中，一切对象都继承自Object.prototype，看起来Object确实比较像一个祖先级的东西，那么为什么不是继承自Object而是Object.prototype?因为Object其实是一个构造器，构造器，是一个类似于Java中类的存在。它像一个高科技机器，用来完成复制原型的动作。而高科技机器里的模版呢？它早已被放入机器，它就是机器的原型，也就是Object.prototype。当我们在说Object的时候，实际是在说那个高科技机器，Object.prototype，才是代指机器中的原型。
上面代码中的Chicken就是一个自定义的构造器。当我们用这个构造器new一个对象的时候，实际上是使用这个构造器克隆放在里面的模版，也就是prototype。构造器实际上就是一个普通的函数，这是在其中我们用this来进行了一些配置。this在这里指代的是即将要创建的对象，而prototype就是放在机器中的模版。当我们用Chicken这个构造器new 一个新的对象，就等于通过复制Chicken.prototype来创建一个新对象，然后给这个新对象增加一个sound属性，给其赋值“咯咯咯”。
console.log(Object.getPrototypeOf(littleChicken));//Object {} bark: () __proto__: Object
Object.getPrototypeOf是获得对象原型的函数，输出代表一个有着bark函数的对象，是不是和Chicken.prototype一样呢？下面的__proto__: Object代表这个原型的原型，也就是Object.prototype，第一个Object代表一个普通对象，而第二个Object代表构造函数，如下：
console.log(Object.getPrototypeOf(Object.getPrototypeOf(littleChicken)););//Object{}
简单地说：
1.所有的对象都是由另一个对象复制而来，被复制的那个对象就被称为新对象的“原型”
2.完成复制动作的工具，叫做构造器。构造器是一个普通的函数。通过给构造器定义prototype属性，来配置“原型”
3.通过调用Object.getPrototypeOf()或者object.__proto__可以得到此对象的原型，根据 ECMAScript 标准，someObject.[[Prototype]] 符号是用于指派 someObject 的原型
4.所有的原型都继承自Object.prototype
5.Object.prototype继承自null，也就是说，原型链的尽头，是null
JavaScript:我对原型链的理解
原型链一直是个很抽象的概念,看不到,摸不着.随着最近对JavaScript进一步的学习,我对原型链有了一点理解,下面讲出来.
基础知识
在JavaScript中,一共有两种类型的值,原始值和对象值.每个对象都有一个内部属性[[prototype]],我们通常称之为原型.原型的值可以是一个对象,也可以是null.如果它的值是一个对象,则这个对象也一定有自己的原型.这样就形成了一条线性的链,我们称之为原型链.
访问一个对象的原型可以使用ES5中的Object.getPrototypeOf方法,或者ES6中的__proto__属性.
原型链的作用是用来实现继承,比如我们新建一个数组,数组的方法就是从数组的原型上继承而来的.
var arr = [];
arr.map === Array.prototype.map //arr.map是从arr.__proto__上继承下来的,arr.__proto__也就是Array.prototype
图形化原型链
虽然我们都说原型链,但实际上,在不考虑网页中frame的情况,js引擎在执行期间的某一时刻,所有存在的对象组成的是一棵原型树.默认情况下,只有一棵树.根节点可以说是Object.prototype,也可以说是null.
但我们可以再建立一棵原型树,通过使用Object.create方法
var foo = Object.create(null); //foo是一个对象,但它是游离的,不属于已有的那棵原型树
var bar = Object.create(foo); //bar的原型是foo
var baz = Object.create(foo); //baz的原型是foo
这样我们有了第二棵原型树
遍历原型链
我们没有办法遍历到所有以某个对象为原型的对象,但我们可以向上遍历,获取到一个对象所有的上层原型,这个原型链必定是线性的,尽头是null.
function getPrototypeChain(object) {
var protoChain = [];
while (object = object.__proto__) {
protoChain.push(object);
}
protoChain.push(null);
return protoChain;
}
试验一下,不同的环境实现不同,显示形式也不同.下面是在chrome控制台中的显示.
>getPrototypeChain(new String(""))
[String, Object, null] //依次是String.prototype,Object.prototype,null
>getPrototypeChain(function(){})
[function Empty() {}, Object, null] //依次是Function.prototype,Object.prototype,null
内置类型的对象的原型链并不长,下面试试宿主对象.
>getPrototypeChain(document.createElement("div"))
[HTMLDivElement, HTMLElement, Element, Node, Object, null]
这个就长多了.
超长原型链
可以看出来,我们平时使用的对象并没有很长的原型链.但可以自己构造一个.
function Foo() {}
for (var i = 0; i < 100; i++) {
Foo.prototype["foo" + i] = i;
Foo.prototype = new Foo;
}
console.dir(getPrototypeChain(new Foo));
最后的这个new Foo有多少个上层原型呢?
【javascript学习指南】Javascript中的继承与原型链理解
http://m.bbyears.com/asp/89566.html
推荐访问: