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 相关文章推荐
IE6下JS动态设置图片src地址问题
Jan 08 Javascript
jQuery Tips 为AJAX回调函数传递额外参数的方法
Dec 28 Javascript
javascript运行机制之this详细介绍
Feb 07 Javascript
php和js对数据库图片进行等比缩放示例
Apr 28 Javascript
Windows 系统下安装和部署Egret的开发环境
Jul 31 Javascript
jQuery中:image选择器用法实例
Jan 03 Javascript
jQuery实现立体式数字动态增加(animate方法)
Dec 21 Javascript
微信小程序 开发之滑块视图容器(swiper)详解及实例代码
Feb 22 Javascript
深入理解node.js之path模块
May 03 Javascript
JavaScript递归算法生成树形菜单
Aug 15 Javascript
基于jquery实现五星好评
Nov 18 jQuery
three.js搭建室内场景教程
Dec 30 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
全国FM电台频率大全 - 28 甘肃省
2020/03/11 无线电
PHP+MySQL投票系统的设计和实现分享
2012/09/23 PHP
php调用Google translate_tts api实现代码
2013/08/07 PHP
ThinkPHP模板判断输出Present标签用法详解
2014/06/30 PHP
PHP获取远程图片并保存到本地的方法
2015/05/12 PHP
PHP正则表达式之捕获组与非捕获组
2015/11/06 PHP
PHP创建PowerPoint2007文档的方法
2015/12/10 PHP
PHP5.2中PDO的简单使用方法
2016/03/25 PHP
php中关于长度计算容易混淆的问题分析
2016/05/27 PHP
php求今天、昨天、明天时间戳的简单实现方法
2016/07/28 PHP
PHP 获取指定地区的天气实例代码
2017/02/08 PHP
JQuery 拾色器插件发布-jquery.icolor.js
2010/10/20 Javascript
js完美的div拖拽实例代码
2014/01/22 Javascript
js获取指定的cookie的具体实现
2014/02/20 Javascript
jQuery实现当前页面标签高亮显示的方法
2015/03/10 Javascript
Bootstrap每天必学之栅格系统(布局)
2015/11/25 Javascript
微信小程序 wx.request(OBJECT)发起请求详解
2016/10/13 Javascript
详解用node-images 打造简易图片服务器
2017/05/08 Javascript
lhgcalendar时间插件限制只能选择三个月的实现方法
2017/07/03 Javascript
用node开发并发布一个cli工具的方法步骤
2019/01/03 Javascript
关于vue状态过渡transition不起作用的原因解决
2019/04/09 Javascript
微信小程序wxs实现吸顶效果
2020/01/08 Javascript
vscode中的vue项目报错Property ‘xxx‘ does not exist on type ‘CombinedVueInstance<{ readyOnly...Vetur(2339)
2020/09/11 Javascript
[34:56]Ti4冒泡赛LGD vs Liquid 1
2014/07/14 DOTA
[00:10]DOTA2全国高校联赛 以DOTA2会友
2018/05/30 DOTA
[56:48]FNATIC vs EG 2019国际邀请赛小组赛 BO2 第二场 8.15
2019/08/16 DOTA
python实现带错误处理功能的远程文件读取方法
2015/04/29 Python
Python制作爬虫抓取美女图
2016/01/20 Python
python实现感知器算法(批处理)
2019/01/18 Python
python 实现目录复制的三种小结
2019/12/04 Python
Lancer Skincare官方网站:抗衰老皮肤护理
2020/11/20 全球购物
投资合作协议书范本
2014/04/17 职场文书
员工生日活动方案
2014/08/24 职场文书
小学生2015教师节演讲稿
2015/03/19 职场文书
被告答辩状范文
2015/05/22 职场文书
平凡的世界读书笔记
2015/06/25 职场文书