prototype 1.5 & scriptaculous 1.6.1 学习笔记


Posted in Javascript onSeptember 07, 2006

最近做otalk,开始是基于prototype1.4的,后来因为我加上了scriptaculous 1.6.1,她要求prototype的版本是1.5的,所以就升级到了1.5,看着demo学习起了scriptaculous的用法.
用法稍后整理,因为在使用过程中很多次效果都不让自己满意,想看代码又看不明白,经过一次折磨,我下定决心,一定要把scriptaculous和prototype的代码看明白!

这里作为我的学习笔记,可能没有什么顺序了逻辑,等到学习完,最后整理

首先是定义类  看着笑笑老师的一些介绍,自己看是试验起来,往往很多东西看了觉着明白,其实还是差很多的

var Class = {
  create: function() {
    return function() {
      this.initialize.apply(this, arguments);
    }
  }
}

定义了一个class函数作为创建类的模版或者说是原型
使用方法
var llinzzi= Class.create();
llinzzi.prototype = {
    initialize:function(){
          document.write('实例被创建');
    },
    fun1:function(){document.write('方法被实例调用');}
}

var linChild = new llinzzi();
运行,输出'实例被创建'说明initialize是创建实例的时候被调用的
回顾 Class代码中
    return function() {
      this.initialize.apply(this, arguments);
    }
看出,当执行create方法时,就开始调用.
linChild.fun1();
输出'方法被实例调用',fun1方法被成功调用
就是当采用了prototype的Class.create();方法创建对象的时候,initialize作为特殊的方法,在创建实例的时候被执行,用以初始化.

续承
Object.extend = function(destination, source) {
  for (var property in source) {
    destination[property] = source[property];
  }
  return destination;
}

用法
Object.extend(目标,源);
让我产生奇怪的是scriptaculous中的一段代码
    var options = Object.extend({
      greedy:     true,
      hoverclass: null,
      tree:       false
    }, arguments[1] || {});
既然是定义一个options为什么还要用Object.extend方法
直接
var options ={
      greedy:     true,
      hoverclass: null,
      tree:       false
}
不就行了么?等等,出现问题了.后面还有arguments[1] || {},这应该是目标,目标是函数的参数,分析下,获取参数,如果没有这个参数的时候则为{}就是恐,如果有的话,相比也是{hoverclass:'xx'}的格式,哦,原来定义options也不是这么简单的,先看有没有参数,无论有没有,利用Object.extend方法,把参数中的对象追加或覆盖到前面的{     greedy:     true,      hoverclass: null,      tree:       false}中,如果参数是无,则相当简单的上面的 var options = {};了但,如果参数中有{hoverclass:'abc'}呢?这时候覆盖了原来的hoverclass的值null,然后看Object.extend方法返回值就是第一个参数被覆盖后的全部的值
不得不佩服,一段一句进行定义,同时有设置了默认值.
越看越有意思,继续看下去

Javascript 相关文章推荐
javascript实现的基于金山词霸网络翻译的代码
Jan 15 Javascript
javascrip关于继承的小例子
May 10 Javascript
简单谈谈javascript代码复用模式
Jan 28 Javascript
javascript实现表单验证
Jan 29 Javascript
jQuery ui autocomplete选择列表被Bootstrap模态窗遮挡的完美解决方法
Sep 23 Javascript
jQuery的中 is(':visible') 解析及用法(必看)
Feb 12 Javascript
vuejs2.0实现一个简单的分页示例
Feb 22 Javascript
JavaScript中最常见的三个面试题解析
Mar 04 Javascript
从零开始学习Node.js系列教程三:图片上传和显示方法示例
Apr 13 Javascript
vue 过滤器filter实例详解
Mar 14 Javascript
小程序实现录音上传功能
Nov 22 Javascript
微信小程序基于ColorUI构建皮皮虾短视频去水印组件
Nov 04 Javascript
彪哥1.1(智能表格)提供下载
Sep 07 #Javascript
日期函数扩展类Ver0.1.1
Sep 07 #Javascript
js脚本学习 比较实用的基础
Sep 07 #Javascript
prototype 的说明 js类
Sep 07 #Javascript
你的编程语言可以这样做吗?
Sep 07 #Javascript
音乐播放用的的几个函数
Sep 07 #Javascript
在网页中屏蔽快捷键
Sep 06 #Javascript
You might like
PHP setcookie设置Cookie用法(及设置无效的问题)
2011/07/13 PHP
smarty模板引擎从配置文件中获取数据的方法
2015/01/22 PHP
PHP聚合式迭代器接口IteratorAggregate用法分析
2017/12/28 PHP
用Javascript实现锚点(Anchor)间平滑跳转
2009/09/08 Javascript
XMLHTTP 乱码的解决方法(UTF8,GB2312 编码 解码)
2011/01/12 Javascript
jQuery EasyUI API 中文文档 - PropertyGrid属性表格
2011/11/18 Javascript
实测jquery data()如何存值
2013/08/18 Javascript
jquery快捷动态绑定键盘事件的操作函数代码
2013/10/17 Javascript
js获取元素的标签名实现方法
2016/10/08 Javascript
微信小程序链接传参并跳转新页面
2016/11/29 Javascript
AngularJS的脏检查深入分析
2017/04/22 Javascript
AngularJS自定义指令详解(有分页插件代码)
2017/06/12 Javascript
ionic 3.0+ 项目搭建运行环境的教程
2017/08/09 Javascript
Vue组件通信的几种实现方法
2019/04/25 Javascript
redux处理异步action解决方案
2020/03/22 Javascript
JS判断浏览器类型与操作系统的方法分析
2020/04/30 Javascript
浅谈Python 对象内存占用
2016/07/15 Python
Python探索之静态方法和类方法的区别详解
2017/10/27 Python
python之当你发现QTimer不能用时的解决方法
2019/06/21 Python
用Anaconda安装本地python包的方法及路径问题(图文)
2019/07/16 Python
Jupyter Notebook折叠输出的内容实例
2020/04/22 Python
Python实现常见的几种加密算法(MD5,SHA-1,HMAC,DES/AES,RSA和ECC)
2020/05/09 Python
简单了解如何封装自己的Python包
2020/07/08 Python
Python读取图像并显示灰度图的实现
2020/12/01 Python
canvas生成带二维码海报的踩坑记录
2019/09/11 HTML / CSS
html5视频常用API接口的实战示例
2020/03/20 HTML / CSS
阿迪达斯奥地利官方商城:adidas.at
2016/10/16 全球购物
Coach澳大利亚官方网站:美国著名时尚奢侈品牌
2017/05/24 全球购物
房地产管理毕业生自荐信
2013/11/04 职场文书
终端业务员岗位职责
2013/11/27 职场文书
大学生工作求职信
2014/06/23 职场文书
房产转让协议书(2014版)
2014/09/30 职场文书
诉讼授权委托书
2014/10/15 职场文书
简历上的自我评价,该怎么写呢?
2019/06/13 职场文书
JavaGUI模仿QQ聊天功能完整版
2021/07/04 Java/Android
Java如何实现通过键盘输入一个数组
2022/02/15 Java/Android