最近做otalk,开始是基于prototype1.4的,后来因为我加上了scriptaculous1.6.1,她要求prototype的版本是1.5的,所以就升级到了1.5,看着demo学习起了scriptaculous的用法.
用法稍后整理,因为在使用过程中很多次效果都不让自己满意,想看代码又看不明白,经过一次折磨,我下定决心,一定要把scriptaculous和prototype的代码看明白!
这里作为我的学习笔记,可能没有什么顺序了逻辑,等到学习完,最后整理
首先是定义类看着笑笑老师的一些介绍,自己看是试验起来,往往很多东西看了觉着明白,其实还是差很多的
varClass={
create:function(){
returnfunction(){
this.initialize.apply(this,arguments);
}
}
}
定义了一个class函数作为创建类的模版或者说是原型
使用方法
varllinzzi=Class.create();
llinzzi.prototype={
initialize:function(){
document.write('实例被创建');
},
fun1:function(){document.write('方法被实例调用');}
}
varlinChild=newllinzzi();
运行,输出'实例被创建'说明initialize是创建实例的时候被调用的
回顾Class代码中
returnfunction(){
this.initialize.apply(this,arguments);
}
看出,当执行create方法时,就开始调用.
linChild.fun1();
输出'方法被实例调用',fun1方法被成功调用
就是当采用了prototype的Class.create();方法创建对象的时候,initialize作为特殊的方法,在创建实例的时候被执行,用以初始化.
续承
Object.extend=function(destination,source){
for(varpropertyinsource){
destination[property]=source[property];
}
returndestination;
}
用法
Object.extend(目标,源);
让我产生奇怪的是scriptaculous中的一段代码
varoptions=Object.extend({
greedy:true,
hoverclass:null,
tree:false
},arguments[1]||{});
既然是定义一个options为什么还要用Object.extend方法
直接
varoptions={
greedy:true,
hoverclass:null,
tree:false
}
不就行了么?等等,出现问题了.后面还有arguments[1]||{},这应该是目标,目标是函数的参数,分析下,获取参数,如果没有这个参数的时候则为{}就是恐,如果有的话,相比也是{hoverclass:'xx'}的格式,哦,原来定义options也不是这么简单的,先看有没有参数,无论有没有,利用Object.extend方法,把参数中的对象追加或覆盖到前面的{greedy:true,hoverclass:null,tree:false}中,如果参数是无,则相当简单的上面的varoptions={};了但,如果参数中有{hoverclass:'abc'}呢?这时候覆盖了原来的hoverclass的值null,然后看Object.extend方法返回值就是第一个参数被覆盖后的全部的值
不得不佩服,一段一句进行定义,同时有设置了默认值.
越看越有意思,继续看下去
【prototype 1.5 & scriptaculous 1.6.1 学习笔记】相关文章：
★ jQuery实现控制文字内容溢出用省略号(…)表示的方法
★ 測試代碼真方便