in 操作符

2023-06-30 18:21:03

我们一般使用 in 操作符是在 for in 循环时，而当我们单独使用时，in 操作符被用来通过对象访问指定属性时返回一个布尔值，无论这个属性是在实例上还是在原型上。

而还有一个属性是 hasOwnProperty，功能是差不太多的，而区别是 hasOwnProperty 只会判断这个属性是否在实例上，不会再原型上再找

看下面这个例子，在 Person 的原型上定义了两个属性，name 和 age，在实例化一个 person1 后，通过 hasOwnProperty 去判断 name 属性，返回一个 false，说明 name 属性并不在实例上，然后我们用 in 来判断一下，结果返回 true，说明 name属性存在于 Person 的原型上

function Person() {
  Person.prototype.name = 'Richard'
  Person.prototype.age = 18
}

const person = new Person()

console.log(person.name) // Richard
console.log(person.hasOwnProperty('name')) // false
console.log('name' in person) // true

然后我们在这里来改变实例上 name 的值，再去进行判断，此时我们发现，hasOwnProperty 返回的值已经为true，说明当前的 name 是实例上的属性

function Person() {
  Person.prototype.name = 'Richard'
  Person.prototype.age = 18
}

const person = new Person()
person.name = 'Zhang'

console.log(person.name) // Zhang
console.log(person.hasOwnProperty('name')) // true
console.log('name' in person) // true

我们为构建的实例新建一个属性 job，通过 in 操作符判断后返回为 true，说明无论这个属性是在实例上还是在原型上都会被找到

function Person() {
  Person.prototype.name = 'Richard'
  Person.prototype.age = 18
}

const person = new Person()
person1.job = 'front end engineer'

console.log(person.hasOwnProperty('job')) // true
console.log('name' in person) // true