# 1、Object.hasOwn

使用 Object.hasOwn 代替 in 操作符

• 常见我们想知道对象上是否存在某个属性，一般会使用 in 操作符或 obj.hasOwnProperty，但是两者都有缺陷
  1. in: 能找到自身属性和原型链上的，返回值为 bool

     const Person = function (age) {
         this.age = age
     }
     Person.prototype.name = 'tmc'
     const p1 = new Person(26)
     console.log('age' in p1) // true 
     console.log('name' in p1) // true  注意这里
     

  2. obj.hasOwnProperty: 只能找自身属性，不能找原型链上的，返回值为 bool

     const Person = function (age) {
         this.age = age
     }
     Person.prototype.name = 'tmc'
     
     const p1 = new Person(26)
     console.log(p1.hasOwnProperty('age')) // true 
     console.log(p1.hasOwnProperty('name')) // false  注意这里
     

     注意：虽然可以过滤掉原型链上的属性，但在某些情况下，它还是不安全。

     Object.create(null).hasOwnProperty('name') // Uncaught TypeError: Object.create(...).hasOwnProperty is not a function
     

  3. Object.hasOwn: 查找对象上某个属性是否存在，只找自身属性，不找原型链上。（解决两者的问题, 更安全和方便）

     let object = { age: 24 }
     Object.hasOwn(object, 'age') // true
     let object2 = Object.create({ age: 24 })
     Object.hasOwn(object2, 'age') // false  
     let object3 = Object.create(null)
     Object.hasOwn(object3, 'age') // false 
     

# 2、使用?.简化&&和三元运算符

~~~js
const obj = null
console.log(obj && obj.name)
const $title = document.querySelector('.title')
const title = $title ? title.innerText : undefined
// 简化后
const obj = null
console.log(obj?.name)
const $title = document.querySelector('.title')
const title = $title?.innerText
~~~

• 一般用法：
  1. obj?.prop 对象属性
  2. obj?.[prop] 对象属性
  3. func?.(...args) 执行函数