in 运算符和 Object.prototype.hasOwnProperty() 方法区别

106 阅读2分钟

in 运算符和 Object.prototype.hasOwnProperty() 方法都用于判断一个对象是否包含某个属性,但它们在实现和行为上有所不同。下面是它们的区别:

1. in 运算符

in 运算符用于检查对象或其原型链上是否存在某个属性。

语法:

prop in obj
  • prop:属性名或属性的字符串。
  • obj:要检查的对象。

特点:

  • in 运算符会检查对象本身以及该对象的原型链上是否有指定的属性。
  • 如果该属性存在于对象的原型链中,in 运算符也会返回 true

示例:

const obj = { a: 1 };
console.log('a' in obj); // true,obj本身有a属性
console.log('toString' in obj); // true,toString是Object的原型方法

在上面的例子中,虽然 obj 没有 toString 属性,但它继承了 Object.prototype 中的 toString 方法,因此 toString in obj 返回 true

2.Object.prototype.hasOwnProperty()

hasOwnProperty()方向Object 的原型方法,用于检查对象本身是否拥有某个属性,而不是它的原型链上。

语法:

obj.hasOwnProperty(prop)
  • prop:属性名或属性的字符串。
  • obj:要检查的对象。

特点:

  • hasOwnProperty() 只会检查对象本身是否有指定的属性,不会检查原型链。
  • 它是一个实例方法,可以在对象上直接调用。

示例:

const obj = { a: 1 };
console.log(obj.hasOwnProperty('a')); // true,obj本身有a属性
console.log(obj.hasOwnProperty('toString')); // false,toString是Object的原型方法

在上面的例子中,hasOwnProperty('toString') 返回 false,因为 toStringObject.prototype 上的方法,而不是 obj 本身的属性。

区别总结:

特性in运算符hasOwnProperty() 方法
检查的范围对象本身及其原型链仅检查对象本身
是否检查原型链
用途检查属性是否存在(包括原型链)检查对象本身是否具有某属性

例子比较:

const obj = { a: 1 };
Object.setPrototypeOf(obj, { b: 2 });

console.log('a' in obj); // true,obj本身有a属性
console.log('b' in obj); // true,b存在于obj的原型链上
console.log(obj.hasOwnProperty('a')); // true,a是obj本身的属性
console.log(obj.hasOwnProperty('b')); // false,b是obj原型链上的属性
  • in 会返回 true,因为它不仅检查对象本身的属性,还会检查对象的原型链。
  • hasOwnProperty 只会检查 obj 本身的属性,因此对于 b 属性会返回 false,因为它是在原型链上。

总结:

  • 如果你想检查某个属性是否存在于对象本身或其原型链中,使用 in
  • 如果你只关心对象本身是否具有某个属性,而不想检查原型链上的属性,使用 hasOwnProperty()