別讓undefined摧毀你的前端代碼

孕育

undefined是一個特別的值,它代表沒有。嗯,不是說真的沒有,它就像小強一樣無所不在,但你又抓不住它,由於它是沒有。。。

低微的誕生

數組溢出
var arr = [1, 2, 3];

console.log(arr[4]); // undefined
初始變量
var a;

console.log(a); // undefined
未傳實參
function callMe(name) {
  return name;
}

console.log(callMe()); // undefined
無返回值
function callMe(name) {
  // do nothing
}

console.log(callMe('原罪')); // undefined
虛擬屬性
var def = {hello: "world"};

console.log(def.hi); // undefined
移花接木

堆內存和棧內存的千絲萬縷

function doYouLikeMe(You) {
  delete You.amPower;

  return 'no';
}

var I = {name: "原罪", amPower: 'yes'};

console.log(I.amPower);        // 'yes'
console.log(doYouLikeMe(I));   // 'no'

console.log(I.amPower);        // undefined
偷上癮了

亞當和夏娃偷吃禁果,犯了原罪

function whatAboutAdam(eve) {
  eve.pop();

  return '無罪釋放';
}

var eve = ['夏', '娃', '的', '原', '罪'];

console.log(eve[4]);               // '罪'
console.log(whatAboutAdam(eve));   // '無罪釋放'

console.log(eve[4]);               // undefined
範例揣摸
var a;

console.log(typeof a);              // "undefined"
console.log(typeof undefined);      // "undefined"
console.log(typeof notDefinedKey);  // "undefined"

嚴酷的合作

隊友,能夠用 === 對照

// void背面加上任何值都邑 全即是 undefined

void 0 === undefined       // true
void 1 === undefined       // true
void '原罪' === undefined   // true
void true === undefined    // true
void {} === undefined      // true

仇人,能夠用 == 對照:

null ==  undefined // true

null === undefined // false

仇人的仇人,須要取反對照:


!false === !undefined // true
!"" === !undefined // true
!0 === !undefined // true

false == undefined // false
"" == undefined // false
0 == undefined // false

克隆者入侵

undefined不是保留字,es5以後,全局undefined沒法被掩蓋

undefined = 2;

console.log(undefined); // undefined

嚴厲形式下,掩蓋全局undefined將直接拋錯

"use strict";
undefined = 2;

console.log(undefined); // throw new TypeError();

但部分undefined還能夠被掩蓋(包含嚴厲形式)

var undefined = 2;

console.log(undefined); // 2

滅霸響指

  • 掩蓋undefined的值是風險行動,請勿模擬。
  • 能夠用 void 0 替代 undefined,緊縮插件就是這麼做的
  • 有條件的看官請用typescript,給每一個undefined都發通行證
  • 寫js只管用 ===,兩個即是號的就忘了它吧
    原文作者:原罪
    原文地址: https://segmentfault.com/a/1190000015232522
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞