理解JavaScript的prototype属性


Posted in Javascript onFebruary 11, 2012

其实,关于prototype只要几句话就可以总结:
任何原型都是对象,只有对象有原型
只有Function有prototype属性,它是这个Function作为构造器时生成对象所继承的原型。Function的原型和它的prototype属性无关
对象的原型可以通过非标准的属性 __proto__ 或ECMAScript5的方法 Object.getPrototypeOf() 访问。
1其实是错的,Object这个原型链尽头的对象它没有原型。可是为了更简单表述。在看原型链后你就会明白.toString()这类没有定义过的方法是怎样来的。
上面说的二义性,是文字理解上的,语法本身没有歧义。prototype是原型的意思,可是一个对象的原型不是由prototype去访问。
Function有prototype属性,可是和自己的原型没有关系。理解这点后,再去看关于原型链、继承的文章就容易理解多了。

下面是些例子,可以加深认识:

// 任何对象都有原型 
obj = {}; 
console.log( obj.__proto__ ); 
console.log( Object.getPrototypeOf(obj) ); 
console.log( obj.__proto__ === Object.getPrototypeOf(obj) ); //对象并没有语法意义的prototype属性 
alert(obj.prototype) //undefined 
//prototype作为一个属性,仅存在于Function中,代表以这个Function创建的新实例集成的原型,和Function本身的原型无关 
var F = function(name){ 
this.name = name; 
} 
obj = {a:3, 
get b (){ 
return this.a; 
} 
}; 
F.prototype = obj; 
newObj = new F('new name'); 
newObj.name; //作为构造器,name是newObj的自身属性 
newObj.a; //3 
//它继承了obj。可以通过这样证实: 
Object.getPrototypeOf( newObj ) === obj; // true 
newObj.__proto__ === obj; //true
Javascript 相关文章推荐
JScript中的undefined和"undefined"的区别
Mar 08 Javascript
Javascript 二维数组
Nov 26 Javascript
Javascript 修改String 对象 增加去除空格功能(示例代码)
Nov 30 Javascript
我的Node.js学习之路(一)
Jul 06 Javascript
js实现文件上传表单域美化特效
Nov 02 Javascript
js+css绘制颜色动态变化的圈中圈效果
Jan 27 Javascript
jQuery实现带水平滑杆的焦点图动画插件
Mar 08 Javascript
js轮盘抽奖实例分析
Apr 17 Javascript
js自制图片放大镜功能
Jan 24 Javascript
angularjs select 赋值 ng-options配置方法
Feb 28 Javascript
vue移动端html5页面根据屏幕适配的四种解决方法
Oct 19 Javascript
layui radio点击事件实现input显示和隐藏的例子
Sep 02 Javascript
情人节专属 纯js脚本1k大小的3D玫瑰效果
Feb 11 #Javascript
基于jquery实现状态限定编辑的代码
Feb 11 #Javascript
通过jquery还原含有rowspan、colspan的table的实现方法
Feb 10 #Javascript
用JQuery实现表格隔行变色和突出显示当前行的代码
Feb 10 #Javascript
了解jQuery技巧来提高你的代码(个人觉得那个jquery的手册很不错)
Feb 10 #Javascript
基于jquery点击自以外任意处,关闭自身的代码
Feb 10 #Javascript
jqPlot 图表中文API使用文档及源码和在线示例
Feb 07 #Javascript
You might like
上海地方志办公室-上海电子仪表工业志
2021/03/04 无线电
yii使用activeFileField控件实现上传文件与图片的方法
2015/12/28 PHP
使用php+swoole对client数据实时更新(一)
2016/01/07 PHP
ThinkPHP框架获取最后一次执行SQL语句及变量调试简单操作示例
2018/06/13 PHP
PHP快速导出百万级数据到CSV或者EXCEL文件
2020/11/27 PHP
[对联广告] JS脚本类
2006/08/27 Javascript
在IE模态窗口中自由查看HTML源码的方法
2007/03/08 Javascript
学习ExtJS(一) 之基础前提
2009/10/07 Javascript
Extjs中DisplayField的日期或者数字格式化扩展
2010/09/03 Javascript
jQuery控制TR显示隐藏的三种常用方法
2014/08/21 Javascript
JavaScript判断表单为空及获取焦点的方法
2016/02/12 Javascript
从零学习node.js之模块规范(一)
2017/02/21 Javascript
JS对象的深度克隆方法示例
2017/03/16 Javascript
angular+ionic返回上一页并刷新页面
2017/08/08 Javascript
基于vue.js快速搭建图书管理平台
2017/10/29 Javascript
详解Nuxt.js部署及踩过的坑
2018/08/07 Javascript
js实现指定时间倒计时效果
2019/08/26 Javascript
Vue 实现从小到大的横向滑动效果详解
2019/10/16 Javascript
vue实现全屏滚动效果(非fullpage.js)
2020/03/07 Javascript
javascript canvas封装动态时钟
2020/09/30 Javascript
跟老齐学Python之大话题小函数(2)
2014/10/10 Python
Python写的一个定时重跑获取数据库数据
2016/12/28 Python
python得到qq句柄,并显示在前台的方法
2018/10/14 Python
jupyter notebook 参数传递给shell命令行实例
2020/04/10 Python
python生成xml时规定dtd实例方法
2020/09/21 Python
python中@property的作用和getter setter的解释
2020/12/22 Python
SEPHORA新西兰官方网站:购买化妆品和护肤品
2016/12/02 全球购物
18岁生日感言
2014/01/12 职场文书
办理生育手续介绍信
2014/01/14 职场文书
怎样拟定创业计划书
2014/05/01 职场文书
大学学习计划书范文
2014/05/02 职场文书
教师敬业奉献模范事迹材料
2014/05/18 职场文书
2014年国庆节活动总结
2014/08/26 职场文书
Python带你从浅入深探究Tuple(基础篇)
2021/05/15 Python
Vue中使用import进行路由懒加载的原理分析
2022/04/01 Vue.js
Golang实现可重入锁的示例代码
2022/05/25 Golang