JS判断对象、数组是否包含某个属性、某个值-Toy模板网

这篇具有很好参考价值的文章主要介绍了JS判断对象、数组是否包含某个属性、某个值。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

一、判断对象是否包含某个属性

可以使用以下几种方法来判断对象是否包含某个属性：

1. in 操作符：

使用 in 操作符可以检查对象是否包含指定的属性。它会检查对象及其原型链上的所有属性。

const obj = { name: 'John', age: 25 };
console.log('name' in obj); // 输出: true
console.log('gender' in obj); // 输出: false

2. hasOwnProperty() 方法：

hasOwnProperty() 是对象的内置方法，用于检查对象自身是否具有指定的属性（不包括原型链上的属性）。

const obj = { name: 'John', age: 25 };
console.log(obj.hasOwnProperty('name')); // 输出: true
console.log(obj.hasOwnProperty('gender')); // 输出: false

3. 使用 undefined 进行判断：

通过访问对象的属性并与 undefined 进行比较，可以判断对象是否包含该属性。

但当 obj 为null 或 undefined 时会报错。

const obj = { name: 'John', age: 25 };
console.log(obj.name !== undefined); // 输出: true
console.log(obj.gender !== undefined); // 输出: false

4. 使用 Object.keys() 方法：

Object.keys() 方法返回一个包含对象自身可枚举属性的数组。您可以使用该方法来获取对象的所有属性，并判断指定属性是否存在于返回的数组中。

const obj = { name: 'John', age: 25 };
console.log(Object.keys(obj).includes('name')); // 输出: true
console.log(Object.keys(obj).includes('gender')); // 输出: false

备注：这些方法可以根据您的需求选择使用，以判断对象是否包含某个属性。请注意，前三种方法在属性值为 undefined 时也会返回 true，而最后一种方法不会将 undefined 视为存在的属性。

5. 使用 Reflect.has(obj , keyName) 方法：

Reflect.has(obj, name)
Reflect.has方法对应name in obj里面的in运算符。
如果Reflect.has()方法的第一个参数不是对象，会报错。

 let obj = {
     name: '再努力些吧',
     age: 18,
     work: '前端',
 }
 // 旧写法
 console.log('age' in obj);//true
 console.log('sex' in obj);//false
 // 新写法
 console.log(Reflect.has(obj, 'age'));//true
 console.log(Reflect.has(obj, 'sex'));//false

6、propertyIsEnumerable() 相当于 hasOwnProperty() 的增强版

这个方法的用法与hasOwnProperty()相同，但当检测属性是自有属性(非继承)且这个属性是可枚举的，才会返回true。

方便记忆可以理解为：

in: 只要对象包含某个属性就返回true, 包含原型链上的属性
hasOwnProperty: 首先满足in, 其次属性不属于原型链
propertyIsEnumerable: 首先满足hasOwnProperty，其次该属性未经由Object.defineProperty定义为不可列举

/* 如下例子我就不写了引用别人的。作者：Netmad,来源：知乎,
链接：https://www.zhihu.com/question/21907133/answer/378501127  */
function foo() {
  this.id = 'id';
}
foo.prototype.common = 'common';
var o = new foo();

'id' in o; // true
'common' in o; // true
'whatever' in o; // false
o.hasOwnProperty('id'); //true
o.hasOwnProperty('common'); //false
o.propertyIsEnumerable('id'); //true
o.propertyIsEnumerable('common'); //false
// 目前为止, hasOwnPerproty和propertyIsEnumerable看上去没啥差别
// 通过Object.defineProperty定义新的属性
Object.defineProperty(o, 'prop', {
  value: 'valueOfProp',
  enumerable: false
});
o.prop; // valueOfProp
o.hasOwnProperty('prop'); // true
o.propertyIsEnumerable('prop'); //false
// 如果defineProperty时enumerable为true, 那么这里依然和hasOwnProperty一样

以上方法都可以判断出对象是否包含某个属性，工作中可以根据不同情况采用不同的方法。

二、判断数组中是否包含某个值

可以使用以下几种方法来判断数组中是否包含某个值：

1. includes() 方法：

includes() 方法用于检查数组是否包含指定的值，并返回一个布尔值。

const arr = [1, 2, 3, 4, 5];
console.log(arr.includes(3)); // 输出: true
console.log(arr.includes(6)); // 输出: false

2. indexOf() 方法：

indexOf() 方法返回指定值在数组中的第一个匹配项的索引，如果不存在则返回 -1。

const arr = [1, 2, 3, 4, 5];
console.log(arr.indexOf(3) !== -1); // 输出: true
console.log(arr.indexOf(6) !== -1); // 输出: false

3. find() 方法：

find() 方法返回数组中满足提供的测试函数的第一个元素的值，如果不存在则返回 undefined。

const arr = [1, 2, 3, 4, 5];
console.log(arr.find(element => element === 3) !== undefined); // 输出: true
console.log(arr.find(element => element === 6) !== undefined); // 输出: false

4. some() 方法：

some() 方法测试数组中是否至少有一个元素通过了提供的测试函数，返回一个布尔值。

const arr = [1, 2, 3, 4, 5];
console.log(arr.some(element => element === 3)); // 输出: true
console.log(arr.some(element => element === 6)); // 输出: false

备注：这些方法可以根据您的需求选择使用，以判断数组中是否包含某个值。请注意，前三种方法在比较值时使用的是严格相等运算符（===），而 some() 方法则通过测试函数来进行判断。

5. findIndex() 方法：

返回值：如果找到满足条件的元素，则返回该元素的索引（大于等于 0）；如果没有找到满足条件的元素，则返回 -1。
判断方式：通过提供的测试函数对数组中的每个元素进行判断，直到找到满足条件的元素为止。
示例：

const arr = [1, 2, 3, 4, 5];
console.log(arr.findIndex(element => element === 3)); // 输出: 2
console.log(arr.findIndex(element => element === 6)); // 输出: -1