prototype行话：
1Objects,Namespaces,andModules
Prototype的对象一般分为三种：
类class: 使用new操作符来构建对象，对象属性存储在实例字段中。。
ObjectRange,Ajax.Request,andPeriodicalExecuter这些都是
空间namespace: 这类对象相当于命名空间,他们存在只是为了将一些相关的元素打包
比如AjaxandEvent.
Module模块： 与RUBY中的模块相似，自身不是空间，包含方法，
存在是为了去混入其它的对象，去增强其它的方法
比如Enumerable
一个JS对象就是一个无序的属性容器
属性包括名称与值
对象可以使用{}声明
顶级变量其实就是一个window的属性
Functionsasfirstclasscitizens函数为一等公民
函数实质上与NumberString等一样
用法：1.赋给变量
2.赋给一个对象的属性
3.以参数传递
4.以函数结果返回
5.使用{}创建
无处不在的$操作符
$('foo')
varitems=$('navbar','adbar','footer');可以传入几个参数
vara=$w('sinbaisin');相当于ruby中的字符串%W,用来构造字符串数组
$$利用CSS选择器进行搜索
$$('div')
$$('#contents') 等同于$('#contents'),但它返回一个数组
$$('li.faux') 所有faux类的li
$$('#contentsa[rel]')带有rel属性，父元素为#contents的a
$$('a[href="#"]')href属性为#的所有a元素
$$('#navbarli','#sidebarli')navbar及sibebar下的所有li
$$('a:not([rel~=nofollow])');除了rel为nofollow的所有a
$$('tabletbody>tr:nthchild(even)');body里面的所有偶数行
$$('div:empty');所有空的div元素
当函数做为参数传递时，函数就会丢掉自己以前默认
的binding对象,而变成window
支持的CSS选择符:
标记 div
后代 #ali
属性 [attr]含有属性
[attr=value]等于特殊的属性
[attr~=value]Hasawhitespaceseparatedlistcontainingavalue.
Thinkclass=values.
[attr|=value]Hasaspecificvalueorstartswithitfollowedby
ahyphen().Thinklanguagecodes.
[attr!=value]Doesnothaveaspecificvalue
(noteit’snotstandardCSS3;it’sjustthereforconvenience).
[attr^=value]以特定的字符开头
[attr$=value]以特定的字符结尾
[attr*=value]包含特殊的值.
如果你要匹配的字符串里面包含的空格,请用引号民将字符串包含起来
比如[title="Helloworld!"].
类 .highlighted.example.wrong
下一代 #item1>a
相邻同伴 #item1+p
邻近的 #item1~p.
NOT *:not(.critical)ora:not([rel~=nofollow]).
:nth* tbody>tr:nthchild(even),#dialog>p:nthchild(3n+1)
,or#intro>p:nthoftype(2).
:first* #intro>h1:firstoftypeor#footer>*:firstchild.
:last* ul>li:lastchildor#articlep:lastoftype.
:empty p:empty.内容为空
:enabled:disabled input:enabled
:checked input:checked.
$A 把一些看起来像数组的（支持length）数据型数据转化成真正的数组
$F() 专对于Form，以Formitem的ID为参数,获取field的值
$H 用于转换HASH
$R 用于生成RANGE
一般的JS技巧
1.for...in在JS中,本来是用来反射对象属性和方法
1内省方法(自我反射)
Object.inspect(obj)!String
Object.isArray(obj)!Boolean
Object.isElement(obj)!Boolean
Object.isFunction(obj)!Boolean
Object.isHash(obj)!Boolean
Object.isNumber(obj)!Boolean
Object.isString(obj)!Boolean
Object.isUndefined(obj)!Boolean
Object.keys(obj)![String,...]把对象当成一个HASH，
列出所有相关属性方法的KEY
Object.values(obj)![value,...]返回相应的KEY值
Object.toQueryString(obj)!String
对一些对象的字符串
的更好表示
var arr = ['hello' ,'world' ];
var props = [];
for (var prop in arr)
props.push(prop);
2拷贝
Object.clone(obj)是浅拷贝，因为它是拷贝对象的所有属性
Object.extend(obj,obj2)把第二个的所有属性及方法扩展到第一个里面去
3其它
Object.toHTML(obj)!String
RegExp.escape(touchyText)!String
4绑定
bind(thisRef[,arg...])!boundFunction
CoolObj.getCallDef.bind(CoolObj,1,2,3);
bindAsEventListener(thisRef[,arg...])!boundFunction
用来作为绑定事件,在事件一节我会解释这个函数存在的意义
5其它
String.prototype.splitOnColons=String.prototype.split.curry(':');
为一些函数预先准备参数，一般用在传递函数的时候。
String.prototype.mySplit= String.prototype.split.curry(':' );
"sina:baidu:yahoo".mySplit()
延迟执行
function.delay()defer()这个就是把delay变成0.01的意思
loadQuestion.delay(5,++qId);五秒钟后执行,带有参数
6调用转嫁
$w('absroundceilfloor').each(function(method){
Number.prototype[method]=Math[method].methodize()
});
对一个对象调用的方法就会转嫁到另外一个方法,并把这个对象当成他的第一
个参数,这也是典型的Element.update()的实现模式
Number.prototype["myabs"] = Math["abs"].methodize();
(-30).myabs() 对myabs的调用会转到Math.abs方法,并把-30作为参数传递
2.数字： JS中的数字其实是对象
42).toString(16)
(5/3).toFixed(6)
为数字扩展的一些方法
abs()!Number
ceil()!Number
floor()!Number
round()!Number
succ()!Number
times(iterator)!sameNumber
toColorPart()!hexString
toPaddedString(length[,radix=10])!String
(5).times(function(){alert("Isn'tthisannoying?");});
该绑定函数是可以预
先绑定一些参数的
其实就是包装了Math
中的方法
转换成十六进制的颜
色表示
3.字符串：
去掉多余的部分，返回新的字符串：
strip()!String 删除头和尾的字符,包括尾巴上的回车符
stripScripts()!String删除script标记
stripTags()!String 删除字符串的所有HTML标记
truncate([length=30[,truncation='...']])!String截断字符串
转换：
succ()!String跟ruby的succ差不多，但这个不会从z自动转到a,而是
转到"{",以unicode顺序向下传递,"z".succ()=>"{'
escapeHTML()!String把HTML标记转成一般的字符
unescapeHTML()!String
camelize()!String
capitalize()!String 第一个字符大写，其它小写
dasherize()!String
underscore()!String
替换：
gsub(pattern,replacement|iterator)!String
参数为字符串模板，或者是函数
interpolate(scopeObject[,pattern])!String
scan(pattern,iterator)!sameString返回检查到的相同字符
sub(pattern,replacement|iterator[,count=1])!String
脚本：
extractScripts()![JSString,..]把字符串中的脚本提出来,返回一个数组
evalScripts()![resultValue,...]
把提取出来的脚本数组一个个运行,返回运行后的结果,没有return
就返回undefined
转换和提取:把字符串以其他的形式展示
inspect([useDoubleQuotes=false])!String
parseQuery/toQueryParams([separator='&'])!Object
toArray()![char,...]
搜索:
endsWith(string)!Boolean
include(string)!Boolean
startsWith(string)!Boolean
4.数组： Enumerablemodule基于each,但如果JS的forEach存在,就使用这个函数
数组内容转换
clear()!emptiedArray 清除所有元素
compact()!newArray 对数组进行清理,删除null及一些undefined
flatten()!Array 把任何层次的数组转化成一元数组
intersect(Array)!Array 取回两个数组中相同的一些元素,会利用uniq
reduce()!Array|singleValue 如果数组有多个元素,没有变化,如果
只有一个元素,就在于返回这个元素,a=[1];a.reduce()=>a=1
reverse([inline=true])!Array对数组进行反转
参数为false代表是先复制数组再反转,对原数组没有影响
uniq([sorted=false])!Array 清理数组中的重复性元素
如果带参数排序了的,可以优化性能,返回一个新数组,其中不包括参数
without(value...)!Array
'border'.camelize()
'bor-st'.camelize()
'b-sTYLE'.camelize()
// -> 'bSTYLE' // 只转换第一个字符
'border-left-color'.camelize()
'borderLeftColor'.underscore()
'borderLeftColor'.underscore().dasher
ize()
'Draft-WHATWebForms1'.underscore()
'cool stuff'.capitalize()
'COOL STUFF'.capitalize()
将上述表达直接在firebug中输入以查看结
果
'Vowels are bad for
you'.gsub(/[aeiouy]/, '-' )
'My name is Henry-
James'.gsub(/[aeiouy]/, '[#{0}]' )
'Life is short'.sub(/\w+/,
'\##{0}\#' )
'Die hard 4 (scripting is back with
a vengeance)'.gsub(/\w+/,
function(match) { return
match[0].capitalize(); })
'Poor sample string gets
framed'.sub(/\w+/, '[#{0}]' , 3)
var oCounts = []
'foo boo boz'.scan(/o+/,
function(match) {
oCounts.push(match[0].length);
});
oCounts
将上述表达直接在firebug中输入以查看
结果
把一个URL形式的字符串转化成一个对
象,如果有一个键而有N个值，则这个键
的值,就是一个数组
索引：
first()!value
indexOf(value)!position
lastIndexOf(value)!position
last()!value
clone/toArray()!newArray
size()!Number
JSON支持：（忽略值为函数的属性）
Object.toJSON(obj)!String
array.toJSON()!String
date.toJSON()!String
hash.toJSON()!String
number.toJSON()!String
string.toJSON()!String
jsonString.evalJSON([sanitize=false])!Object
夕阳无语dorails.com
高级集合 Enumerable:是一个模块,与ruby中的Enumerable模块类似
核心方法:
each(iterator[,context])!enumerable
iterator的参数为当前值与当前索引,index
$break与return可以取得break与contitute同样的效果
唯一不依赖each的方法是eachSlice()和inGroupsOf()
迭代上下文参数context,对迭代函数进行绑定
items.all(function(item){...},obj),也就是迭代函数里面this指向obj
集合的相关信息查询：
all/every([iterator=Prototype.K])!Boolean迭代函数可选
any/some([iterator=Prototype.K])!Boolean
include/member(value)!Boolean
size()!Number
查找与过滤;
detect/find(iterator)!firstElement|undefined
filter/findAll/select(iterator)!Array|[]
grep(pattern[,iterator=Prototype.K])!Array
partition([iterator=Prototype.K])![trueItems,falseItems]
reject(iterator)!Array
元素分组
eachSlice(size[,iterator=Prototype.K])![slice,...]
inGroupsOf(size[,filler=null])![group,...]
'[1, 2, 3]'.evalJSON()// => [1, 2, 3]
var doudou = '{"first": "andy",
"last": "fly"}'.evalJSON();
doudou.first// => 'andy'
doudou.last// => 'fly'
['one' , 'two' , 'three' ].each(function(s) {alert(s);});
[ 'hello' , 'world' ].each(function(s, index) {
alert(index + ': ' + s);})
var result = [];$R(1,10).each(function(n) {
if (0 == n % 2)return;
if (n > 6)throw $break;
result.push(n);});
// 查询是否全为数字
[1, 2, 3, '4' ].all(
function(item) {
return Object.isNumber(item);
})
// 是否全大于90
[92, 97, 90, 98].all(function(grade)
{ return grade >= 90; })
var nodes =
$('topBar' , 'menuBar' , 'navBar' ,
'footer' );
if (nodes.any())
省略迭代器函数的情况，会采用自身的
true或false去判断.
null, undefined, false, 0, NaN 和空
字符串都会被判断为false
