javascript 分號總結(jié)及詳細(xì)介紹
javascript每條語句都是以分號結(jié)束,但由于javascript具有分號自動(dòng)插入規(guī)則,所有不同的編程人員有不同的習(xí)慣,有的加分號,有的不加分號,那么到底加分號好還是不加分號好?本文章向大家探討javascript每條語句該不該加分號。
javascript的分號代表語句的結(jié)束符,但由于javascript具有分號自動(dòng)插入規(guī)則,所以它是一個(gè)十分容易讓人模糊的東西,在一般情況下,一個(gè)換行就會(huì)產(chǎn)生一個(gè)分號,但實(shí)際情況卻不然,也就是說在javascript中換行可能產(chǎn)生分號,也可能不產(chǎn)生,是否自動(dòng)插入分號,主要看上下行。所以即使是經(jīng)驗(yàn)豐富的程序員,有時(shí)候也會(huì)頭大。
JavaScript自動(dòng)加分號規(guī)則:
- 當(dāng)有換行符(包括含有換行符的多行注釋),并且下一個(gè)token沒法跟前面的語法匹配時(shí),會(huì)自動(dòng)補(bǔ)分號。
- 當(dāng)有}時(shí),如果缺少分號,會(huì)補(bǔ)分號。
- 當(dāng)程序源代碼結(jié)束時(shí),如果缺少分號,會(huì)補(bǔ)分號。
接下來我們來分組看不加分號導(dǎo)致的語法歧義:
第一種是++和--兩種運(yùn)算符出現(xiàn)在上一行結(jié)尾的情況,下一行以以下開頭時(shí),會(huì)產(chǎn)生語法歧義:
function delete void typeof new null true false NumericLiteral StringLiteral RegularExpressionLiteral ( [ { Identifier ++ -- + - ~ !
其中,function和delete是非常常用的statement開頭。
特別是 ++和--單獨(dú)被斷為一行的時(shí)候,因?yàn)镴S的語法規(guī)則規(guī)定后自增運(yùn)算不允許中間插入換行,所以++和--會(huì)被視為前自增而跟下一行連接在一起。
第二種是return作為上一行結(jié)尾的情況,下一行以以下開頭時(shí),會(huì)產(chǎn)生語法歧義:
function delete void typeof ( [ { Identifier ++ -- + - ~ !
同樣因?yàn)镴S語法的規(guī)則不允許在return 和后面的值之間插入換行,所以return之后只要有換行符就會(huì)視為有分號,這常常會(huì)與使用者的期望不符合。
第三種是下一行以+和-開頭的情況,上一行以以下結(jié)尾是,會(huì)產(chǎn)生語法歧義:
-- ++ IdentifierName ] ) } RegularExpressionLiteral
因?yàn)楹苌儆姓Z句以+或者-開頭,所以這種情況不算危險(xiǎn)。
第四種是上一行以break、continue結(jié)尾的情況,下一行以Identifier開頭時(shí),會(huì)產(chǎn)生語法歧義。
第五種是下一行以(和[開頭的情況,上一行以以下結(jié)尾是,會(huì)產(chǎn)生語法歧義:
-- ++ IdentifierName ] ) } RegularExpressionLiteral StringLiteral NumericLiteral BooleanLiteral NullLiteral Identifier this
這種情況非常危險(xiǎn)(所以hax的文章中要提出這種情況應(yīng)該語句前寫分號),幾乎上一行的所有情況都將導(dǎo)致正常期望之外的結(jié)果。
第六種是,當(dāng)下一行以RegularExpressionLiteral 開頭的情況,上一行的以下結(jié)尾,會(huì)導(dǎo)致/被理解為除號:
-- ++ IdentifierName ] ) } RegularExpressionLiteral StringLiteral NumericLiteral BooleanLiteral NullLiteral Identifier this
實(shí)踐出真理,看一下下面這些例子,就明白,分號自動(dòng)插入不是那么好讓人捉摸的。稍微不注意就會(huì)讓你頭大。
return引起的血案:
function test(){
var a = 1;
var b = 2;
return //會(huì)自動(dòng)插入分號
(
a+b
)
};
alert(test());
一個(gè)返回a+b值的函數(shù),初看沒任何問題,但運(yùn)行alert的結(jié)果卻是undefined。根據(jù)分號的自動(dòng)插入規(guī)則,return 語句后面如果有換行就會(huì)自動(dòng)插入分號,沒有返回值也就比較好理解了。如果需要換行的話,可以這樣:
function test(){
var a = 1;
var b = 2;
return (
a+b
)
};
alert(test());
兩個(gè)閉包引起的血案:
(function (){
var a;
})() //不會(huì)自動(dòng)插入分號
(function (){
var b;
})()
很詭異,解釋不了,誰能告訴我~
for語句頭中的兩個(gè)分號,不自動(dòng)插入分號
for( var a=1,b=10 //不會(huì)自動(dòng)插入分號
a<b //不會(huì)自動(dòng)插入分號
a++
)
{}
總結(jié)
- 在return、break、continue、后自增、后自減五種語句中,換行符可以完全替代分號的作用。
- var if do while for continue break return with switch throw try debugger幾種關(guān)鍵字開頭的語句,以及空語句,上一行加不加分號影響不大。
- 凡表達(dá)式語句和函數(shù)表達(dá)式語句,后面不加分號非常危險(xiǎn),情況極其復(fù)雜。
- 凡(和[開頭的語句,前面不加分號極度危險(xiǎn)。
以上就是對JavaScript 分號的資料整理,后續(xù)繼續(xù)補(bǔ)充相關(guān)資料,謝謝大家對本站的支持!
- JS正則驗(yàn)證多個(gè)郵箱完整實(shí)例【郵箱用分號隔開】
- 淺談javascript的分號的使用
- JavaScript 自動(dòng)分號插入(JavaScript synat:auto semicolon insertion)
- 關(guān)于JavaScript語句后面的分號問題
- JS 分號引起的一段調(diào)試問題
- js中關(guān)于一個(gè)分號的崩潰示例
- 淺析Javascript的自動(dòng)分號插入(ASI)機(jī)制
- 如何防止JavaScript自動(dòng)插入分號
- JavaScript中的分號插入機(jī)制詳細(xì)介紹
- JavaScript中分號的一些細(xì)節(jié)
相關(guān)文章
JavaScript實(shí)現(xiàn)文本框中默認(rèn)顯示背景圖片在獲得焦點(diǎn)后消失的方法
這篇文章主要介紹了JavaScript實(shí)現(xiàn)文本框中默認(rèn)顯示背景圖片在獲得焦點(diǎn)后消失的方法,涉及javascript針對頁面元素樣式及屬性的相關(guān)操作技巧,需要的朋友可以參考下2015-07-07
javascript獲取網(wǎng)頁中指定節(jié)點(diǎn)的父節(jié)點(diǎn)、子節(jié)點(diǎn)的方法小結(jié)
如何獲取要更新的這些元素呢?用JavaScript獲取這些節(jié)點(diǎn)的方法有很多種,下面是總結(jié)的一些方法,感興趣的朋友可以參考下哈2013-04-04
JS 頁面自動(dòng)加載函數(shù)(兼容多瀏覽器)
兼容多個(gè)瀏覽器的自動(dòng)加載函數(shù)。2009-05-05
JavaScript 實(shí)現(xiàn)日期時(shí)間轉(zhuǎn)時(shí)間戳
這篇文章主要介紹了JavaScript 實(shí)現(xiàn)日期時(shí)間轉(zhuǎn)時(shí)間戳,文章圍繞主題展開詳細(xì)的內(nèi)容介紹,具有一定的參考價(jià)值,需要的小伙伴可以參考一下2022-08-08
ES6中的Promise對象與async和await方法詳解
Promise是es6引入的異步編程薪解決方案,語法上promise就是一個(gè)構(gòu)造函數(shù),用來封裝異步操作病可以獲取其成功或失敗的結(jié)果,這篇文章主要介紹了ES6中的Promise對象與async和await方法,需要的朋友可以參考下2022-12-12
echarts整合多個(gè)類似option的方法實(shí)例
這篇文章主要給大家介紹了關(guān)于echarts整合多個(gè)類似option的相關(guān)資料,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2018-07-07
jquery結(jié)合CSS使用validate實(shí)現(xiàn)漂亮的驗(yàn)證
這篇文章主要介紹了jquery結(jié)合CSS使用validate實(shí)現(xiàn)漂亮的驗(yàn)證,需要的朋友可以參考下2015-01-01
IE view-source 無法查看看源碼 JavaScript看網(wǎng)頁源碼
查看網(wǎng)頁源代碼的方法其實(shí)有好幾種,最常用的我們就是在瀏覽器中直接選擇“查看網(wǎng)頁源代碼”就可以了,但是在有些時(shí)候這種方法卻不能見效,以下再介紹幾種簡單的方法供大家參考!2009-07-07

