您好,登錄后才能下訂單哦!
JavaScript 中分號劃分了社區。有些人無論如何都喜歡使用分號。其他人喜歡不加分號。
在使用分號多年之后,2017 年秋,我決定嘗試根據需要不加分號,并且設置 Prettier 自動移除我代碼中的分號,除非是必要的代碼結構需要它們。
現在我發現,不使用分號非常自然,我認為這樣的代碼看起來更好,它們更簡潔易讀。
這完全可能的,因為 JavaScript 并不嚴格要求分號。當某個地方需要分號時,它會在后臺添加它。
這個過程就叫做 自動插入分號.
重要的是了解使用分號的規則,這樣可以避免編寫會產生 bug 的代碼,因為它們的行為與您期望的不同。
JavaScript 自動添加分號的規則
JavaScript 解釋器在解釋源碼時發現以下特殊情況,會自動添加分號:
當下一行代碼開頭中斷當前行代碼時(代碼可以多行編寫)
當下一行以 } 開頭,關閉當前塊
當到達源碼的結尾時
當 return 聲明在當前行
當 break 聲明在當前行
當 throw 聲明在當前行
當 continue 聲明在當前行
與你的想法不同的代碼示例
于這些規則,這里有一些例子。
看例子:
const hey = 'hey' const you = 'hey' const heyYou = hey + ' ' + you ['h', 'e', 'y'].forEach((letter) => console.log(letter))
你會得到錯誤 Uncaught TypeError: Cannot read property 'forEach' of undefined,因為基于規則 1,JavaScript 會嘗試將代碼解釋為
const hey = 'hey'; const you = 'hey'; const heyYou = hey + ' ' + you['h', 'e', 'y'].forEach((letter) => console.log(letter))
這段代碼:
(1 + 2).toString()
打印為 "3".
const a = 1 const b = 2 const c = a + b (a + b).toString()
而是引發 TypeError: b is not a function 異常,因為 JavaScript 嘗試將其解釋為
const a = 1 const b = 2 const c = a + b(a + b).toString()
另一個基于規則 4 的例子:
(() => { return { color: 'white' } })()
你希望此立即調用的函數的返回值是一個包含 color 屬性的對象,但事實并非如此。相反,它是 undefined,因為 JavaScript 在 return 之后插入分號。
相反,你應該將左括號放到 return 后面:
(() => { return { color: 'white' } })()
你認為這段代碼會展示 '0':
1 + 1 -1 + 1 === 0 ? alert(0) : alert(2)
相反它會展示 2,因為 JavaScript 根據規則 1 會解釋為:
1 + 1 -1 + 1 === 0 ? alert(0) : alert(2)
結束語
當心。有些人對分號很有意見。我倒不是很在意,這個工具提供給我們一個不使用它的選擇,所以我們可以避免使用分號。
我不是在建議什么,只是讓你自己做決定。
我們只需要注意一點,即使大多數情況下這些基本場景從未出現在您的代碼中。
摘選一些規則,如下:
小心使用 return 語句。如果您返回某個內容,請將其添加到與返回內容相同的行中(類似還有 break、throw、continue)
永遠不要使用括號開始一行,這些可能與前一行連接起來,形成函數調用或數組元素引用
最后,始終測試您的代碼,以確保它能滿足您的需要。
以上就是JS 代碼要不要加分號?的詳細內容,更多請關注億速云其它相關文章!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。