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 相关文章推荐
JQuery中getJSON的使用方法
Dec 13 Javascript
Jquery下:nth-child(an+b)的使用注意
May 28 Javascript
javascript图片预加载实例分析
Jul 16 Javascript
Vue键盘事件用法总结
Apr 18 Javascript
微信小程序中页面FOR循环和嵌套循环
Jun 21 Javascript
Angular2仿照微信UI实现9张图片上传和预览的示例代码
Oct 19 Javascript
VUE2实现事件驱动弹窗示例
Oct 21 Javascript
vue-cli3.0 特性解读
Apr 22 Javascript
深入理解Vue父子组件生命周期执行顺序及钩子函数
Aug 12 Javascript
React SSR样式及SEO的实践
Oct 22 Javascript
JS函数进阶之继承用法实例分析
Jan 15 Javascript
nuxt 每个页面head标签内容设置方式
Nov 05 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
PHP 将逗号、空格、回车分隔的字符串转换为数组的函数
2012/06/07 PHP
PHP实现二维数组根据key进行排序的方法
2016/12/30 PHP
PHP7如何开启Opcode打造强悍性能详解
2018/05/11 PHP
各种常用浏览器getBoundingClientRect的解析
2009/05/21 Javascript
固定表格行列(expression)在IE下适用
2013/07/25 Javascript
js处理自己不能定义二维数组的方法详解
2014/03/03 Javascript
Javascript基础教程之数据类型 (布尔型 Boolean)
2015/01/18 Javascript
js实现DOM走马灯特效的方法
2015/01/21 Javascript
js实现同一个页面多个渐变效果的方法
2015/04/10 Javascript
悬浮广告方法日常收集整理
2016/03/18 Javascript
jQuery获取当前点击的对象元素(实现代码)
2016/05/19 Javascript
JS实现的简单折叠展开动画效果示例
2018/04/28 Javascript
js限制输入框只能输入数字(onkeyup触发)
2018/09/28 Javascript
详解Vue的常用指令v-if, v-for, v-show,v-else, v-bind, v-on
2018/10/12 Javascript
微信小程序自定义底部导航带跳转功能
2018/11/27 Javascript
微信小程序手动添加收货地址省市区联动
2020/05/18 Javascript
js实现小球在页面规定的区域运动
2020/06/16 Javascript
[41:52]2018DOTA2亚洲邀请赛3月29日 小组赛A组 TNC VS OpTic
2018/03/30 DOTA
[01:02:30]Mineski vs Secret 2019国际邀请赛淘汰赛 败者组 BO3 第三场 8.22
2019/09/05 DOTA
Python守护进程(daemon)代码实例
2015/03/06 Python
Python中的getopt函数使用详解
2015/07/28 Python
详解字典树Trie结构及其Python代码实现
2016/06/03 Python
Python科学计算包numpy用法实例详解
2018/02/08 Python
Opencv实现抠图背景图替换功能
2019/05/21 Python
Python代码实现http/https代理服务器的脚本
2019/08/12 Python
Python flask框架实现浏览器点击自定义跳转页面
2020/06/04 Python
html5简单示例_动力节点Java学院整理
2017/07/07 HTML / CSS
美国猫狗药物和用品网站:PetCareRx
2017/01/05 全球购物
2014年五一促销活动方案
2014/03/09 职场文书
《李时珍夜宿古寺》教学反思
2014/04/09 职场文书
人口与计划生育目标管理责任书
2014/07/29 职场文书
党的群众路线对照检查材料思想汇报(学校)
2014/10/04 职场文书
西部计划志愿者工作总结
2015/08/11 职场文书
SpringBoot SpringEL表达式的使用
2021/07/25 Java/Android
python模板入门教程之flask Jinja
2022/04/11 Python
win10如何快速切换窗口 win10切换窗口快捷键分享
2022/07/23 数码科技