這篇文章主要介紹了JavaScript代碼加不加分號的區(qū)別是什么，具有一定借鑒價(jià)值，感興趣的朋友可以參考下，希望大家閱讀完這篇文章之后大有收獲，下面讓小編帶著大家一起了解一下。

我們提供的服務(wù)有：網(wǎng)站建設(shè)、成都網(wǎng)站設(shè)計(jì)、微信公眾號開發(fā)、網(wǎng)站優(yōu)化、網(wǎng)站認(rèn)證、麗江ssl等。為千余家企事業(yè)單位解決了網(wǎng)站和推廣的問題。提供周到的售前咨詢和貼心的售后服務(wù)，是有科學(xué)管理、有技術(shù)的麗江網(wǎng)站制作公司

這個(gè)問題在很多文章中都討論過，在 ESlint 規(guī)范中也因?yàn)榧硬患臃痔柖譃閮纱箨嚑I，到于加不加分號，關(guān)鍵是需要了解分號對于 JavaScript 的影響，開始之前可以先看看下面這道面試題：

請問這段代碼是否能夠正常運(yùn)行？

var a = 1
(function() {
  console.log(2)
})()

。

。

。

。

如果運(yùn)行這段代碼，會(huì)出現(xiàn)下面的錯(cuò)誤：

Uncaught TypeError: 1 is not a function

什么鬼！1 is not a function ？我們沒有打算運(yùn)行數(shù)字 1，為什么說數(shù)字 1 不是函數(shù)，這種錯(cuò)誤是很難找到原因的，經(jīng)常會(huì)在出問題的代碼行上打轉(zhuǎn)。這個(gè)錯(cuò)誤必然是上嗎的代碼在運(yùn)行時(shí)被看作是同一行，其概念如下：

var a = 1(function() { /* */ })()

因此立即函數(shù)的 () 被附加在 1 上，這是一個(gè)調(diào)用函數(shù)的語法，所以會(huì)產(chǎn)生 1 is not a function 的錯(cuò)誤，想要避免這個(gè)錯(cuò)誤就需要使用分號：

var a = 1 // 隨便把分號放在哪里，只要能隔開就行
;(function() {
  console.log(2)
})()

ASI 自動(dòng)加入分號

ASI是 “Automatic Semicolon Insertion” 的縮寫，在運(yùn)行時(shí)會(huì)往有些折行的代碼中自動(dòng)插入分號，這個(gè)機(jī)制可以使部分代碼在沒有加入分號時(shí)也能正常運(yùn)行，比如下面的例子：

var b = 1
++b
console.log('b', b)

由于代碼中的 ++ 屬于一元表達(dá)式，它只能在表達(dá)式的左邊或右邊放置變量，如果沒有 ASI 的機(jī)制，代碼會(huì)被轉(zhuǎn)換為 var b = 1 ++ b 這樣的錯(cuò)誤語句。不過好在有 ASI，在實(shí)際運(yùn)行時(shí)會(huì)自動(dòng)被加入分號，也就不會(huì)出現(xiàn)上面的錯(cuò)誤。

var b = 1;
++b;
console.log('b', b); // 2

return 與分號的關(guān)系

再來看一個(gè)例子，下面的代碼在 return 的后面空一行后再寫要返回的值，那么問運(yùn)行結(jié)果是什么呢？

function fn() {
  return 
  '小明'
}
console.log(fn())

這段程序代碼因?yàn)?ASI 的修正，return 的后面會(huì)被加上一個(gè)分號，所以 return 與預(yù)期返回的值被分開了，結(jié)果 return 的內(nèi)容為空值，最終的結(jié)果也只能是 undefined 。

function fn() {
  return;
  '小明';
}
console.log(fn()); // undefined

到底應(yīng)該怎樣處理分號

本來 ASI 是出于一片好心，用來修正沒有加入分號的代碼片段，但偏偏在有的地方并沒有發(fā)揮它的作用（例如本文一開始所介紹的立即函數(shù)），導(dǎo)致代碼出現(xiàn)了錯(cuò)誤；甚至有些代碼不會(huì)出錯(cuò)，但會(huì)使你的代碼執(zhí)行結(jié)果和預(yù)期相差萬里。

解決 ASI 問題的方式如下：

• 無論如何都要加上分號，完全由自己決定代碼的分割

• 牢記不會(huì)自動(dòng)加入分號的規(guī)則，當(dāng)不會(huì)自動(dòng)插入分號時(shí)，則手動(dòng)加入

不會(huì)被自動(dòng)加入分號的規(guī)則

下面時(shí)各種不會(huì)自動(dòng)加入分號的規(guī)則：

1. 新行的代碼是從  (、[、/  字符開始的，這類情況一般會(huì)直接出現(xiàn) Uncaught TypeError 從而導(dǎo)致代碼無法運(yùn)行。

var a = 1
var b = a
(a + b).toString()

var a = 1
[1,2,3].forEach(bar)
 
(function() { })()
(function() { })()
 
var a = 1
var b = a
/test/.test(b)

1. 新行以 +，-，*，％ 開始，這類情況大多會(huì)影響運(yùn)算結(jié)果，所以應(yīng)該合并為一行。

var a = 2
var b = a
+a

1. 新行以 , 或 . 開始，這種用法經(jīng)常會(huì)出現(xiàn)，主要是為了避免代碼過長而加入的分隔，這種情況并不會(huì)影響運(yùn)行，如果善用的話會(huì)使代碼更容易閱讀。

var a = 2
var b = a
  .toString()
console.log(typeof b)
 
var a = 1
,b = 2 // b 同樣會(huì)被 var 聲明

如果遇到需要加入分號的情況，除了可以在語句的末尾加入分號外，也可以把分號加在“不會(huì)自動(dòng)加入分號”的最前方，例如 () 本身不會(huì)自動(dòng)加入分號，在有這種需求時(shí)可以將 ; 加到前面（ESLint Standard JS 規(guī)范就用這個(gè)方法避免錯(cuò)誤）。

// 運(yùn)行錯(cuò)誤
(function() { })()
(function() { })()
 
// 正確
;(function() { })()
;(function() { })()

感謝你能夠認(rèn)真閱讀完這篇文章，希望小編分享的“JavaScript代碼加不加分號的區(qū)別是什么”這篇文章對大家有幫助，同時(shí)也希望大家多多支持創(chuàng)新互聯(lián)，關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道，更多相關(guān)知識等著你來學(xué)習(xí)!

當(dāng)前標(biāo)題：JavaScript代碼加不加分號的區(qū)別是什么
網(wǎng)頁URL：http://chinadenli.net/article36/gdgjsg.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供微信小程序、微信公眾號、商城網(wǎng)站、網(wǎng)站維護(hù)、關(guān)鍵詞優(yōu)化、品牌網(wǎng)站建設(shè)

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源： 創(chuàng)新互聯(lián)