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 相关文章推荐
js模拟select下拉菜单控件的代码
May 08 Javascript
node+express+ejs制作简单页面上手指南
Nov 26 Javascript
jQuery easyUI datagrid 增加求和统计行的实现代码
Jun 01 Javascript
正则表达式替换html元素属性的方法
Nov 26 Javascript
原生js实现节日时间倒计时功能
Jan 18 Javascript
Javascript刷新页面的实例
Sep 23 Javascript
原生JS实现循环Nodelist Dom列表的4种方式示例
Feb 11 Javascript
VUE-Table上绑定Input通过render实现双向绑定数据的示例
Aug 27 Javascript
js前端面试之同步与异步问题详解
Apr 03 Javascript
微信小程序结合Storage实现搜索历史效果
May 18 Javascript
javascript canvas封装动态时钟
Sep 30 Javascript
SpringBoot+Vue 前后端合并部署的配置方法
Dec 30 Vue.js
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
造就帕卡马拉的帕卡斯是怎么被发现的
2021/03/03 咖啡文化
Email+URL的判断和自动转换函数
2006/10/09 PHP
PHP开启opcache提升代码性能
2015/04/26 PHP
php生成curl命令行的方法
2015/12/14 PHP
PHP实现APP微信支付的实例讲解
2018/02/10 PHP
PhpStorm连接服务器并实现自动上传功能
2020/12/09 PHP
一个js实现的所谓的滑动门
2007/05/23 Javascript
jquery实现textarea输入字符控制(仿微博输入控制字符)
2013/04/26 Javascript
js字符串操作方法实例分析
2015/05/06 Javascript
JavaScript动态改变div属性的实现方法
2015/07/22 Javascript
Angular.js中ng-if、ng-show和ng-hide的区别介绍
2017/01/20 Javascript
Angularjs中使用指令绑定点击事件的方法
2017/03/30 Javascript
基于LayUI实现前端分页功能的方法
2017/07/22 Javascript
vue学习笔记之v-if和v-show的区别
2017/09/20 Javascript
JavaScript编程设计模式之构造器模式实例分析
2017/10/25 Javascript
node作为中间服务层如何发送请求(发送请求的实现方法详解)
2018/01/02 Javascript
vue.js 实现点击展开收起动画效果
2018/07/07 Javascript
eslint 的三大通用规则详解
2019/05/16 Javascript
nodejs实现用户登录路由功能
2019/05/22 NodeJs
JavaScript监听一个DOM元素大小变化
2020/04/26 Javascript
python学习笔记之调用eval函数出现invalid syntax错误问题
2015/10/18 Python
用python实现刷点击率的示例代码
2019/02/21 Python
Python imread、newaxis用法详解
2019/11/04 Python
Python+numpy实现矩阵的行列扩展方式
2019/11/29 Python
查看已安装tensorflow版本的方法示例
2020/04/19 Python
Python解析微信dat文件的方法
2020/11/30 Python
一款利用html5和css3实现的3D滚动特效的教程
2015/01/04 HTML / CSS
高清安全摄像头系统:Lorex Technology
2018/07/20 全球购物
main 函数执行以前,还会执行什么代码
2013/04/17 面试题
土木工程实习生自我鉴定
2013/09/19 职场文书
《陶罐和铁罐》教学反思
2014/02/19 职场文书
2014新课程改革心得体会
2014/03/10 职场文书
六查六看自检自查剖析材料
2014/10/14 职场文书
一年级下册数学教学反思
2016/02/16 职场文书
python基于scrapy爬取京东笔记本电脑数据并进行简单处理和分析
2021/04/14 Python
Qt数据库应用之实现图片转pdf
2022/06/01 Java/Android