JS进阶第三篇：开发中对数组及对象的判断方法

系列文章传送门：

JS进阶第一篇：手写call apply bind
JS进阶第二篇：函数参数按值传递

有很多小伙伴在涉及到类型检查的时候只知道 typeof 一把梭哈，但是 typeof 并不是万能的。
typeof 只能检测基本数据类型，包括 boolean、undefined、string、number、symbol，而 null ,Array、Object ,使用 typeof 出来都是 Object，函数的 typeof 是 function 无法检测具体是哪种引用类型。

JS判断数组

1.通过instanceof运算符判断

从构造函数入手:可以判断一个对象是否是在其原型链上原型构造函数中的属性。

console.log(arr instanceof Array);   //true

typeof 和 instanceof 这两者都可以用来判断变量，typeof会返回基本类型，而instanceof只会返回一个布尔值。

2.通过constructor判断

这个属性是返回对象相对应的构造函数，Object的每个实例都有构造函数 constructor，用于保存着用于创建当前对象的函数。

console.log(arr.constructor === Array);   //true

3.通过数组自带的isArray方法判断

ES5中新增了Array.isArray方法,IE8及以下不支持，用于确定传递的值是否是一个 Array，值得一提的是，这个方法是我在开发中最常用的：

console.log(Array.isArray(arr));   //true

对于ES5之前不支持此方法的问题，我们其实可以做好兼容进行自行封装，如下：

if (!Array.isArray) {
    Array.isArray = function(argument) {
        return Object.prototype.toString.call(argument) === '[Object Array]'
    }
}

4.通过isPrototypeOf()方法判断

从原型入手，Array.prototype 属性表示 Array 构造函数的原型，
其中有一个方法是 isPrototypeOf() 用于测试一个对象是否存在于另一个对象的原型链上。

console.log(Array.prototype.isPrototypeOf(arr));   //true

5.通过Object.prototype.toString.call()判断

虽然Array也继承自Object，但js在Array.prototype上重写了toString，而我们通过toString.call(arr)实际上是通过原型链调用了。可以获取到变量的不同类型。

console.log(Object.prototype.toString.call(arr) === '[object Array]');   //true

判断对象属性是否存在

下面是示例代码：

let person = {
    name: 'zyj'
}

我相信大部分同学判断对象上是否存在某一属性的时候是这么做的：

if(!person.age){
    console.log('person没有age属性');
}

这么做虽然可以但是不正规，最特殊的情况就是我们有age字段，而它的值是 undefined。

通过in运算符判断

JavaScript的in操作符可以用来判断一个属性是否属于一个对象，也可以用来变量一个对象的属性
这个方法是最常用的，用法是属性名 in 对象，如果存在返回 true，反之为 false，看下示例：

let person = {
    name: 'zyj'
}
console.log('name' in person);   //true
console.log('age' in person);    //false

但需要注意的是，in 只能判断对象有没有这个属性，无法判断这个属性是不是自身属性，具体我们看下面代码：

function Person(){
    this.name = 'zyj';
};
Person.prototype.age = 21;
var p = new Parent();
p.name//zyj
p.age//21

上面是最简单的一个创建构造函数实例的例子，根据我们原型链学到的知识，在这个例子中，对于实例 p 而言，name 是自身属性，这是它自己有的，而 age 是原型属性，p 可以顺着原型链找到 Person，并借用了这个属性。

在这种情况下，我们用 in 判断都是 true：

'name' in p;//true
'age' in p;//true

想要继续加一区分请看下面的 hasOwnProperty 方法

通过hasOwnProperty判断

我们先看一下 hasOwnProperty 的定义：hasOwnProperty这个方法可以用来检测一个对象是否含有特定的自身属性，即是用来判断一个属性是定义在对象本身而不是继承自原型链的，

在上面的例子中用 hasOwnProperty 即可判断是否是自身属性：

p.hasOwnProperty('name');//true
p.hasOwnProperty('age');//false

如果我们只需判断对象有没有某个属性，使用 in 运算符就好了。而如果我们还要关心这个属性是不是自身属性，那么推荐hasOwnProperty() 方法

通过Reflect.has判断

Reflect是在ES2015新增的一个内置对象，提供了与Javascript对象交互的方法。
判断一个对象是否存在某个属性，和 in 运算符 的功能完全相同。

用法：Reflect.has(obj, propName)：

let person = {
    name: 'zyj'
}
Reflect.has(person, "name"); // true
Reflect.has(person, "age"); // false

判断对象是否为空

通过JSON.Stringify()判断

利用 JSON.stringify() 将对象序列化，若序列化后的结果为 {}，则对象是空对象：

let data = {};
let b = (JSON.stringify(data) == "{}");
console.log(b);//true

使用Object.keys()方法判断

let data = {};
let arr = Object.keys(data);
console.log(arr.length == 0);//true