Prototype 学习 Prototype对象


Posted in Javascript onJuly 12, 2009

环境:
Prototype Version: '1.6.1_rc3'
Aptana Studio, build: 1.2.5.023247
IE7
FF2.0.0.4
Opera 10 beta

var Prototype = { 
Version: '1.6.1_rc3', 
//定义浏览器对象 
Browser: (function(){ 
var ua = navigator.userAgent; 
var isOpera = Object.prototype.toString.call(window.opera) == '[object Opera]'; 
return { 
IE: !!window.attachEvent && !isOpera, 
Opera: isOpera, 
WebKit: ua.indexOf('AppleWebKit/') > -1, 
Gecko: ua.indexOf('Gecko') > -1 && ua.indexOf('KHTML') === -1, 
MobileSafari: /Apple.*Mobile.*Safari/.test(ua) 
} 
})(), 
//定义浏览器Feature对象 
BrowserFeatures: { 
XPath: !!document.evaluate, 
SelectorsAPI: !!document.querySelector, 
ElementExtensions: (function() { 
var constructor = window.Element || window.HTMLElement; 
return !!(constructor && constructor.prototype); 
})(), 
SpecificElementExtensions: (function() { 
if (typeof window.HTMLDivElement !== 'undefined') 
return true; 
var div = document.createElement('div'); 
var form = document.createElement('form'); 
var isSupported = false; 
if (div['__proto__'] && (div['__proto__'] !== form['__proto__'])) { 
isSupported = true; 
} 
div = form = null; 
return isSupported; 
})() 
}, 
ScriptFragment: '<script[^>]*>([\\S\\s]*?)<\/script>', 
JSONFilter: /^\/\*-secure-([\s\S]*)\*\/\s*$/, 
emptyFunction: function() { }, 
K: function(x) { return x } 
}; 
if (Prototype.Browser.MobileSafari) 
Prototype.BrowserFeatures.SpecificElementExtensions = false;

Broswer对象是通过调用匿名函数并且立即执行的方式返回的,执行匿名函数的方法有三种:
1. (function(){return 1})() //()可以强制求值,返回函数对象然后执行函数
2. (function(){return 1}()) //返回函数执行的结果
3. void function(){alert(1)}() //void 也有强制运算的用法
其中判断Opera的方法isOpera用到了window.opera,在Opera浏览器中会返回一个对象,其它浏览器返回undefined
BrowserFeatures对象主要判断浏览器的一些特性,FF支持许多的特性在IE下不支持,比如document.evalute方法就可以通过XPATH的方式操作HTML文档,但IE就不支持。
此函数详细用法如下:
var xpathResult = document.evaluate(xpathExpression, contextNode, namespaceResolver, resultType, result);

The evaluate function takes a total of five arguments:
xpathExpression: A string containing an xpath expression to be evaluated
contextNode: A node in the document against which the Xpath expression should be evaluated
namespaceResolver: A function that takes a string containing a namespace prefix from the xpathExpression and returns a string containing the URI to which that prefix corresponds. This enables conversion between the prefixes used in the XPath expressions and the (possibly different) prefixes used in the document
resultType: A numeric constant indicating the type of result that is returned. These constants are avaliable in the global XPathResult object and are defined in the relevaant section of the XPath Spec. For most purposes it's OK to pass in XPathResult.ANY_TYPE which will cause the results of the Xpath expression to be returned as the most natural type
result:An existing XPathResult to use for the results. Passing null causes a new XPathResult to be created.
其中__proto__这个在FF下可以取得对象的prototype对象,即对象的原型。这也是javascript继承机制的基础,基于原型的继承,不像通常的C++,JAVA,C#语言的基于类的继承。还有一种metaclass的继承方式,在ruby和python中常有应用。
其中ScriptFragment定义网页中引用脚本的正则表达式
JSONFilter:还是引用prototype原文的解释更清楚他的用法——
/*String#evalJSON internally calls String#unfilterJSON and automatically removes optional security comment delimiters (defined in Prototype.JSONFilter).*/ person = '/*-secure-\n{"name": "Violet", "occupation": "character"}\n*/'.evalJSON() person.name; //-> "Violet" 
/*You should always set security comment delimiters (/*-secure-\n...*/) around sensitive JSON or JavaScript data to prevent Hijacking. (See this PDF document for more details.)*/

Prototype.K就是返回第一个参数的方法:
Prototype.K('hello world!'); // -> 'hello world!' 
Prototype.K(1.5); // -> 1.5 
Prototype.K(Prototype.K); // -> Prototype.K

说明一下JavaScript里面的静态方法和实例方法
静态方法要这样扩展:
Date.toArray=function(){}
那么toArray方法就是Date的静态方法,不能这样调用(new Date()).toArray();否则会抛出异常
要这样用:Date.toArray()
实例方法要这样扩展:
Date.prototype.toArray2=function(){}
那么toArray2方法就是Date的实例方法了,不能这样调用Date.toArray2();
要这样用:(new Date()).toArray2()
Javascript 相关文章推荐
JS OOP包机制,类创建的方法定义
Nov 02 Javascript
js类型转换与引用类型详解(Boolean_Number_String)
Mar 07 Javascript
基于jquery实现瀑布流布局
Jun 28 Javascript
JS之获取样式的简单实现方法(推荐)
Sep 13 Javascript
BootStrap实现带有增删改查功能的表格(DEMO详解)
Oct 26 Javascript
JS创建对象的写法示例
Nov 04 Javascript
Webpack打包慢问题的完美解决方法
Mar 16 Javascript
layer子层给父层页面元素赋值,以达到向父层页面传值的效果实例
Sep 22 Javascript
vue在手机中通过本机IP地址访问webApp的方法
Aug 15 Javascript
详解webpack2异步加载套路
Sep 14 Javascript
详解Vue源码中一些util函数
Apr 24 Javascript
详解Jest结合Vue-test-utils使用的初步实践
Jun 27 Javascript
javascript 动态加载 css 方法总结
Jul 11 #Javascript
checkbox 复选框不能为空
Jul 11 #Javascript
javascript 页面只自动刷新一次
Jul 10 #Javascript
javascript div 遮罩层封锁整个页面
Jul 10 #Javascript
JQuery 实现的页面滚动时浮动窗口控件
Jul 10 #Javascript
javascript 读取xml,写入xml 实现代码
Jul 10 #Javascript
jquery 1.3.2 IE8中的一点点的小问题解决方法
Jul 10 #Javascript
You might like
php 删除cookie方法详解
2014/12/01 PHP
JS控制表格隔行变色
2006/06/26 Javascript
javascript 日期时间函数(经典+完善+实用)
2009/05/27 Javascript
javascript call方法使用说明
2010/01/11 Javascript
jQuery 前的按键判断代码
2010/03/19 Javascript
javascript实现带下拉子菜单的导航菜单效果
2015/05/14 Javascript
json+jQuery实现的无限级树形菜单效果代码
2015/08/27 Javascript
跟我学习javascript创建对象(类)的8种方法
2015/11/20 Javascript
js实现对ajax请求面向对象的封装
2016/01/08 Javascript
12306 刷票脚本及稳固刷票脚本(防挂)
2017/01/04 Javascript
javascript操作cookie
2017/01/17 Javascript
AngularJS中的拦截器实例详解
2017/04/07 Javascript
.net MVC+Bootstrap下使用localResizeIMG上传图片
2017/04/21 Javascript
详解探索 vuex 2.0 以及使用 vuejs 2.0 + vuex 2.0 构建记事本应用
2017/06/16 Javascript
D3.js实现拓扑图的示例代码
2018/06/30 Javascript
Bootstrap 模态框自定义点击和关闭事件详解
2018/08/10 Javascript
JavaScript错误处理操作实例详解
2019/01/04 Javascript
说说Vuex的getters属性的具体用法
2019/04/15 Javascript
[00:31]DOTA2荣耀之路7:Miracle-空血无敌斩
2018/05/31 DOTA
python转换字符串为摩尔斯电码的方法
2015/07/06 Python
web.py 十分钟创建简易博客实现代码
2016/04/22 Python
python rsa 加密解密
2017/03/20 Python
django 发送手机验证码的示例代码
2018/04/25 Python
python批量赋值操作实例
2018/10/22 Python
详解python的argpare和click模块小结
2019/03/31 Python
django 信号调度机制详解
2019/07/19 Python
Python多线程thread及模块使用实例
2020/04/28 Python
完美解决Django2.0中models下的ForeignKey()问题
2020/05/19 Python
解决python3输入的坑——input()
2020/12/05 Python
新奇的小玩意:IWOOT
2016/07/21 全球购物
欧洲最大的美妆零售网站:Feelunique
2017/01/14 全球购物
法国珠宝店:CLEOR
2017/01/29 全球购物
2014年置业顾问工作总结
2014/11/17 职场文书
2015年安全保卫工作总结
2015/05/14 职场文书
成本低的5个创业项目:投资小、赚钱快
2019/08/20 职场文书
一文帮你理解PReact10.5.13源码
2021/04/03 Javascript