寫js代碼的時候應該注意的一些的小細節

來源:互聯網
上載者:User

標籤:style   color   get   http   com   html   

在今天將為大家分享一下,在平時我們寫js代碼的時候應該注意的一些的小點。

img1
全域變數
瞭解js的朋友應該知道全域變數就是在任何函數的外面聲明的或是未聲明直接簡單使用的。下面來看一個例子
function fn(){
var a=b=0;
}
或許有好多朋友都覺得這兩個都是局部變數,但這似乎不是你所想的那樣。在這個例子中b是一個全域變數。這是為什麼了?肯定有好多朋友也想不通,這是因為在js中賦值運算子是自右往左的,所以上面這個例子實際上是
function fn(){
var a=(b=0);
}
因此,在平時寫js代碼的應該多加小心你所定義的變數。
變數聲明
在沒說之前,先讓大家來看一個例子
name=”global”
function fn(){
alert(name);
var name=’local’;
alert(name);
}
fn()
當一看到這個例子的時候,有人肯定會一下子想到這結果一定是”global”,”local”,但當你如果一運行這結果會你驚,這鋁合金氣動隔膜泵結果就是”undefined”,”local”。這是因為什麼了?是因為變數在同一範圍(同一函數)中,聲明都是被提至範圍頂部先進行解析的。
函式宣告
函式宣告跟變數聲明也是一樣的也是被提前至範圍頂部,先於任何錶達式和語句被鋁合金氣動隔膜泵解析和求值的。
接下來又給大家舉一例子
function test(){
alert(“1″);
}
test();
function test(){
alert(“2″);
}
test()
這個運行結果不是“1”和“2”,而是兩個“2”,道理很簡單,test()的聲明短先於test()被解析。
函數運算式
先看命名函數運算式,理所當然,就是它得有名字,比如:
var box=function fn(){
}
值得注意的是:函數名只對其函數內部可見,比如:
var box=function fn(){
fn();
};
fn();
盡量少用命名函數運算式,切勿將函數名使用於外部。
函數的自執行
對於函數運算式,可以通過後面加上 () 自執行,而且可在括弧中傳遞參數,而函式宣告不可以。又比如:
function fn(){
alert(x);
}
迴圈中的閉包
var links=document.getElementsByTagName(“ul”)[0].getElementsByTagName(“a”);
for(var i=0;i<links.length;i<1;i++)
{http://www.hainnu.edu.cn/
links[i].onclick=function(e){
e.preventDefault();
alert(“you click link #”+i)
}
}
我們預期當點擊第 i 個連結時,得到此序列索引 i 的值,可實際無論點擊哪個連結,得到的都是 i 在迴圈後的最終結果:”5”。

原因:當 alert 被調用時,for 迴圈內的匿名函數運算式,保持了對外部變數 i的引用(閉包),此時迴圈已結束,i 的值被修改為 “5”。

解決:為了得到想要的結果,需要在每次迴圈中建立變數 i 的拷貝。以下示範正確的做法:
var links=document.getElementsByTagName(“ul”)[0].getElementsByTagName(“a”);
for(var i=0;l=link.length;i<l;i++){
links[i].onclick=(function (index){
return function(e){
e.preventDefault();
alert(“you click link #”+index);
}
})(i);
}

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.