prototype.js是什么?
萬一你沒有使用過大名鼎鼎的prototype.js，那么讓我來告訴你，prototype.js是由Sam Stephenson寫的一個(gè)javascript類庫。這個(gè)構(gòu)思奇妙，而且兼容標(biāo)準(zhǔn)的類庫，能幫助你輕松建立有高度互動(dòng)的web2.0特性的富客戶端頁面。
如果你最近嘗試使用它，你大概了解到文檔并不是作者的一個(gè)強(qiáng)項(xiàng)。和在我以前使用這個(gè)類庫的不少開發(fā)者一樣，一開始，我不得不一頭扎進(jìn)閱讀prototype.js的源代碼和實(shí)驗(yàn)它的功能中。我想，在我學(xué)習(xí)完它之后，把我學(xué)到的東西分享給大家是件不錯(cuò)的事。
同時(shí)，在本文中，我也將提供一個(gè)關(guān)于這個(gè)類庫提供的objects,classes,functions,extensions這對(duì)東東的非官方參考
在閱讀這個(gè)文檔時(shí)，熟悉Ruby的開發(fā)者將會(huì)注意到Ruby的一些內(nèi)建類和本類庫擴(kuò)展實(shí)現(xiàn)之間非常相似。
相關(guān)文章
Advanced JavaScript guide.
一些實(shí)用的函數(shù)
這個(gè)類庫帶有很多預(yù)定義的對(duì)象和實(shí)用函數(shù)，這些東東的目的顯然是把你從一些重復(fù)的打字中解放出來 。
使用$()方法
$() 方法是在DOM中使用過于頻繁的 document.getElementById() 方法的一個(gè)便利的簡寫，就像這個(gè)DOM方法一樣，這個(gè)方法返回參數(shù)傳入的id的那個(gè)元素。
比起DOM中的方法，這個(gè)更勝一籌。你可以傳入多個(gè)id作為參數(shù)然后 $() 返回一個(gè)帶有所有要求的元素的一個(gè) Array 對(duì)象。
<HTML>
<HEAD>
<TITLE> Test Page </TITLE>
<script src="prototype-1.3.1.js"></script>
<script>
function test1()
{
var d = $('myDiv');
alert(d.innerHTML);
}
function test2()
{
var divs = $('myDiv','myOtherDiv');
for(i=0; i<divs.length; i++)
{
alert(divs[i].innerHTML);
}
}
</script>
</HEAD>
<BODY>
<div id="myDiv">
<p>This is a paragraph</p>
</div>
<div id="myOtherDiv">
<p>This is another paragraph</p>
</div>
<input type="button" value=Test1 onclick="test1();"><br>
<input type="button" value=Test2 onclick="test2();"><br>
</BODY>
</HTML>
另外一個(gè)好處是，這個(gè)函數(shù)能傳入用string表示的對(duì)象ID，也可以傳入對(duì)象本身，這樣，在建立其它能傳兩種類型的參數(shù)的函數(shù)時(shí)非常有用。
使用$F()函數(shù)
$F()函數(shù)是另一個(gè)大收歡迎的“快捷鍵”，它能用于返回任何表單輸入控件的值，比如text box,drop-down list。這個(gè)方法也能用元素id或元素本身做為參數(shù)。
<script>
function test3()
{
alert( $F('userName') );
}
</script>
<input type="text" id="userName" value="Joe Doe"><br>
<input type="button" value=Test3 onclick="test3();"><br>
使用$A()函數(shù)
$A()函數(shù)能把它接收到的單個(gè)的參數(shù)轉(zhuǎn)換成一個(gè)Array對(duì)象。
這個(gè)方法，結(jié)合被本類庫擴(kuò)展了的Array類，能方便的把任何的可枚舉列表轉(zhuǎn)換成或拷貝到一個(gè)Array對(duì)象。一個(gè)推薦的用法就是把DOM Node Lists轉(zhuǎn)換成一個(gè)普通的Array對(duì)象，從而更有效率的進(jìn)行遍歷，請(qǐng)看下面的例子。
<script>
function showOptions(){
var someNodeList = $('lstEmployees').getElementsByTagName('option');
var nodes = $A(someNodeList);
nodes.each(function(node){
alert(node.nodeName + ': ' + node.innerHTML);
});
}
</script>
<select id="lstEmployees" size="10" >
<option value="5">Buchanan, Steven</option>
<option value="8">Callahan, Laura</option>
<option value="1">Davolio, Nancy</option>
</select>
<input type="button" value="Show the options" onclick="showOptions();" >
使用?$H() 函數(shù)
$H()函數(shù)把一些對(duì)象轉(zhuǎn)換成一個(gè)可枚舉的和聯(lián)合數(shù)組類似的Hash對(duì)象。
<script>
function testHash()
{
//let's create the object
var a = {
first: 10,
second: 20,
third: 30
};
//now transform it into a hash
var h = $H(a);
alert(h.toQueryString()); //displays: first=10&second=20&third=30
}
</script>
使用$R()函數(shù)
$R()是new ObjectRange(lowBound,upperBound,excludeBounds)的縮寫。
跳到ObjectRange 類文檔可以看到一個(gè)關(guān)于此類的完整描述. 此時(shí)，我們還是先來看一個(gè)例子以展示這個(gè)縮寫能代替哪些方法吧。其它相關(guān)的一些知識(shí)可以在Enumerable 對(duì)象文檔中找到。
<script>
function demoDollar_R(){
var range = $R(10, 20, false);
range.each(function(value, index){
alert(value);
});
}
</script>
<input type="button" value="Sample Count" onclick="demoDollar_R();" >
使用Try.these()函數(shù)
Try.these() 方法使得實(shí)現(xiàn)當(dāng)你想調(diào)用不同的方法直到其中的一個(gè)成功正常的這種需求變得非常容易， 他把一系列的方法作為參數(shù)并且按順序的一個(gè)一個(gè)的執(zhí)行這些方法直到其中的一個(gè)成功執(zhí)行，返回成功執(zhí)行的那個(gè)方法的返回值。
在下面的例子中， xmlNode.text在一些瀏覽器中好用，但是xmlNode.textContent在另一些瀏覽器中正常工作。 使用Try.these()方法我們可以得到正常工作的那個(gè)方法的返回值。
<script>
function getXmlNodeValue(xmlNode){
??? return Try.these(
??????? function() {return xmlNode.text;},
??????? function() {return xmlNode.textContent;)
??????? );
}
</script>
??
Ajax對(duì)象
上面提到的共通方法非常好，但是面對(duì)它吧，它們不是最高級(jí)的那類東西。它們是嗎？你很可能自己編寫了這些甚至在你的腳本里面有類似功能的方法。但是這些方法只是冰山一角。
我很肯定你對(duì)prototype.js感興趣的原因很可能是由于它的AJAX能力。所以讓我們解釋當(dāng)你需要完成AJAX邏輯的時(shí)候，這個(gè)包如何讓它更容易。
Ajax 對(duì)象是一個(gè)預(yù)定義對(duì)象，由這個(gè)包創(chuàng)建，為了封裝和簡化編寫AJAX 功能涉及的狡猾的代碼。 這個(gè)對(duì)象包含一系列的封裝AJAX邏輯的類。我們來看看其中幾個(gè)類。
使用Ajax.Request類
如果你不使用任何的幫助程序包，你很可能編寫了整個(gè)大量的代碼來創(chuàng)建XMLHttpRequest對(duì)象并且異步的跟蹤它的進(jìn)程， 然后解析出響應(yīng) 然后處理它。當(dāng)你不需要支持多于一種類型的瀏覽器時(shí)你會(huì)感到非常的幸運(yùn)。
為了支持 AJAX 功能。這個(gè)包定義了 Ajax.Request 類。
假如你有一個(gè)應(yīng)用程序可以通過url http://yoursever/app/get_sales?empID=1234&year=1998與服務(wù)器通信。它返回下面這樣的XML 響應(yīng)。
<?xml version="1.0" encoding="utf-8" ?>
<ajax-response>
<response type="object" id="productDetails">
<monthly-sales>
<employee-sales>
<employee-id>1234</employee-id>
<year-month>1998-01</year-month>
<sales>$8,115.36</sales>
</employee-sales>
<employee-sales>
<employee-id>1234</employee-id>
<year-month>1998-02</year-month>
<sales>$11,147.51</sales>
</employee-sales>
</monthly-sales>
</response>
</ajax-response>
用 Ajax.Request對(duì)象和服務(wù)器通信并且得到這段XML是非常簡單的。下面的例子演示了它是如何完成的。
<script>
function searchSales()
{
var empID = $F('lstEmployees');
var y = $F('lstYears');
var url = 'http://yoursever/app/get_sales';
var pars = 'empID=' + empID + '&year=' + y;
var myAjax = new Ajax.Request(
url,
{
method: 'get',
parameters: pars,
onComplete: showResponse
});
}
function showResponse(originalRequest)
{
//put returned XML in the textarea
$('result').value = originalRequest.responseText;
}
</script>
<select id="lstEmployees" size="10" onchange="searchSales()">
<option value="5">Buchanan, Steven</option>
<option value="8">Callahan, Laura</option>
<option value="1">Davolio, Nancy</option>
</select>
<select id="lstYears" size="3" onchange="searchSales()">
<option selected="selected" value="1996">1996</option>
<option value="1997">1997</option>
<option value="1998">1998</option>
</select>
<br><textarea id=result cols=60 rows=10 ></textarea>
你注意到傳入 Ajax.Request構(gòu)造方法的第二個(gè)對(duì)象了嗎？ 參數(shù){method: 'get', parameters: pars, onComplete: showResponse} 表示一個(gè)匿名對(duì)象的真實(shí)寫法。他表示你傳入的這個(gè)對(duì)象有一個(gè)名為 method 值為 'get'的屬性，另一個(gè)屬性名為 parameters 包含HTTP請(qǐng)求的查詢字符串，和一個(gè)onComplete 屬性/方法包含函數(shù)showResponse。
還有一些其它的屬性可以在這個(gè)對(duì)象里面定義和設(shè)置，如 asynchronous，可以為true 或 false 來決定AJAX對(duì)服務(wù)器的調(diào)用是否是異步的（默認(rèn)值是 true）。
這個(gè)參數(shù)定義AJAX調(diào)用的選項(xiàng)。在我們的例子中，在第一個(gè)參數(shù)通過HTTP GET命令請(qǐng)求那個(gè)url，傳入了變量 pars包含的查詢字符串， Ajax.Request 對(duì)象在它完成接收響應(yīng)的時(shí)候?qū)⒄{(diào)用showResponse 方法。
也許你知道， XMLHttpRequest在HTTP請(qǐng)求期間將報(bào)告進(jìn)度情況。這個(gè)進(jìn)度被描述為四個(gè)不同階段：Loading, Loaded, Interactive, 或 Complete。你可以使 Ajax.Request 對(duì)象在任何階段調(diào)用自定義方法 ，Complete 是最常用的一個(gè)。想調(diào)用自定義的方法只需要簡單的在請(qǐng)求的選項(xiàng)參數(shù)中的名為 onXXXXX 屬性/方法中提供自定義的方法對(duì)象。 就像我們例子中的 onComplete 。你傳入的方法將會(huì)被用一個(gè)參數(shù)調(diào)用，這個(gè)參數(shù)是 XMLHttpRequest 對(duì)象自己。你將會(huì)用這個(gè)對(duì)象去得到返回的數(shù)據(jù)并且或許檢查包含有在這次調(diào)用中的HTTP結(jié)果代碼的 status 屬性。
還有另外兩個(gè)有用的選項(xiàng)用來處理結(jié)果。我們可以在onSuccess 選項(xiàng)處傳入一個(gè)方法，當(dāng)AJAX無誤的執(zhí)行完后調(diào)用， 相反的，也可以在onFailure選項(xiàng)處傳入一個(gè)方法，當(dāng)服務(wù)器端出現(xiàn)錯(cuò)誤時(shí)調(diào)用。正如onXXXXX 選項(xiàng)傳入的方法一樣，這兩個(gè)在被調(diào)用的時(shí)候也傳入一個(gè)帶有AJAX請(qǐng)求的XMLHttpRequest對(duì)象。
我們的例子沒有用任何有趣的方式處理這個(gè) XML響應(yīng)， 我們只是把這段XML放進(jìn)了一個(gè)文本域里面。對(duì)這個(gè)響應(yīng)的一個(gè)典型的應(yīng)用很可能就是找到其中的想要的信息，然后更新頁面中的某些元素， 或者甚至可能做某些XSLT轉(zhuǎn)換而在頁面中產(chǎn)生一些HTML。
?在1.4.0版本中，一種新的事件回傳外理被引入。如果你有一段代碼總是要為一個(gè)特殊的事件執(zhí)行，而不管是哪個(gè)AJAX調(diào)用引發(fā)它，那么你可以使用新的Ajax.Responders對(duì)象。
假設(shè)你想要在一個(gè)AJAX調(diào)用正在運(yùn)行時(shí)，顯示一些提示效果，像一個(gè)不斷轉(zhuǎn)動(dòng)的圖標(biāo)之類的，你可以使用兩個(gè)全局事件Handler來做到，其中一個(gè)在第一個(gè)調(diào)用開始時(shí)顯示圖標(biāo)，另一個(gè)在最后一個(gè)調(diào)用完成時(shí)隱藏圖標(biāo)。看下面的例子。
<script>
var myGlobalHandlers = {
onCreate: function(){
Element.show('systemWorking');
},
onComplete: function() {
if(Ajax.activeRequestCount == 0){
Element.hide('systemWorking');
}
}
};
Ajax.Responders.register(myGlobalHandlers);
</script>
<div id='systemWorking'><img src='spinner.gif'>Loading...</div>
更完全的解釋，請(qǐng)參照 Ajax.Request 參考 和 Ajax選項(xiàng)參考。
使用Ajax.Updater類
如果你的服務(wù)器的另一端返回的信息已經(jīng)是HTML了，那么使用這個(gè)程序包中 Ajax.Updater 類將使你的生活變得更加得容易。用它你只需提供哪一個(gè)元素需要被AJAX請(qǐng)求返回的HTML填充就可以了，例子比我寫說明的更清楚。?
<script>
function getHTML()
{
var url = 'http://yourserver/app/getSomeHTML';
var pars = 'someParameter=ABC';
var myAjax = new Ajax.Updater(
'placeholder',
url,
{
method: 'get',
parameters: pars
});
}
</script>
<input type=button value=GetHtml onclick="getHTML()">
<div id="placeholder"></div>
你可以看到，這段代碼比前面的例子更加簡潔，不包括 onComplete 方法，但是在構(gòu)造方法中傳入了一個(gè)元素id。 我們來稍稍修改一下代碼來描述如何在客戶端處理服務(wù)器段錯(cuò)誤成為可能。
我們將加入更多的選項(xiàng)， 指定處理錯(cuò)誤的一個(gè)方法。這個(gè)是用 onFailure 選項(xiàng)來完成的。我們也指定了一個(gè) placeholder 只有在成功請(qǐng)求之后才會(huì)被填充。為了完成這個(gè)目的我們修改了第一個(gè)參數(shù)從一個(gè)簡單的元素id到一個(gè)帶有兩個(gè)屬性的對(duì)象， success (一切OK的時(shí)候被用到) 和 failure (有地方出問題的時(shí)候被用到) 在下面的例子中沒有用到failure屬性，而僅僅在 onFailure 處使用了 reportError 方法。
<script>
function getHTML()
{
var url = 'http://yourserver/app/getSomeHTML';
var pars = 'someParameter=ABC';
var myAjax = new Ajax.Updater(
{success: 'placeholder'},
url,
{
method: 'get',
parameters: pars,
onFailure: reportError
});
}
function reportError(request)
{
alert('Sorry. There was an error.');
}
</script>
<input type=button value=GetHtml onclick="getHTML()">
<div id="placeholder"></div>
如果你的服務(wù)器邏輯是連同HTML 標(biāo)記返回JavaScript 代碼， Ajax.Updater對(duì)象可以執(zhí)行那段JavaScript代碼。為了使這個(gè)對(duì)象對(duì)待響應(yīng)為JavaScript，你只需在最后參數(shù)的對(duì)象構(gòu)造方法中簡單加入evalScripts: true屬性。但是值得提醒的是，像這個(gè)選項(xiàng)名evalScripts暗示的，這些腳本會(huì)被執(zhí)行，但是它們不會(huì)被加入到Page的腳本中。“有什么區(qū)別？”，可能你會(huì)這樣問。我們假定請(qǐng)求地址返回的東東像這樣：
<script language="javascript" type="text/javascript">
function sayHi(){
alert('Hi');
}
</script>
<input type=button value="Click Me" onclick="sayHi()">
如果你以前這樣嘗試過，你知道這些腳本不會(huì)如你所期望的那樣工作，原因是這段腳本會(huì)被執(zhí)行，但像上面這樣的腳本執(zhí)行并不會(huì)創(chuàng)建一個(gè)名叫sayHi的函數(shù)，它什么也不做。如果要?jiǎng)?chuàng)建一個(gè)函數(shù)，我們應(yīng)當(dāng)把代碼改成下面這個(gè)樣子：
<script language="javascript" type="text/javascript">
sayHi = function(){
alert('Hi');
};
</script>
<input type=button value="Click Me" onclick="sayHi()">
為什么我們?cè)谏厦娴拇a中不使用var關(guān)鍵字來聲明這個(gè)變量呢（指sayHi?），因?yàn)槟菢幼鰟?chuàng)建出來的函數(shù)將只是當(dāng)前腳本塊的一個(gè)局部變量（至少在IE中是這樣）。不寫var關(guān)鍵字，創(chuàng)建出來的對(duì)象的作用域就是我們所期望的window。
更多相關(guān)知識(shí)，請(qǐng)參看? Ajax.Updater reference 和options reference.
枚舉... 噢!噢!
你知道，我們都是這樣來做循環(huán)的，建一個(gè)Array，用elements組織它們，再建一個(gè)循環(huán)結(jié)構(gòu)（例如for,foreach,while)通過index數(shù)字來訪問每一個(gè)element，再用這個(gè)element做一些動(dòng)作。
當(dāng)你想到這時(shí)，你會(huì)發(fā)現(xiàn)幾乎每次寫循環(huán)代碼你都會(huì)遲早用到一個(gè)Array。那么，如果Array對(duì)象能夠提供更多的功能給它們的迭代器使用不是很爽嗎？確實(shí)是這樣，事實(shí)上很多的編程語言都在它們的Array或其它類似的結(jié)構(gòu)中（如Collections,Lists）提供一些這樣的功能。
現(xiàn)在好了，prototype.js了給我們一個(gè) Enumerable對(duì)象，它實(shí)現(xiàn)了很多和可迭代數(shù)據(jù)進(jìn)行交互的竅門。和原有的JS對(duì)象相比prototype.js更上一層樓，它對(duì)Array 類s擴(kuò)展了所有枚舉要用的函數(shù)。
循環(huán), Ruby樣式的
在標(biāo)準(zhǔn)的javascript中，如果你想把一個(gè)array中的所有elements顯示出來，你可以像下面代碼這樣寫得很好：
<script>
function showList(){
var simpsons = ['Homer', 'Marge', 'Lisa', 'Bart', 'Meg'];
for(i=0;i<simpsons.length;i++){
alert(simpsons[i]);
}
}
</script>
<input type="button" value="Show List" onclick="showList();" >
使用我們新的最好的朋友，prototype.js，我們可以把它生寫成這樣
function showList(){
var simpsons = ['Homer', 'Marge', 'Lisa', 'Bart', 'Meg'];
simpsons.each( function(familyMember){
alert(familyMember);
});
}
你可能會(huì)想“非常奇怪的方式...相對(duì)舊的，這種語法太怪異了”。哦，在上面的例子，確實(shí)什么也沒有，在這個(gè)簡單得要死例子中，也沒有改變太多啊，盡管如此，請(qǐng)繼續(xù)讀下去。
在繼續(xù)下面內(nèi)容之前，你注意到那個(gè)被做為一個(gè)參數(shù)傳遞給each函數(shù)的函數(shù)？我們把它理解成迭代器函數(shù)。
Your arrays on steroids
就如我們上面提到的，把你的Array中的elements當(dāng)成相同的類型使用相同的屬性和函數(shù)是很通用(Common,不知該翻譯成通用還是庸俗)的。讓我們看看怎么樣利用我們新的馬力強(qiáng)勁的Arrays的迭代功能吧。
依照標(biāo)準(zhǔn)找到一個(gè)element。
<script>
function findEmployeeById(emp_id){
var listBox = $('lstEmployees')
var options = listBox.getElementsByTagName('option');
options = $A(options);
var opt = options.find( function(employee){
return (employee.value == emp_id);
});
alert(opt.innerHTML); //displays the employee name
}
</script>
<select id="lstEmployees" size="10" >
<option value="5">Buchanan, Steven</option>
<option value="8">Callahan, Laura</option>
<option value="1">Davolio, Nancy</option>
</select>
<input type="button" value="Find Laura" onclick="findEmployeeById(8);" >
現(xiàn)在我們?cè)傧乱怀牵纯慈绾芜^濾一個(gè)Array中的元素，從每個(gè)元素中得到我們想要的成員。
<script>
function showLocalLinks(paragraph){
paragraph = $(paragraph);
var links = $A(paragraph.getElementsByTagName('a'));
//find links that do not start with 'http'
var localLinks = links.findAll( function(link){
var start = link.href.substring(0,4);
return start !='http';
});
//now the link texts
var texts = localLinks.pluck('innerHTML');
//get them in a single string
var result = texts.inspect();
alert(result);
}
</script>
<p id="someText">
This <a >text</a> has
a <a href="#localAnchor">lot</a> of
<a href="#otherAnchor">links</a>. Some are
<a >external</a>
and some are <a href="#someAnchor">local</a>
</p>
<input type=button value="Find Local Links" onclick="showLocalLinks('someText')">
上面的代碼僅僅是一點(diǎn)小小的實(shí)踐讓人愛上這種語法。請(qǐng)參看 Enumerable和Array的所有函數(shù)
?
prototype.js參考
JavaScript類擴(kuò)展
prototype.js 類庫實(shí)現(xiàn)強(qiáng)大功能的一種途徑是擴(kuò)展已有的JavaScript 類。
對(duì) Object的擴(kuò)展
| Method |
Kind |
Arguments |
Description |
| extend(destination, source) |
static
|
destination: any object, source: any object |
提供一種通過拷貝所有源以象屬性和函數(shù)到目標(biāo)函數(shù)實(shí)現(xiàn)繼承的方法 |
| inspect(targetObj) |
static |
targetObj: any object |
返回可讀性好關(guān)于目標(biāo)對(duì)象的文字描述，如果對(duì)象實(shí)例沒有定義一個(gè)inspect函數(shù)，默認(rèn)返回toString函數(shù)的值。 |
對(duì)Number的擴(kuò)展
| Method |
Kind
|
Arguments |
Description |
| toColorPart() |
instance
|
(none) |
返回?cái)?shù)字的十六進(jìn)制表示形式。在把一個(gè)RGB數(shù)字轉(zhuǎn)換成HTML表現(xiàn)形式時(shí)很有用。 |
| succ() |
instance |
(none) |
?返回下一個(gè)數(shù)字，這個(gè)方法可用于迭代調(diào)用場景中。 |
| times(iterator) |
instance |
iterator: a function object conforming to Function(index) |
Calls the iterator function repeatedly passing the current index in the index argument. 反復(fù)調(diào)用iterator函數(shù)并傳遞當(dāng)前index到iterator的index參數(shù)。 |
下面的例子用提示框顯示0-9。
<script>
function demoTimes(){
var n = 10;
n.times(function(index){
alert(index);
});
/***************************
* you could have also used:
* (10).times( .... );
***************************/
}
</script>
<input type=button value="Test Number.times()" onclick="demoTimes()">
對(duì) Function擴(kuò)展
| Method |
Kind |
Arguments |
Description |
| bind(object) |
instance
|
object: the object that owns the method |
返回function的實(shí)例，這個(gè)實(shí)例和源function的結(jié)構(gòu)一樣，但是它已被綁定給了參數(shù)中提供的object，就是說，function中的this指針指向參數(shù)object。 |
| bindAsEventListener(object) |
instance |
object: the object that owns the method |
用法和上面的bind一樣，區(qū)別在于用來綁定事件。 |
讓我們看看如何運(yùn)用這些擴(kuò)展。
<input type=checkbox id=myChk value=1> Test?
<script>
//declaring the class
var CheckboxWatcher = Class.create();
//defining the rest of the class implementation
CheckboxWatcher.prototype = {
initialize: function(chkBox, message) {
this.chkBox = $(chkBox);
this.message = message;
//assigning our method to the event
this.chkBox.onclick =
this.showMessage.bindAsEventListener(this);
},
showMessage: function(evt) {
alert(this.message + ' (' + evt.type + ')');
}
};
var watcher = new CheckboxWatcher('myChk', 'Changed');
</script>
對(duì)String的擴(kuò)展
| Method |
Kind |
Arguments |
Description |
| stripTags() |
instance |
(none) |
返回一個(gè)把所有的HTML或XML標(biāo)記都移除的字符串。 |
| stripScripts() |
instance
|
(none) |
返回一個(gè)把所有的script都移除的字符串。 |
| escapeHTML() |
instance |
(none) |
返回一個(gè)把所有的HTML標(biāo)記合適的轉(zhuǎn)義掉的字符串。 |
| unescapeHTML() |
instance |
(none) |
escapeHTML()的反轉(zhuǎn)。
|
| extractScripts() |
instance |
(none) |
返回一個(gè)包含在string中找到的所有<script>的數(shù)組。 |
| evalScripts() |
instance |
(none) |
執(zhí)行在string中找到的所有<script>。 |
| toQueryParams() |
instance |
(none) |
把querystring分割才一個(gè)用parameter name做index的聯(lián)合Array，更像一個(gè)hash。 |
| parseQuery() |
instance |
(none) |
和toQueryParams()一樣. |
| toArray() |
instance |
(none) |
把字符串轉(zhuǎn)換成字符數(shù)組. |
| camelize() |
instance |
(none) |
轉(zhuǎn)換一個(gè)以連字符連接的字符串成一個(gè)駱駝法樣式的字符串。比如，這個(gè)函數(shù)在寫代碼時(shí)，把它做為一個(gè)樣式工具使用是很有用的。 |
對(duì)? Array的擴(kuò)展
因?yàn)閍rray擴(kuò)展于enumerable，所以所有enumberable對(duì)象的函數(shù)，array都是可以使用的，除此之外，下面的這些也是已經(jīng)實(shí)現(xiàn)了的。
| Method |
Kind |
Arguments |
Description |
| clear() |
instance
|
(none) |
清空。 |
| compact() |
instance |
(none) |
返回一個(gè)不包括源array中null或undefined元素的array,此方法不改變?cè)碼rray。 |
| first() |
instance |
(none) |
返回array的第一個(gè)對(duì)象。 |
| flatten() |
instance |
(none) |
通過遞歸組合array每個(gè)元素的子元素（如果該元素也是array)來返回一個(gè)“扁平的”一維的array。 |
| indexOf(value) |
instance |
value: what you are looking for. |