in与hasOwnProperty方法

七崽爱吃小饼干2025/12/30阅读 0专栏 JavaScript

JavaScript 中 in 操作符和 hasOwnProperty() 方法的核心区别

一、核心区别：是否检测原型链

这是两者最本质的差异，决定了它们的检测结果和使用场景：

in 操作符：会同时检测对象自身的属性 + 其原型链上继承而来的属性（包括原型链上的可枚举/不可枚举属性，仅排除 Symbol 类型且不可枚举的特殊属性）。
hasOwnProperty() 方法：仅检测对象自身的属性（不查找原型链，不管原型链上是否存在同名属性，都不会纳入检测范围）。

二、代码示例：直观验证差异

我们通过一个具体示例，清晰看到两者的检测结果区别：

javascript

// 1. 创建一个普通对象（默认继承 Object.prototype 原型链）
const person = {
  name: "张三", // 自身属性
  age: 25       // 自身属性
};

// 2. 检测自身属性：两者结果一致
console.log("name" in person); // true（自身属性存在）
console.log(person.hasOwnProperty("name")); // true（自身属性存在）
console.log("age" in person); // true
console.log(person.hasOwnProperty("age")); // true

// 3. 检测原型链属性：结果差异明显
// toString 是 Object.prototype 上的继承属性（非 person 自身属性）
console.log("toString" in person); // true（in 会检测原型链）
console.log(person.hasOwnProperty("toString")); // false（hasOwnProperty 不检测原型链）

// constructor 也是 Object.prototype 上的继承属性
console.log("constructor" in person); // true
console.log(person.hasOwnProperty("constructor")); // false

总结

检测范围：in 检测自身属性 + 原型链属性，hasOwnProperty() 仅检测自身属性（核心区别）；
原型链处理：in 不忽略原型链，hasOwnProperty() 完全忽略原型链；
使用场景：精准判断自身属性用 hasOwnProperty()（比如深拷贝时），不关心属性来源仅判断存在用 in。