关于prototype.js的一些技术说明

本文是转载,关于prototype.js的一些技术说明说明,比如关于javascript的apply和call函数,关于闭包,关于函数的绑定,关于事件的注册,关于事件监听最佳实践等等,很难得的一篇文章,从dnew.cn转载而来。

关于闭包

prototype.js在Class.create,bind等中用到javascript的闭包特色。但整体上prototype.js对于强大的闭包特性用的不多。大家可以参阅我翻译的篇文章了解闭包。

3、让我比较反感的两个方法

(1)

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

很讨厌用别的语言的风格来写javascript。用这个方法构造自定义类 并没有觉得有多方便,减少代码行数,只会让人难理解,多定义一个initialize方法。

其实讨厌这条有些牵强,不过修改Object的原型对象就有点过分了。

(2)Object.prototype.extend

先不过你取个extend的名字会让熟悉java的人引起的歧义。修改Object的prototype就说不过去了。不知道作者是怎么考虑的。当你for in循环对象是,麻烦就来了。可能有人会问你for in干吗。 我一个项目中既用了DWR,也用了prototype.js,dwr返回的javascript对象都多了个exetend属性,还得特殊处理。

以前我比较过dojo和prototype.js中继承的实现,现在我明白个道理。对于javascript这种没有静态类型检查,语法宽松的语言来讲,如果你选择了某个js类库,那你也必须适应作者写javascript的风格。prototype.js的作者对extend的使用炉火纯青,如果我们不当它只是个属性拷贝的函数的话,多读读prototype.js的代码是好的。

关于事件的注册

<script src="prototype1.3.1.js"></script>
<input type=checkbox id=myChk name="chk" value=1> Test
<script>
Event.observe(myChk, 'click', showMessage, false);
//$('myChk').onclick=showMessage;
//$('myChk').onclick=showMessage.bind();
$('myChk').onclick=showMessage.bind($('myChk'));
function showMessage() {
   alert(this.value);
}
</script>

执行上面代码,你就能明白Event.observe与bind/bindAsEventListener之间的区别:

(1) 显然Event.observe有限制,只能处理简单的函数,并函数中不能有this之类的东西。

(2)Event.observe内部用到addEventListener/attachEvent。能把多个函数加到一个触发事件(window.onload)。bind是覆盖。

时间: 2024-08-30 02:12:17

关于prototype.js的一些技术说明的相关文章

调用prototype.js的ajax进行post提交示例源码

以下是index.html:<%@LANGUAGE="VBSCRIPT" CODEPAGE="65001"%> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http

prototype.js常用函数和用法

函数名  解释  举例  Element.toggle  交替隐藏或显示  Element.toggle(''div1'',''div2'')  Element.hide  隐藏  Element.hide(''div1'',''div2'')  Element.show 显示  Element.show(''div1'',''div2'')  Element.remove  删除  Element.remove(''div1'',''div2'')  Element.getHeight  取得

修改后的prototype.js,增加进度条和验证输入框

js 使用示例<script type="text/javascript" src="../scripts/prototype.js"></script><script type="text/javascript">var progressBar;/**//** 功能:admin登录*/function UserLogin(){        //验证页面控件    var checkform = new Ch

prototype.js是什么?(prototype教程示例)

js|教程|示例|prototype prototype.js是什么?万一你没有使用过大名鼎鼎的prototype.js,那么让我来告诉你,prototype.js是由Sam Stephenson写的一个javascript类库.这个构思奇妙,而且兼容标准的类库,能帮助你轻松建立有高度互动的web2.0特性的富客户端页面. 如果你最近尝试使用它,你大概了解到文档并不是作者的一个强项.和在我以前使用这个类库的不少开发者一样,一开始,我不得不一头扎进阅读prototype.js的源代码和实验它的功能

基于prototype.js验证框架(validation.js)的三个应用

最近对prototype.js用的比较多,同时发现了一个基于prototype.js的验证框架: validation.js really easy field validation with prototype,下面是我在开发中用到的三个例子. 前提条件: 首先要在html页面中引入几个js <script type='text/javascript' src='../script/prototype.js'></script> <script type='text/jav

对prototype.js进行的扩展

最近的项目中要使用ajax,于是对各种ajaxframework在进行比较之后,最终选择了prototype.js,由于prototype.js是一个非常基础的ajaxframework,需要根据项目需求自己来进行一些扩展,下面就是我所做的一些扩展,如有误,请指正! 我实现了一个Form.Element.ValidationObserver,这个类需要依赖Validation.js以及相应的css(validation-advice),该类是对表单中的单个元素通过ajax结合后台进行验证,其中因

Prototype.js evalJSON()等于json.js的parseJSON()?

问题描述 Prototype.js evalJSON()等于json.js的parseJSON()? Prototype.js evalJSON()方法与json.js的parseJSON()功能是否一样啊? 这两个方法是不是都是把json字符串转化为json对象啊? 解决方案 JSON.parse()之可以解析json格式的数据,并且会对要解析的字符串进行格式检查,如果格式不正确则不进行解析,而eval()则可以解析任何字符串,eval是不安全的. 比如下面的字符串: var str = 'a

prototype js-关于prototype.js的ajax交互问题

问题描述 关于prototype.js的ajax交互问题 1:请问为什么我使用new Form.Element.Observer("aaa",1,doAjax);这段代码会导致页面错误?各 种浏览器都不行啊,这不是表单元素的监听器么? 2:Ajax.Updater应该是不需要指定回调函数的是么?那么如何指定响应结果在哪里显示呢? 期待大神解答~~非常感谢

prototype.js的td取值问题

问题描述 我有一个表格的信息如下,<divclass="panelContentContainer"><divstyle="height:250px;"class="panelContent"><tablestyle="border-style:solid;border-width:0pt;border-collapse:collapse;"width="90%"align=&