js 原型的思考

在JavaScript中,一共有两种类型的值,原始值和对象值.每个对象都有一个内部属性[[prototype]],我们通常称之为原型.原型的值可以是一个对象,也可以是null.如果它的值是一个对象,则这个对象也一定有自己的原型.这样就形成了一条线性的链,我们称之为原型链.

访问一个对象的原型可以使用ES5中的Object.getPrototypeOf方法,或者ES6中的__proto__属性.

注意：

1. Object.getPrototypeOf(obj)方法是ES5中提供的用于得到某个对象的原型对象的标准方法。
2. obj.__proto__是获取某个对象的原型对象的非标准方法。

虽然我们都说原型链,但实际上,在不考虑网页中frame的情况,js引擎在执行期间的某一时刻,所有存在的对象组成的是一棵原型树.默认情况下,只有一棵树.根节点可以说是Object.prototype,也可以说是null.

遍历原型链

我们没有办法遍历到所有以某个对象为原型的对象,但我们可以向上遍历,获取到一个对象所有的上层原型,这个原型链必定是线性的,尽头是null.

<script>
		function getPrototypeChain(object){
			var prototypeChain = [];
			while(object = Object.getPrototypeOf(object)){
				prototypeChain.push(object);
			}
			prototypeChain.push(null);
			console.log(prototypeChain);
			return prototypeChain;
		}
		getPrototypeChain(new String());	
		</script>

浏览器输出：

内置类型的对象的原型链并不长,下面试试宿主对象.

	>getPrototypeChain(document.createElement("div"))
[HTMLDivElement, HTMLElement, Element, Node, Object, null]

这个就长多了.

prototype，getPropertyOf和__proto__是三个用来访问prototype的方法。它们的命名方式很类似因此很容易带来困惑。

 

它们的使用方式如下：

 

prototype:

一般用来为一个类型建立它的原型继承对象。比如C.prototype = xxx，这样就会让使用new C()得到的对象的原型对象为xxx。当然使用obj.prototype也能够得到obj的原型对象。

 

getPropertyOf:

Object.getPropertyOf(obj)是ES5中用来得到obj对象的原型对象的标准方法。

 

__proto__:

obj.__proto__是一个非标准的用来得到obj对象的原型对象的方法。