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

Cshaosun

已于 2024-07-31 09:52:19 修改

阅读量234

点赞数 1

分类专栏： # VUE web前端文章标签： vue.js javascript 前端

于 2024-04-10 15:31:53 首次发布

本文链接：https://blog.csdn.net/Cshaosun/article/details/137598690

版权

39 篇文章 0 订阅

订阅专栏

20 篇文章 0 订阅

订阅专栏

本文比较了JavaScript原生的delete操作符与Vue框架中Vue.delete在删除数组元素时的行为差异。delete只改变元素值为undefined，不影响其他元素，不触发响应式更新；而Vue.delete会删除元素、改变数组结构，并触发Vue的响应式更新。

摘要由CSDN通过智能技术生成

delete是js中原生的操作符，当用 delete 删除数组中的元素时，它只是被删除的元素变成了 empty/undefined 其他的元素的键值还是不变。即不会改变数组的长度。被删除的元素位置会被保留为一个空洞，即数组的索引位置仍然存在，但对应的元素值为 undefined。

let array = [1, 2, 3, 4];
delete array[2]; 				// 展示的结果：array = [1, 2, undefined, 4]

Vue.delete是 Vue框架提供的一个全局方法，用于删除 Vue 响应式对象【数组和对象】中的属性或数组元素。
Vue.delete 直接删除了数组改变了数组的键值；并且会触发Vue 的响应式更新机制，确保删除操作能够被 Vue 监测到并更新视图。

import Vue from 'vue';
 
let array = [1, 2, 3, 4];
Vue.delete(array, 2);	 		// 展示结果：array = [1, 2, 4]

注：当需要删除 Vue 响应式数组中的元素时，应该优先使用 Vue.delete 方法。

Cshaosun

关注

专栏目录