假设 obj 是一个对象,并且 property 是其属性的名称。

区别

调用 obj.property = undefined 将属性的值设置为 undefined。如果我们迭代对象的属性,该属性仍然存在并出现。

let person = { name: 'John' }
person.name = undefined

person.hasOwnProperty('name') // true
name in person // true
Object.keys(person) // ['name']
for (let p in person) {
  console.log(p) // 'name'
}

delete obj.property 将从对象中删除该属性。让我们重新审视上面的示例代码,现在使用 delete person.name

let person = { name: 'John' }
delete person.name

person.hasOwnProperty('name') // false
name in person // false
Object.keys(person) // []

// 控制台中没有显示任何内容
for (let p in person) {
  console.log(p)
}

delete 不能删除继承的属性。

const car = { branch: 'Audi' }

const a4 = Object.create(car)
console.log(a4.branch) // 'Audi'

delete a4.branch
console.log(a4.branch) // 'Audi'

在这种情况下,我们必须将属性设置为 undefined

a4.branch = undefined
console.log(a4.branch) // undefined

提示

delete 不适用于数组:

const array = [1, 2, 3, 4, 5]

delete array[1]
console.log(array) // [1, empty, 3, 4, 5]

如果要从数组中删除项目,请使用 splice 方法。

const array = [1, 2, 3, 4, 5]
array.splice(2, 1)
console.log(array) // [1, 2, 4, 5]

pop 方法可以从数组中删除最后一个元素:

const array = [1, 2, 3, 4, 5]
array.pop()
console.log(array) // [1, 2, 3, 4]

我们可以使用 ES6 扩展运算符从对象中删除属性:

const { name, ...rest } = { name: 'Foo', age: 20 }

console.log(name) // 'Foo'
console.log(rest) // { age: '20' }

也可以删除动态属性:

const property = 'name'
const { [property]: value, ...rest } = { name: 'Foo', age: 20 }

console.log(value) // 'Foo'
console.log(rest) // { age: '20' }