前言
关于 JS 删除数组中指定的对象或某一项的话题,它是在实际开发中经常会遇到的问题,也是需要掌握的基本技能。在这篇文章中,我们将深入探讨如何使用 JS 来删除数组中指定的对象或者删除数组中某一项。
删除数组中指定的对象
下拉框组件
<div>
<el-select v-model="shztModel" clearable placeholder="请选择审核状态">
<el-option v-for="item in optionsAudit" :key="item.value" :label="item.label" :value="item.value"></el-option>
</el-select>
</div>
data
data() {
return {
optionsAudit: [],
shztModel: "",
};
},
模拟接口数据
let params = [
{
value: "0",
label: "初审通过",
},
{
value: "1",
label: "初审不通过",
},
{
value: "2",
label: "未上报",
},
{
value: "3",
label: "复审通过",
},
{
value: "4",
label: "复审不通过",
},
];
方法一(直接循环处理)
代码实例
mounted() {
params.map((item, index) => {
if (item.value == "2") {
params.splice(index, 1);
this.optionsAudit = params;
}
});
},
方法二 indexOf()
indexOf()
方法可以返回某个指定的字符串值在字符串中首次出现的位置,如果没有找到匹配的字符串则返回 -1
。
代码实例
mounted() {
params.map((item, index) => {
if (item.value.indexOf("2") > -1) {
params.splice(index, 1);
this.optionsAudit = params;
}
});
},
方法三(逆序遍历)
至于为什么要选择逆序遍历是因为因为删除元素使用正序循环遍历的话会引起后序元素移位导致漏掉。
代码实例
mounted() {
for (let i = params.length - 1; i >= 0; i--) {
if (params[i].value == "2") {
params.splice(i, 1);
this.optionsAudit = params;
}
}
},
实现效果
![在这里插入图片描述](https://img-blog.csdnimg.cn/677979dd781944cf94510787a76ca80b.gif#pic_center)
删除数组中指定的项
方法一 filter()
filter()
方法通过检查指定数组中符合条件的所有元素,filter()
方法不会改变原始数组。
代码实例
let arrList = ["周一", "周二", "周三", "周四", "周五"];
arrList = arrList.filter((item) => item != "周三");
console.log(arrList);
方法二 indexOf()
代码实例
let arrList = ["周一", "周二", "周三", "周四", "周五"];
let index = arrList.indexOf("周三");
if (index > -1) {
arrList.splice(index, 1);
console.log(arrList);
}
方法三(逆序遍历)
代码实例
let arrList = ["周一", "周二", "周三", "周四", "周五"];
for (let i = arrList.length - 1; i >= 0; i--) {
if (arrList[i] == "周三") {
arrList.splice(i, 1);
console.log(arrList);
}
}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)