javascript prototype,executing,context,closure


Posted in Javascript onDecember 24, 2008

要学好JavaScript,有几个基本概念必须搞清楚:prototype,executing,context,closure。
Prototype

在JavaScript语言中,通常使用Prototype来实现OO。在这里,我们不对JavaScript的OO实现进行过多的探讨,着重来看一下JS中对象的内存模型。在开始之前,需要先明确以下几点:
1. JS中,存在以下几种数据类型:string,number,boolean,object,function(注意:首字母均为小写)。
2 “Object”, “String”, “Date”等内置数据类型,在JS中实际上是函数名称(使用"alert(typeof Object)"可以验证,输出为"function")。我们通常指的类型为"Date"的数据类型,实际上是通过"new Date"所产生的对象。
3. 在JavaScript中,对象都是associative array (hash table),可以动态指定对象的property。
4. 在Firefox中可以使用"__proto__"属性来查看一个对象的"prototype"。

下面我们来看一个简单的例子:

function Person() { this.age = 10; this.name = "test";}Person.prototype = new Object;var p = new Person;alert(p); // output "[object Object]"alert(p.__proto__); // output "[object Object]"

可以看出Person数据类型具有一个“prototype”,如果更改这个prototype,会影响到所有已经产生的Person类型的对象,同时也会影响到以后建立的Person类型的对象。如果指定一个function的prototype属性,则所有使用该function生成的对象实例中(使用new操作符)都具有该prototype,在Firefox 中,可以使用"__proto__"属性访问。

通常情况下,我们讲JS中的对象都继承Object数据类型,这是如何体现的呢?我们把以上的程序稍微修改一下:

function Person() { this.age = 10; this.name = "test";}var p = new Person;alert(p); // output "[object Object]"alert(p.__proto__); // output "[object Object]"alert(p.__proto__.__proto__); // output "[object Object]"alert(p.__proto__.__proto__ == Object.prototype); // output "true"alert(p.__proto__.__proto__.__proto__); // output "null"

由以上程序可以看到,Person的"prototype"(在这里,没有明确指定Person.prototype, 而是使用缺省值)的"prototype" (p.__proto__.__proto__)正是Object.prototype, Object.prototype是prototype chain的终点(其自己的祖先为null)。

在JS中,Object是function,同时,所有function的实例,也都是Object。请看如下程序:

/* Object, Function都是function数据类型 */alert(typeof Object); // output "function"alert(typeof Function); // output "function"/* Function的prototype是一个空function */alert(Function.prototype); // output "function() {}"alert(Function.__proto__ == Function.prototype); // output "true"/* function是object, 其prototype chain的终点是Object.prototype */alert(Function.__proto__.__proto__ == Object.prototype); //output "true"/* Object是function的实例 */ alert(Object.__proto__ == Function.prototype); // output "true"alert(Object.__proto__.__proto__ == Object.prototype); // output "true"改变Function.prototype会影响到“Object”,改变Object.prototype会影响到所有function的实例。

Javascript 相关文章推荐
判断JavaScript对象是否可用的最正确方法分析
Oct 03 Javascript
javascript日期处理函数,性能优化批处理
Sep 06 Javascript
学习JavaScript设计模式(单例模式)
Nov 26 Javascript
js仿京东轮播效果 选项卡套选项卡使用
Jan 12 Javascript
微信小程序之MaterialDesign--input组件详解
Feb 15 Javascript
Vue实现购物车功能
Apr 27 Javascript
jQuery实现多张图片上传预览(不经过后端处理)
Apr 29 jQuery
纯js实现页面返回顶部的动画(超简单)
Aug 10 Javascript
深入理解JavaScript和TypeScript中的class
Apr 22 Javascript
vue element-ui table组件动态生成表头和数据并修改单元格格式 父子组件通信
Aug 15 Javascript
vue使用高德地图点击下钻上浮效果的实现思路
Oct 12 Javascript
vue或react项目生产环境去掉console.log的操作
Sep 02 Javascript
JavaScript 事件参考手册
Dec 24 #Javascript
javascript XML数据显示为HTML一例
Dec 23 #Javascript
window.location和document.location的区别分析
Dec 23 #Javascript
javascript 硬盘序列号+其它硬件信息
Dec 23 #Javascript
js 解决“options为空或不是对象”
Dec 22 #Javascript
javascript 动态参数判空操作
Dec 22 #Javascript
Javascript 布尔型分析
Dec 22 #Javascript
You might like
建立文件交换功能的脚本(二)
2006/10/09 PHP
PHP输出时间差函数代码
2013/01/28 PHP
smarty模板引擎基础知识入门
2015/03/30 PHP
PHP实现GIF图片验证码
2015/11/04 PHP
yii2中关于加密解密的那些事儿
2018/06/12 PHP
DHTML Slide Show script图片轮换
2008/03/03 Javascript
JQuery动画和停止动画实例代码
2013/03/01 Javascript
js hover 定时器(实例代码)
2013/11/12 Javascript
JavaScript判断变量是对象还是数组的方法
2014/08/28 Javascript
浅谈JavaScript中Date(日期对象),Math对象
2015/02/05 Javascript
JavaScript获取页面中表单(form)数量的方法
2015/04/03 Javascript
php利用curl获取远程图片实现方法
2015/10/26 Javascript
AngularJs学习第五篇从Controller控制器谈谈$scope作用域
2016/06/08 Javascript
微信小程序 video详解及简单实例
2017/01/16 Javascript
深入理解Angularjs中$http.post与$.post
2017/05/19 Javascript
jQuery 中msgTips 顶部弹窗效果实现代码
2017/08/14 jQuery
小程序实现层叠卡片滑动效果
2019/08/26 Javascript
基于JS实现table导出Excel并保留样式
2020/05/19 Javascript
Python实现配置文件备份的方法
2015/07/30 Python
python 实现删除文件或文件夹实例详解
2016/12/04 Python
Python实现的视频播放器功能完整示例
2018/02/01 Python
浅谈python标准库--functools.partial
2019/03/13 Python
PyQt5实现让QScrollArea支持鼠标拖动的操作方法
2019/06/19 Python
关于tf.nn.dynamic_rnn返回值详解
2020/01/20 Python
python实现简易版学生成绩管理系统
2020/06/22 Python
ManoMano英国:欧洲第一家专注于DIY和园艺市场的电商平台
2020/03/12 全球购物
岗位竞聘演讲稿
2014/01/10 职场文书
初中生自我评价
2014/02/01 职场文书
奠基仪式策划方案
2014/05/15 职场文书
建设单位项目负责人任命书
2014/06/06 职场文书
2015年七七事变78周年纪念活动方案
2015/05/06 职场文书
2015年小学数学教师个人工作总结
2015/05/25 职场文书
欢送会主持词
2015/07/01 职场文书
新员工实习期个人工作总结
2015/10/15 职场文书
先进个人主要事迹怎么写
2015/11/04 职场文书
MySQL插入数据与查询数据
2022/03/25 MySQL