摘要：小汪經(jīng)過實(shí)踐得出以下用途。空數(shù)組的類型也是，這表示在內(nèi)部，數(shù)組本質(zhì)上只是一種特殊的對象。調(diào)用函數(shù)時(shí)，某個(gè)參數(shù)未設(shè)置任何值，這時(shí)就可以傳入，表示該參數(shù)為空。前端還是很有未來的下節(jié)內(nèi)容細(xì)數(shù)實(shí)用黑科技二。

只有深入學(xué)精一門語言，學(xué)其他語言才能更好地舉一反三，觸類旁聽。

從接觸前端開發(fā)到現(xiàn)在已經(jīng)將近 2 年了，最近又看了阮一鋒寫的： 《JavaScript 語言入門教程》 一書，重溫 JavaScript 。

小汪將工作和面試遇到過的，沒多少人知道的 JavaScript 技巧，卻十分實(shí)用的技巧都總結(jié)在這里面，分享給大家 。

溫故而知新，我們對技術(shù)應(yīng)該有的態(tài)度是： Stay hungry ! Stay young ！

JavaScript 語言允許，語句的前面有標(biāo)簽（label），相當(dāng)于定位符，用于跳轉(zhuǎn)到程序的任意位置，標(biāo)簽的格式如下。

label:
  語句

標(biāo)簽可以是任意的標(biāo)識符，但不能是保留字，語句部分可以是任意語句。

標(biāo)簽通常與 break 語句和 continue 語句配合使用，跳出特定的循環(huán)。

top:
  for (var i = 0; i < 3; i++){
    for (var j = 0; j < 3; j++){
      if (i === 1 && j === 1) break top;
      console.log("i=" + i + ", j=" + j);
    }
  }
// i=0, j=0
// i=0, j=1
// i=0, j=2
// i=1, j=0

上面代碼為一個(gè)雙重循環(huán)區(qū)塊，break 命令后面加上了 top 標(biāo)簽（注意，top 不用加引號），滿足條件時(shí)，直接跳出雙層循環(huán)。如果 break 語句后面不使用標(biāo)簽，則只能跳出內(nèi)層循環(huán)，進(jìn)入下一次的外層循環(huán)。

標(biāo)簽也可以用于跳出代碼塊。

foo: {
  console.log(1);
  break foo;  // 注意要加 break 才能退出
  console.log("本行不會輸出");
}
console.log(2);
// 1
// 2

上面代碼執(zhí)行到 break foo，就會跳出區(qū)塊。

continue 語句也可以與標(biāo)簽配合使用。

top:
  for (var i = 0; i < 3; i++){
    for (var j = 0; j < 3; j++){
      if (i === 1 && j === 1) continue top;
      console.log("i=" + i + ", j=" + j);
    }
  }
// i=0, j=0
// i=0, j=1
// i=0, j=2
// i=1, j=0
// i=2, j=0
// i=2, j=1
// i=2, j=2

上面代碼中，continue 命令后面有一個(gè)標(biāo)簽名，滿足條件時(shí)，會跳過當(dāng)前循環(huán)，直接進(jìn)入下一輪 外層循環(huán)。 如果 continue 語句后面不使用標(biāo)簽，則只能進(jìn)入下一輪的 內(nèi)層循環(huán)。

小汪經(jīng)過實(shí)踐得出以下用途。

用途：

可以跳出循環(huán)。

對于多層循環(huán)也同樣適用。

特別是兩層或者多層循環(huán)，只是為了找到想要的某個(gè)值時(shí)，而循環(huán)的數(shù)據(jù)是大量的，用標(biāo)簽就非常高效。

先來道面試題：

console.log(typeof window)
console.log(typeof {}) 
console.log(typeof [])
console.log(typeof null)

答案：

"object"
"object"
"object"
"object"

上面代碼中，null 返回 object 。這是由于歷史原因造成的，且一切原型鏈的終點(diǎn)都是 null。
空數(shù)組（ [] ）的類型也是 object，這表示在 JavaScript 內(nèi)部，數(shù)組本質(zhì)上只是一種特殊的對象。而 instanceof 運(yùn)算符可以區(qū)分?jǐn)?shù)組和對象。

var o = {};
var a = [];

o instanceof Array // false
a instanceof Array // true

經(jīng)常會有面試官問：null 與 undefined 的區(qū)別 ？

區(qū)別：

null 是一個(gè)表示“空”的對象，轉(zhuǎn)為數(shù)值時(shí)為 0 。

undefined 是一個(gè)表示"此處無定義"的原始值，轉(zhuǎn)為數(shù)值時(shí)為 NaN。

Number(null) // 0
5 + null // 5

Number(undefined) // NaN
5 + undefined // NaN

對于 null 和 undefined，大致可以像下面這樣理解。

null 表示空值，即該處的值現(xiàn)在為空。調(diào)用函數(shù)時(shí)，某個(gè)參數(shù)未設(shè)置任何值，這時(shí)就可以傳入 null，表示該參數(shù)為空。比如，某個(gè)函數(shù)接受引擎拋出的錯(cuò)誤作為參數(shù)，如果運(yùn)行過程中未出錯(cuò)，那么這個(gè)參數(shù)就會傳入 null ，表示未發(fā)生錯(cuò)誤。

undefined 表示“未定義”，下面是返回 undefined 的典型場景。

// 變量聲明了，但沒有賦值
var i;
i // undefined

// 調(diào)用函數(shù)時(shí)，應(yīng)該提供的參數(shù)沒有提供，該參數(shù)等于 undefined
function f(x) {
  return x;
}
f() // undefined

// 對象沒有賦值的屬性
var  o = new Object();
o.p // undefined

// 函數(shù)沒有返回值時(shí)，默認(rèn)返回 undefined
function f() {}
f() // undefined

注意，布爾值轉(zhuǎn)換的時(shí)候，空數(shù)組（[]）和空對象（{}）對應(yīng)的布爾值，都是true。

if ([]) {
  console.log("true");
}
// true

if ({}) {
  console.log("true");
}
// true

JavaScript 內(nèi)部，所有數(shù)字都是以 64 位浮點(diǎn)數(shù)形式儲存，即使整數(shù)也是如此。所以，1 與 1.0 是相同的，是同一個(gè)數(shù)。

1 === 1.0 // true

JavaScript 語言的底層根本沒有整數(shù)，所有數(shù)字都是小數(shù)（ 64 位浮點(diǎn)數(shù)）。容易造成混淆的是，某些運(yùn)算只有整數(shù)才能完成，此時(shí) JavaScript 會自動把 64 位浮點(diǎn)數(shù)，轉(zhuǎn)成 32 位整數(shù)，然后再進(jìn)行運(yùn)算。

由于浮點(diǎn)數(shù)不是精確的值，所以涉及小數(shù)的比較和運(yùn)算要特別小心。

例如：

0.1 + 0.2 === 0.3
// false

0.3 / 0.1
// 2.9999999999999996

(0.3 - 0.2) === (0.2 - 0.1)
// false

2.22 + 2.21
// 4.43 

3.45 + 1.11
// 4.5600000000000005

2.22 + 2.24
// 4.460000000000001

但是商品計(jì)算金額的時(shí)候，金額的結(jié)果一般都是保留兩倍小數(shù)點(diǎn)的，那怎么辦呢？

可以用 toFixed 解決：

var a = 2.22 + 2.24
// 4.460000000000001
var result = (a).toFixed(2)
// 4.46

for...in 循環(huán)用來遍歷一個(gè)對象的全部屬性(包括可遍歷的繼承的屬性)。但是，一般情況下，都是只想遍歷對象自身的屬性，所以使用 for...in 的時(shí)候，應(yīng)該結(jié)合使用 hasOwnProperty 方法，在循環(huán)內(nèi)部判斷一下，某個(gè)屬性是否為對象自身的屬性。

var person = { name: "老張" };

for (var key in person) {
  if (person.hasOwnProperty(key)) {
    console.log(key);
  }
}
// name

重大事件：2017年11月，所有主流瀏覽器全部支持 WebAssembly，這意味著任何語言都可以編譯成 JavaScript，在瀏覽器運(yùn)行。

前端還是很有未來的 ！！！

下節(jié)內(nèi)容：細(xì)數(shù) JavaScript 實(shí)用黑科技(二) 。

如果你覺得該文章對你有幫助，歡迎到我的 github star 一下，謝謝。

github 地址

參考教程： 《JavaScript 語言入門教程》

你以為本文就這么結(jié)束了 ? 精彩在后面 ！！！

對 全棧修煉 有興趣的朋友可以掃下方二維碼關(guān)注我的公眾號

我會不定期更新有價(jià)值的內(nèi)容，長期運(yùn)營。

關(guān)注公眾號并回復(fù) 福利 可領(lǐng)取免費(fèi)學(xué)習(xí)資料，福利詳情請猛戳： Python、Java、Linux、Go、node、vue、react、javaScript