Prototype的Class.create函数解析


Posted in Javascript onSeptember 22, 2011
/** 
* 一个设计精巧的定时执行器 
* 首先由 Class.create() 创建一个 PeriodicalExecuter 类型, 
* 然后用对象直接量的语法形式设置原型。 
* 
* 需要特别说明的是 rgisterCallback 方法,它调用上面定义的函数原型方法bind, 并传递自己为参数。 
* 之所以这样做,是因为 setTimeout 默认总以 window 对象为当前对象,也就是说,如果 registerCallback 方法定义如下的话: 
* registerCallback: function() { 
* setTimeout(this.onTimerEvent, this.frequency * 1000); 
* } 
* 那么,this.onTimeoutEvent 方法执行失败,因为它无法访问 this.currentlyExecuting 属性。 
* 而使用了bind以后,该方法才能正确的找到this,也就是PeriodicalExecuter的当前实例。 
*/ 
var PeriodicalExecuter = Class.create(); 
PeriodicalExecuter.prototype = { 
initialize: function(callback, frequency) { 
this.callback = callback; 
this.frequency = frequency; 
this.currentlyExecuting = false; this.registerCallback(); 
}, 
registerCallback: function() { 
setTimeout(this.onTimerEvent.bind(this), this.frequency * 1000); 
}, 
onTimerEvent: function() { 
if (!this.currentlyExecuting) { 
try { 
this.currentlyExecuting = true; 
this.callback(); 
} finally { 
this.currentlyExecuting = false; 
} 
} 
this.registerCallback(); 
} 
}

具体Class.create()背后做了什么,具体来看看Class的实现。
/** 
* 创建一种类型,注意其属性 create 是一个方法,返回一个构造函数。 
* 一般使用如下 
* var X = Class.create(); 返回一个类型,类似于 java 的一个Class实例。 
* 要使用 X 类型,需继续用 new X()来获取一个实例,如同 java 的 Class.newInstance()方法。 
* 
* 返回的构造函数会执行名为 initialize 的方法, initialize 是 Ruby 对象的构造器方法名字。 
* 此时initialize方法还没有定义,其后的代码中创建新类型时会建立相应的同名方法。 
*/ 
var Class = { 
create: function() { 
return function() { 
this.initialize.apply(this, arguments); 
} 
} 
}

Class.create实际上是返回一个函数,那么new的时候,做了些什么呢。参照MDN

When the code new foo(...) is executed, the following things happen:

A new object is created, inheriting from foo.prototype.
The constructor function foo is called with the specified arguments and this bound to the newly created object. new foo is equivalent to new foo(), i.e. if no argument list is specified, foo is called without arguments.
The object returned by the constructor function becomes the result of the whole new expression. If the constructor function doesn't explicitly return an object, the object created in step 1 is used instead. (Normally constructors don't return a value, but they can choose to do so if they want to override the normal object creation process.)
new的时候会执行该返回的函数,即执行this.initialize.apply(this, arguments); 此时的this就是新生成的对象,这也就是说了所有对象的初始化工作全部委托给initialize函数了。

-------

这里为什么要把自己的initialize方法绑定到自己身上??

Javascript 相关文章推荐
IE8 浏览器Cookie的处理
Jan 31 Javascript
基于jquery的地址栏射击游戏代码
Mar 10 Javascript
九种js弹出对话框的方法总结
Mar 12 Javascript
JS操作select下拉框动态变动(创建/删除/获取)
Jun 02 Javascript
JavaScript 对象深入学习总结(经典)
Sep 29 Javascript
批量下载对路网图片并生成html的实现方法
Jun 07 Javascript
实例详解display:none与visible:hidden的区别
Mar 30 Javascript
webpack独立打包和缓存处理详解
Apr 03 Javascript
微信小程序 action-sheet 反馈上拉菜单简单实例
May 11 Javascript
js神秘的电报密码 哈弗曼编码实现
Sep 10 Javascript
JS判断数组是否包含某元素实现方法汇总
Jun 24 Javascript
js实现Element中input组件的部分功能并封装成组件(实例代码)
Mar 02 Javascript
Javascript中的this绑定介绍
Sep 22 #Javascript
StringTemplate遇见jQuery冲突的解决方法
Sep 22 #Javascript
jquery实现的让超出显示范围外的导航自动固定屏幕最顶上
Sep 22 #Javascript
javascript代码编写需要注意的7个小细节小结
Sep 21 #Javascript
extjs 初始化checkboxgroup值的代码
Sep 21 #Javascript
基于jquery的一个拖拽到指定区域内的效果
Sep 21 #Javascript
关于onScroll事件在IE6下每次滚动触发三次bug说明
Sep 21 #Javascript
You might like
php中如何同时使用session和cookie来保存用户登录信息
2013/07/05 PHP
php获取网页里所有图片并存入数组的方法
2015/04/06 PHP
PHP中is_dir()函数使用指南
2015/05/08 PHP
javascript实现的鼠标链接提示效果生成器代码
2007/06/28 Javascript
一些常用且实用的原生JavaScript函数
2010/09/08 Javascript
再论Javascript的类继承
2011/03/05 Javascript
jquery实现无限分级横向导航菜单的方法
2015/03/12 Javascript
JS实现控制表格单元格垂直对齐的方法
2015/03/30 Javascript
Svg.js实例教程及使用手册详解(一)
2016/05/16 Javascript
jQuery获取table行数并输出单元格内容的实现方法
2016/06/30 Javascript
jquery的checkbox,radio,select等方法小结
2016/08/30 Javascript
Bootstrap3 多个模态对话框无法显示的解决方案
2017/02/23 Javascript
js实现简单的手风琴效果
2017/02/27 Javascript
[48:30]LGD vs infamous Supermajor小组赛D组 BO3 第一场 6.3
2018/06/04 DOTA
[03:12]完美世界DOTA2联赛PWL DAY9集锦
2020/11/10 DOTA
python使用beautifulsoup从爱奇艺网抓取视频播放
2014/01/23 Python
matlab中实现矩阵删除一行或一列的方法
2018/04/04 Python
python生成n个元素的全组合方法
2018/11/13 Python
使用PIL(Python-Imaging)反转图像的颜色方法
2019/01/24 Python
Pandas数据离散化原理及实例解析
2019/11/16 Python
python logging添加filter教程
2019/12/24 Python
关于win10在tensorflow的安装及在pycharm中运行步骤详解
2020/03/16 Python
基于python实现FTP文件上传与下载操作(ftp&sftp协议)
2020/04/01 Python
在服务器上安装python3.8.2环境的教程详解
2020/04/26 Python
CSS3不透明度实例讲解
2016/04/26 HTML / CSS
加拿大租车网站:Enterprise Rent-A-Car
2018/07/26 全球购物
NYX Professional Makeup官方网站:专业彩妆和美容产品
2019/10/29 全球购物
幼儿园教师教学反思
2014/02/06 职场文书
校园安全教育广播稿
2014/02/17 职场文书
2014年国庆标语
2014/06/30 职场文书
2015年基层党组织公开承诺书
2015/01/21 职场文书
仓管员岗位职责范本
2015/04/01 职场文书
城南旧事读书笔记
2015/06/29 职场文书
运动会通讯稿200字
2015/07/20 职场文书
2016党性教育学习心得体会
2016/01/21 职场文书
PostgreSQL并行计算算法及参数强制并行度设置方法
2022/04/07 PostgreSQL