JavaScript編程開發(fā)中的五個實(shí)用小技巧
更新時間:2010年07月22日 00:58:01 作者:
下面的5點(diǎn)說明確實(shí)不錯,提高性能與可讀性,大家可以根據(jù)需要選擇使用。
真是五個很quick的小提示:
只在<form>元素上使用submit事件
如果要在form中綁定事件處理程序時,應(yīng)該只在<form>元素上綁定submit事件,而不是給提交按鈕綁定click事件。
March:這個方式固然很好,但是,公司開發(fā)時使用了Web Flow,一個頁面就一個大form,而里面可能有若干個提交按鈕,所以不得不把部分事件處理程序綁定在了提交按鈕的click事件上。
可點(diǎn)擊的都應(yīng)該是鏈接
不要給除錨元素(<a>)以外的元素綁定click事件。這一點(diǎn)對于鍵盤用戶很重要,因?yàn)樗麄冊趦H通過鍵盤獲取元素焦點(diǎn)時會遇到困難。
March:不過個人感覺錨元素還是應(yīng)該只用作鏈接,而一些功能性的操作(比如Google Reader的Mark all as new),最好還是用<span>來標(biāo)注,accessibility的問題可以通過快捷鍵等方式解決。這樣做可以更好的還原HTML元素的語義。
簡單的for循環(huán)優(yōu)化
在你寫一個for循環(huán)時,有個很簡單的技巧能夠提高性能。
使用下面的語句代替上面的:
這樣可以把元素的個數(shù)(elements.length的值)儲存在一個變量j中,這樣就不必在每次循環(huán)時都計(jì)算一遍元素的個數(shù)。
用匿名函數(shù)來作為事件處理程序
尤其是對于短小的函數(shù),創(chuàng)建一個匿名函數(shù)會比使用一個命名函數(shù)的引用更具可讀性。
March:在較復(fù)雜的JavaScript開發(fā)時還是使用命名函數(shù)效率更高。
使用Array.join代替字符串連接(concatenating strings)
在將很多字符串、變量等連接成一個很長的字符串時,將所有字符串和變量放入一個數(shù)組,然后用join方法將他們組成一個長字符串,這樣無論從代碼可讀性還是從性能上都更勝于字符串連接。
var text = 'There are' + elements.length + 'members in the elements array.';
var text = ['There are', elements.length, 'members in the elements array.'].join(' ');
只在<form>元素上使用submit事件
如果要在form中綁定事件處理程序時,應(yīng)該只在<form>元素上綁定submit事件,而不是給提交按鈕綁定click事件。
March:這個方式固然很好,但是,公司開發(fā)時使用了Web Flow,一個頁面就一個大form,而里面可能有若干個提交按鈕,所以不得不把部分事件處理程序綁定在了提交按鈕的click事件上。
可點(diǎn)擊的都應(yīng)該是鏈接
不要給除錨元素(<a>)以外的元素綁定click事件。這一點(diǎn)對于鍵盤用戶很重要,因?yàn)樗麄冊趦H通過鍵盤獲取元素焦點(diǎn)時會遇到困難。
March:不過個人感覺錨元素還是應(yīng)該只用作鏈接,而一些功能性的操作(比如Google Reader的Mark all as new),最好還是用<span>來標(biāo)注,accessibility的問題可以通過快捷鍵等方式解決。這樣做可以更好的還原HTML元素的語義。
簡單的for循環(huán)優(yōu)化
在你寫一個for循環(huán)時,有個很簡單的技巧能夠提高性能。
復(fù)制代碼 代碼如下:
for ( var i = 0; i < elements.length; ++i )
使用下面的語句代替上面的:
復(fù)制代碼 代碼如下:
for ( var i = 0, j = elements.length; i < j; ++i )
這樣可以把元素的個數(shù)(elements.length的值)儲存在一個變量j中,這樣就不必在每次循環(huán)時都計(jì)算一遍元素的個數(shù)。
用匿名函數(shù)來作為事件處理程序
尤其是對于短小的函數(shù),創(chuàng)建一個匿名函數(shù)會比使用一個命名函數(shù)的引用更具可讀性。
復(fù)制代碼 代碼如下:
anchor.onclick = function() { map.goToPosition( home ); return false; }
March:在較復(fù)雜的JavaScript開發(fā)時還是使用命名函數(shù)效率更高。
使用Array.join代替字符串連接(concatenating strings)
在將很多字符串、變量等連接成一個很長的字符串時,將所有字符串和變量放入一個數(shù)組,然后用join方法將他們組成一個長字符串,這樣無論從代碼可讀性還是從性能上都更勝于字符串連接。
復(fù)制代碼 代碼如下:
var text = 'There are' + elements.length + 'members in the elements array.';
var text = ['There are', elements.length, 'members in the elements array.'].join(' ');
相關(guān)文章
js統(tǒng)計(jì)頁面的來訪次數(shù)實(shí)現(xiàn)代碼
這篇文章主要介紹了如何使用js統(tǒng)計(jì)頁面的來訪次數(shù),需要的朋友可以參考下2014-05-05
JavaScript使用concat連接數(shù)組的方法
這篇文章主要介紹了JavaScript使用concat連接數(shù)組的方法,實(shí)例分析了javascript中concat函數(shù)操作數(shù)組的技巧,需要的朋友可以參考下2015-04-04
JavaScript對JSON數(shù)據(jù)進(jìn)行排序和搜索
今天教給大家如何使用數(shù)組的方法來實(shí)現(xiàn)JSON數(shù)據(jù)進(jìn)行排序和搜索功能,具體實(shí)例代碼大家參考下本文吧2017-07-07
javascript 實(shí)現(xiàn)滾動效果代碼整理
javascript 實(shí)現(xiàn)滾動效果代碼整理,需要的朋友可以參考下。2010-03-03

