我們?cè)谂袛鄥?shù)是否為空時(shí),希望把
null
,undefined
,{}
,[]
,""
這五類都判定為空茉继。
一咧叭、為什么判定空對(duì)象、空數(shù)據(jù)有點(diǎn)“難”烁竭?
首先菲茬,我們先看下下面的表格:
a |
取非 !a
|
和自己比較 a===null/undefined...
|
描述 | 數(shù)據(jù)類型 |
---|---|---|---|---|
null | true | true | 空對(duì)象 | Null |
undefined | true | true | 未定義對(duì)象 | Undefined |
0 | true | true | 數(shù)值0 | Number |
"" | true | true | 空字符串 | String |
[] | false | false | 空數(shù)組 | Array |
{} | false | false | 空對(duì)象 | Object |
從表格中,我們可以看出想要判斷是不是null
, undefined
, ""
, 0
派撕,都比較容易婉弹, 非操作 和 比較操作 都能實(shí)現(xiàn)。就是{}
, []
比較頑固终吼,兩種方法都無效镀赌。
二、判定空數(shù)組的方法
分析:所謂空數(shù)組衔峰,就是數(shù)組的長(zhǎng)度等于0佩脊。所以我們的難點(diǎn)就落在了怎么判斷一個(gè)參數(shù)的數(shù)據(jù)類型是數(shù)組了。
我們可以通過isPrototypeOf()
方法實(shí)現(xiàn)垫卤。
var obj = [];
Array.prototype.isPrototypeOf(obj); // true
isPrototypeOf() 方法用于測(cè)試一個(gè)對(duì)象是否存在于另一個(gè)對(duì)象的原型鏈上威彰。即判斷 Array
是否存在于 obj
的原型鏈上。該方法屬于 ES3 標(biāo)準(zhǔn)穴肘,現(xiàn)代瀏覽器均支持歇盼,包括 IE。
所以评抚,完整的檢驗(yàn)空數(shù)組的表達(dá)式如下:
// 滿足以下判斷表達(dá)式的都是 空數(shù)組 []
Array.prototype.isPrototypeOf(obj) && obj.length === 0
三豹缀、判定空對(duì)象的方法
分析:和判斷空對(duì)象類似的,我們只要能驗(yàn)證這個(gè)對(duì)象的keys
長(zhǎng)度是0慨代,那就是個(gè)空對(duì)象了邢笙。我們依舊可以通過isPrototypeOf()
方法實(shí)現(xiàn)判斷一個(gè)數(shù)據(jù)是不是對(duì)象她肯。
var obj = {};
Object.prototype.isPrototypeOf(obj); // true
完整的檢驗(yàn)空對(duì)象的表達(dá)式如下:
// 滿足以下判斷表達(dá)式的都是 空對(duì)象
Object.prototype.isPrototypeOf(obj) && Object.keys(obj).length === 0
其中挡毅,Object.keys()
方法會(huì)返回一個(gè)由給定對(duì)象的自身可枚舉屬性組成的數(shù)組,數(shù)組中屬性名的排列順序和使用 for...in
循環(huán)遍歷該對(duì)象時(shí)返回的順序一致(該方法屬于 ES5 標(biāo)準(zhǔn)赦役,IE9 以上和其它現(xiàn)代瀏覽器均支持)。
若要兼容IE9以下妇汗,可以用 for...in
替代帘不,但要注意for...in
會(huì)將對(duì)象原型鏈上的屬性也枚舉出來,所以要借hasOwnProperty()
方法來判斷是不是對(duì)象本身的屬性杨箭。
function hasKeys(obj){
for(var key in obj) {
if(obj.hasOwnProperty(key)) {
return true;
}
}
}
var obj1 = {a:'aa',b:'bb'};
var obj2 = {};
console.log(hasKeys(obj1)); // true
console.log(hasKeys(obj2)); // undefined
但要注意:在JavaScript 中一切皆是對(duì)象寞焙,也就是說,Object 也存在于數(shù)組的原型鏈上互婿,因此在封裝校驗(yàn)方法時(shí)捣郊,數(shù)組需要先于對(duì)象檢驗(yàn)。
Array.prototype.isPrototypeOf([]); // true
Array.prototype.isPrototypeOf({}); // false
Object.prototype.isPrototypeOf([]); // true
Object.prototype.isPrototypeOf({}); // true
注意:isPrototypeOf
和 instanceof operator
是不一樣的慈参。在表達(dá)式 obj instanceof AFunction
中模她,檢測(cè)的是 AFunction.prototype
是否在obj
的原型鏈中,而不是檢測(cè) AFunction
自身懂牧。
四侈净、一個(gè)判斷參數(shù)為空的函數(shù)封裝
結(jié)合上面的空對(duì)象、空數(shù)組檢測(cè)方法僧凤,我們可以封裝一個(gè)判斷參數(shù)為空的函數(shù)畜侦。
function isEmpty(a){
if (a === "") return true; //檢驗(yàn)空字符串
if (a === "null") return true; //檢驗(yàn)字符串類型的null
if (a === "undefined") return true; //檢驗(yàn)字符串類型的 undefined
if (!a && a !== 0 && a !=="") return true; //檢驗(yàn) undefined 和 null
if (Array.prototype.isPrototypeOf(a) && a.length === 0 ) return true; //檢驗(yàn)空數(shù)組
if (Object.prototype.isPrototypeOf(a) && Object.keys(a).length === 0 ) return true; //檢驗(yàn)空對(duì)象
return false;
}
小小Tips:
1. 一個(gè)討巧判斷空數(shù)組、空對(duì)象的方法:
var item = [];
console.log(JSON.stringify(item) === '[]'); // true
var item = {};
console.log(JSON.stringify(item) === '{}');// true
2. null
, undefined
, {}
, []
,""
, 0
在非嚴(yán)格等于(即兩個(gè)等號(hào)時(shí)==
)情況下躯保,他們互有“幫派”旋膳。
1)null
, undefined
為一組。
console.log(null == undefined); // true
2)[]
, ""
, 0
為一組途事。
console.log("" == 0); // true
console.log("" == []); // true
console.log(0 == []); // true
// 但不要混淆验懊,空數(shù)組不等于空數(shù)組
console.log([] == []); // false
所以在做判斷的時(shí)候,嚴(yán)謹(jǐn)點(diǎn)要用嚴(yán)格等于===
尸变。