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 相关文章推荐
有一段有意思的代码-javascript现实多行信息
Aug 26 Javascript
jquery中filter方法用法实例分析
Feb 06 Javascript
jQuery实现将页面上HTML标签换成另外标签的方法
Jun 09 Javascript
javascript html5摇一摇功能的实现
Apr 19 Javascript
JSP基于Bootstrap分页显示实例解析
Jun 12 Javascript
Node.js包管理器Yarn的入门介绍与安装
Oct 17 Javascript
浅谈js继承的实现及公有、私有、静态方法的书写
Oct 28 Javascript
微信小程序之购物车功能
Sep 23 Javascript
jquery实现二级导航下拉菜单效果实例
May 14 jQuery
vue 子组件watch监听不到prop的解决
Aug 09 Javascript
关于小程序优化的一些建议(小结)
Dec 10 Javascript
用JS写一个发布订阅模式
Nov 07 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函数nl2br()与自定义函数nl2p()换行用法分析
2016/04/02 PHP
PHP7标量类型declare用法实例分析
2016/09/26 PHP
Yii2汉字转拼音类的实例代码
2017/04/18 PHP
如何修改Laravel中url()函数生成URL的根地址
2017/08/11 PHP
php简单读取.vcf格式文件的方法示例
2017/09/02 PHP
laravel-admin 在列表页添加自定义按钮的例子
2019/09/30 PHP
Laravel创建数据库表结构的例子
2019/10/09 PHP
jQueryUI写一个调整分类的拖放效果实现代码
2012/05/10 Javascript
网站繁简切换的JS遇到页面卡死的解决方法
2014/03/12 Javascript
js的touch事件的实际引用
2014/10/13 Javascript
js实现window.open不被拦截的解决方法汇总
2014/10/30 Javascript
JavaScript制作淘宝星级评分效果的思路
2020/06/23 Javascript
jQuery实现的AJAX简单弹出层效果代码
2015/11/26 Javascript
javascript时间戳和日期字符串相互转换代码(超简单)
2016/06/22 Javascript
简单实现js页面切换功能
2021/01/10 Javascript
bootstrap日历插件datetimepicker使用方法
2016/12/14 Javascript
JS实现点击下拉菜单把选择的内容同步到input输入框内的实例
2018/01/23 Javascript
nodejs搭建本地服务器轻松解决跨域问题
2018/03/21 NodeJs
浅谈vue 单文件探索
2018/09/05 Javascript
Vue实现开心消消乐游戏算法
2019/10/22 Javascript
全面解析Python的While循环语句的使用方法
2015/10/13 Python
python dict 字典 以及 赋值 引用的一些实例(详解)
2017/01/20 Python
Python读csv文件去掉一列后再写入新的文件实例
2017/12/28 Python
python版飞机大战代码分享
2018/11/20 Python
python3 线性回归验证方法
2019/07/09 Python
python 实现兔子生兔子示例
2019/11/21 Python
Python:type、object、class与内置类型实例
2019/12/25 Python
基于PyTorch的permute和reshape/view的区别介绍
2020/06/18 Python
销售人员个人求职信
2013/09/26 职场文书
求职简历中的自我评价分享
2013/12/08 职场文书
工程管理专业毕业生自荐信
2014/01/24 职场文书
内勤主管岗位职责
2014/04/03 职场文书
浪漫婚礼主持词开场白
2015/11/24 职场文书
解析MySQL binlog
2021/06/11 MySQL
24年收藏2000多部退役军用电台
2022/02/18 无线电
css之clearfix的用法深入理解(必看篇)
2023/05/21 HTML / CSS