理解JavaScript原型
来源:未知 责任编辑:责任编辑 发表时间:2014-03-23 22:28 点击:次
Javascript的原型总会给人产生一些困惑,无论是经验丰富的专家,还是作者自己也时常表现出对这个概念某些有限的理解,我认为这样的困惑在我们一开始接触原型时就已经产生了,它们常常和new、constructor相关,特别是函数(function)的原型(prototype)属性(property)。事实上,原型是一种非常简单的概念。为了更好的理解它,我们应该首先记住这个原则,那就是忘记我们已经学到的关于构造原型(construtor prototypes)的认识。
什么是原型?
原型是一个对象,其他对象可以通过它实现属性继承。
任何一个对象都可以成为原型么?
是
哪些对象有原型
所有的对象在默认的情况下都有一个原型,因为原型本身也是对象,所以每个原型自身又有一个原型(只有一种例外,默认的对象原型在原型链的顶端。更多关于原型链的将在后面介绍)
好吧,再绕回来,那什么又是对象呢?
在javascript中,一个对象就是任何无序键值对的集合,如果它不是一个主数据类型(undefined,null,boolean,number,or string),那它就是一个对象
你说每个对象都有一个原型,可是我当我写成({}).prototype 我得到了一个null,你说的不对吧?
忘记你已经学到的关于原型属性的一切,它可能就是你对原型困惑的根源所在。一个对象的真正原型是被对象内部的[[Prototype]]属性(property)所持有。ECMA引入了标准对象原型访问器Object.getPrototype(object),到目前为止只有Firefox和chrome实现了此访问器。除了IE,其他的浏览器支持非标准的访问器__proto__,如果这两者都不起作用的,我们需要从对象的构造函数中找到的它原型属性。下面的代码展示了获取对象原型的方法
var a = {};
//Firefox 3.6 and Chrome 5
Object.getPrototypeOf(a); //[object Object]
//Firefox 3.6, Chrome 5 and Safari 4
a.__proto__; //[object Object]
//all browsers
a.constructor.prototype; //[object Object]
ok,一切都进行的很好,但是false明明是一个主数据类型,可是false.__proto__却返回了一个值
当你试图获取一个主数据类型的原型时,它被强制转化成了一个对象
//(works in IE too, but only by accident)
false .__proto__ === Boolean( false ).__proto__; //true
我想在继承中使用原型,那我该怎么做?
如果仅仅只是因为一个实例而使用原型是没有多大意义的,这和直接添加属性到这个实例是一样的,假如我们已经创建了一个实例对象 ,我们想要继承一个已经存在的对象的功能比如说Array,我们可以像下面这样做( 在支持__proto__ 的浏览器中)
//unusual case and does not work in IE
var a = {};
a.__proto__ = Array.prototype;
a.length; //0
———————————————————————————————————–
译者注:上面这个例子中,首先创建了一个对象a,然后通过a的原型来达到继承Array 这个已经存在的对象的功能
———————————————————————————————————–
什么是原型?
原型是一个对象,其他对象可以通过它实现属性继承。
任何一个对象都可以成为原型么?
是
哪些对象有原型
所有的对象在默认的情况下都有一个原型,因为原型本身也是对象,所以每个原型自身又有一个原型(只有一种例外,默认的对象原型在原型链的顶端。更多关于原型链的将在后面介绍)
好吧,再绕回来,那什么又是对象呢?
在javascript中,一个对象就是任何无序键值对的集合,如果它不是一个主数据类型(undefined,null,boolean,number,or string),那它就是一个对象
你说每个对象都有一个原型,可是我当我写成({}).prototype 我得到了一个null,你说的不对吧?
忘记你已经学到的关于原型属性的一切,它可能就是你对原型困惑的根源所在。一个对象的真正原型是被对象内部的[[Prototype]]属性(property)所持有。ECMA引入了标准对象原型访问器Object.getPrototype(object),到目前为止只有Firefox和chrome实现了此访问器。除了IE,其他的浏览器支持非标准的访问器__proto__,如果这两者都不起作用的,我们需要从对象的构造函数中找到的它原型属性。下面的代码展示了获取对象原型的方法
var a = {};
//Firefox 3.6 and Chrome 5
Object.getPrototypeOf(a); //[object Object]
//Firefox 3.6, Chrome 5 and Safari 4
a.__proto__; //[object Object]
//all browsers
a.constructor.prototype; //[object Object]
ok,一切都进行的很好,但是false明明是一个主数据类型,可是false.__proto__却返回了一个值
当你试图获取一个主数据类型的原型时,它被强制转化成了一个对象
//(works in IE too, but only by accident)
false .__proto__ === Boolean( false ).__proto__; //true
我想在继承中使用原型,那我该怎么做?
如果仅仅只是因为一个实例而使用原型是没有多大意义的,这和直接添加属性到这个实例是一样的,假如我们已经创建了一个实例对象 ,我们想要继承一个已经存在的对象的功能比如说Array,我们可以像下面这样做( 在支持__proto__ 的浏览器中)
//unusual case and does not work in IE
var a = {};
a.__proto__ = Array.prototype;
a.length; //0
———————————————————————————————————–
译者注:上面这个例子中,首先创建了一个对象a,然后通过a的原型来达到继承Array 这个已经存在的对象的功能
———————————————————————————————————–
相关新闻>>
- Javascript 兼容 IE6、IE7、FF 的“加入收藏”“设为首页”
- 好好学一遍JavaScript 笔记(一)——基础中的基础
- 好好学一遍JavaScript 笔记(二)——encode、数组、对象创建
- 好好学一遍JavaScript 笔记(三)——StringBuffer、prototype
- 好好学一遍javaScript 笔记(四)——Attribute、HTML元素、文档碎
- 好好学一遍JavaScript 笔记(五)——正则表达式基础
- 好好学一遍JavaScript 笔记(六)——正则表达式基础二
- 好好学一遍JavaScript 笔记(七)——RegExp对象与常用正则
- 好好学一遍JavaScript 笔记(八)——冒泡型事件、捕获型事件
- JavaScript详解
最新推荐更多>>>
- 发表评论
-
- 最新评论 更多>>