delete 和 Vue.delete 删除数组的区别

91 阅读1分钟

一、是什么

delete 是 ES6 中的一个语法关键字,用于删除对象的属性。而 Vue.delete() 是 Vue.js 框架提供的一个方法,用于删除数组或对象的元素。

二、两者相同之处:

delete和Vue.delete都是对数组或对象进行删除的方法。这两种方法对于对象来说其实是没有区别的,使用方法会直接删除对象的属性(物理删除),如下代码示例👇:

let obj = { name: 'zs', age: 12 }
Vue.delete(obj, 'name'); //输出obj为👉{age: 12}
delete obj.name; //输出obj为👉{age: 12}

三、两者不同之处:

Vue.delete() 主要是为了保证可以正确地触发视图更新,而普通的 delete 只能用于删除对象属性,并且不能保证可以正确地触发视图更新。 这两个方法对于删除数组是有区别的,如下代码示例👇:

let arr = [1, 2, 3, 4, 5]
delete arr[2] //输出arr为👉[1, 2, empty, 4, 5]
Vue.delete(arr, 2) //输出arr为👉[1, 2, 4, 5]

总结:delete只是被删除的元素变成了empty/undefined,其他的元素的键值还是不变。数组长度也不变。而Vue.delete直接删除了数组,改变了数组的键值,长度发生变化。