JavaScript程式碼日常注意六點

大家在日常JavaScript開發中都需要注意一些程式碼是否會出錯，而我們今天來總結一下JavaScript中日常開發需要注意的六點易錯部分，相信很多同學都需要來看看哦！廢話少說我們直接開始進入正題吧！

立即執行函數

立即執行函數，通常也可作閉包，能夠建構一個函數層級的變數作用域。一般寫法如下：

(function () {
  // code
})();

但是這中寫法容易造成一些問題，如上面的程式碼如果沒有分號結尾的話：

var a = 1
(function () { // Uncaught TypeError: 1 is not a function
})()

那麼應該這樣寫：

void function () {
  // code
}();

或者：

!function () {
  // code
}();

;(function(){
   //code
})()

選擇哪一種看個人喜好，現在js中有個規範叫standardjs規範， 提倡省略行尾的分號（個人不太習慣），需要改變這個習慣。

2.空物件null

從JS誕生以來，賦予了null為Object類別型，可以說是JS的一個終生bug，從未、以後也不會改變。

null不具備作為物件的基本特徵，屬於原始資料型別。我想說明的是在判斷變數是否為物件之前，應該先判斷其是否為null。

if (opt!== null && typeof opt=== 'object') {
  // opt是一个对象
}

3.不要隨意對小數做比較

在做小數之間的計算時候，注意浮點數之前的精度問題。

如：0.1+0.2是否等於0.3?  答案是：0.1+0.2=0.30000000000000004

#類似：0.4-0.3=0.100000000000000#03##如果此類計算把小數轉為

字串

，使用toFixed去小數若干位進行比較：

(0.1 + 0.2).toFixed(2) === '0.30'

注意：兩個數的差值小到一定範圍的時候，即可以認為他們是相等的。

Math.abs(0.1+0.2 - 0.3) <= 1e-10 // true

 4.時刻記住NaN

一說到NaN，那麼有個特性大夥應該都會想起，NaN !==NaN。對，就這麼屌。

如果你需要判斷一個變數是否為NaN，只要把它跟它自己比較，如果不相等，那就是NaN。

判斷一個數字是否為NaN，可以使用isNaN()方法。但如果不知道某個變數的具體資料型態的時候，不要輕易用該方法來判斷，因為isNaN有個詭異特性：它會先把要判斷的變數先轉換成數值來計算。

isNaN('abc') // true
isNaN('123') // false
isNaN('') // false
isNaN([]) // false
isNaN({}) // true

那麼這時候會對你的判斷結果造成意外。

還有一個注意點就是，永遠不要拿任何變數跟NaN來比較，如：opt===NaN。

5.除了比較null和undefined，永遠不要使用非嚴格==和！ =

相信你會看到很多文章、規範都會說盡量使用===和！ ==，不使用==和！ =，原因在於後者會進行強制

類型轉換

（造成難以找到的bug）。 先看一下：

'true' == true // => false
'true' == false // => false
[] == {} // => false
[] == [] // => false

如果你對以上判斷有疑惑，那就記住一個規則：

null == null // => true
undefined == undefined  // => true
null == undefined // => true
undefined == null // => true
x == null // => false (x 非 null 或 undefined）
x == undefined // => false (x 非 null 或 undefined）

也即是判斷x是否為null或undefined，那就用==，否則，永遠不要使用。

6.慎用|| 設定預設值

給一個變數設定一個預設值，相信入坑多年的JS開發者都會這樣寫：

page = page || 0;
data = data || '你好';

解釋下arg1 || arg2的意思是如果arg1能夠轉換為true，那麼就取arg1，否則取arg2。

那我們先來看看不可以轉換成true的值有哪些呢？

1.undefined

2.null

3.NaN

4.整數0

5.空字串「」

所以如果当用户传给arg1的参数是0或者为空字符串“”的时候，那么最终的值就会取默认的（||后面）值是不是？好，问题来了。如果用户传给后台的查询关键字data（上面代码）是空字符串“”，那么就应该按照空字符串“”去后台数据库查询，而结果传给后台的却是“你好”，显然查询结果也就不对。

好，回到主题，实际上只有undefined才应该被认为是用户没有指定其具体值，我曾看过有人这样理解（null 表示 用户让你给他把这个位置空着；而 undefined 表示 用户没发表意见）

so :

page = page !== undefined ? page : 0;
data = data !== undefined ? data :'你好';

只需判断undefined即可。

个人理解如果有需求，可以把null加进去判断。

以上是JavaScript程式碼日常注意六點的詳細內容。更多資訊請關注PHP中文網其他相關文章！