JavaScript 判断空对象空数组
来源: https://www.jianshu.com/p/cadcbab793d7
我们判断参数时希望
null,undefined,"",[],{}都判断为空
一、为什么判断空数组空对象会比较麻烦
通过以下表格可以发现使用!a(非a)和与自己比较时,null,undefined,0,“”,都可以进行很容易的判断,但[],{}就都是false.
| a | !a | 与自己比较(a===null…) | 描述 | 数据类型 |
|---|---|---|---|---|
| null | true | true | 空对象 | Null |
| undefined | true | true | 未定义对象 | Undefined |
| 0 | true | true | 数值0 | Number |
| “” | true | true | 空字符串 | String |
| [] | false | false | 空数组 | Array |
| {} | false | false | 空对象 | Object |
二、判断空数组的方法
分析:所谓空数组,就是数组的长度等于0。所以我们的难点就落在了怎么判断一个参数的数据类型是数组了。我们可以通过isPrototypeOf()方法实现。
var obj = [];
Array.prototype.isPrototypeOf(obj); // true
isPrototypeOf() 方法用于测试一个对象是否存在于另一个对象的原型链上。即判断 Array 是否存在于 obj 的原型链上。该方法属于 ES3 标准,现代浏览器均支持,包括` IE``。
所以,完整的检验空数组的表达式如下:
// 满足以下判断表达式的都是 空数组 []
Array.prototype.isPrototypeOf(obj) && obj.length === 0
三、判定空对象的方法
分析:和判断空对象类似的,我们只要能验证这个对象的keys长度是0,那就是个空对象了。我们依旧可以通过isPrototypeOf()方法实现判断一个数据是不是对象。
var obj = {};
Object.prototype.isPrototypeOf(obj); // true
完整的检验空对象的表达式如下:
// 满足以下判断表达式的都是 空对象
Object.prototype.isPrototypeOf(obj) && Object.keys(obj).length === 0
其中,Object.keys()方法会返回一个由给定对象的自身可枚举属性组成的数组,数组中属性名的排列顺序和使用for...in循环遍历该对象时返回的顺序一致(该方法属于 ES5 标准,IE9 以上和其它现代浏览器均支持)。
若要兼容IE9以下,可以用 for...in替代,但要注意for...in 会将对象原型链上的属性也枚举出来,所以要借hasOwnProperty()方法来判断是不是对象本身的属性。
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 中一切皆是对象,也就是说,Object 也存在于数组的原型链上,因此在封装校验方法时,数组需要先于对象检验。
Array.prototype.isPrototypeOf([]); // true
Array.prototype.isPrototypeOf({}); // false
Object.prototype.isPrototypeOf([]); // true
Object.prototype.isPrototypeOf({}); // true
注意:isPrototypeOf 和 instanceof operator 是不一样的。在表达式 obj instanceof AFunction 中,检测的是 AFunction.prototype 是否在obj 的原型链中,而不是检测 AFunction 自身。
四、一个判断参数为空的函数封装
结合上面的空对象、空数组检测方法,我们可以封装一个判断参数为空的函数。
function isEmpty(a){
if (a === "") return true; //检验空字符串
if (a === "null") return true; //检验字符串类型的null
if (a === "undefined") return true; //检验字符串类型的 undefined
if (!a && a !== 0 && a !=="") return true; //检验 undefined 和 null
if (Array.prototype.isPrototypeOf(a) && a.length === 0 ) return true; //检验空数组
if (Object.prototype.isPrototypeOf(a) && Object.keys(a).length === 0 ) return true; //检验空对象
return false;
}
小小Tips:
- 一个讨巧判断空数组、空对象的方法:
var item = [];
console.log(JSON.stringify(item) === '[]'); // true
var item = {};
console.log(JSON.stringify(item) === '{}');// true
- null, undefined, {}, [],“” , 0在非严格等于(即两个等号时==)情况下,他们互有“帮派”。
1)null, undefined为一组。
console.log(null == undefined); // true
2)[], “” , 0为一组。
console.log("" == 0); // true
console.log("" == []); // true
console.log(0 == []); // true
// 但不要混淆,空数组不等于空数组
console.log([] == []); // false
所以在做判断的时候,严谨点要用严格等于===。
本文详细介绍了如何在JavaScript中判断空数组和空对象,包括使用`Array.prototype.isPrototypeOf()`和`Object.prototype.isPrototypeOf()`方法,以及`Object.keys()`。此外,还提供了一个综合的`isEmpty()`函数来检查参数是否为空,并提到了使用`JSON.stringify()`的快速检查方法。文章强调了在判断过程中需要注意的细节和陷阱,如空数组与空对象的区别,以及不同类型的空值之间的等价关系。
457

被折叠的 条评论
为什么被折叠?



