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。

方便记忆可以理解为:

  1. in: 只要对象包含某个属性就返回true, 包含原型链上的属性
  2. hasOwnProperty: 首先满足in, 其次属性不属于原型链
  3. 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

以上5种都是ES6增加的。

猜你喜欢

转载自blog.csdn.net/m0_37577465/article/details/131889375