JS根据属性值从对象数组中删除指定元素
本文介绍如何在JavaScript中根据特定属性值从对象数组中删除对应元素。通过遍历数组查找匹配项,利用splice方法移除元素,实现前端无需重新请求接口即可更新页面数据,适用于Vue等框架的数据绑定场景。
假设有一个卡片列表,需要在该列表中移除其中一项。为了优化性能,删除操作后不再重新调用获取数据的接口,而是直接在前端更新页面。例如在使用Vue时,只需修改卡片列表的模型数据,页面即可自动重新渲染。

该卡片列表的模型通常是一个对象数组,结构如[{cardid:001,cardno:"432434234"},{cardid:002,cardno:"546436"},...]。其中cardid是唯一标识,每项的值均不相同。删除操作时,便依据这一属性来定位并移除目标对象。
以下是根据属性从对象数组中删除对应对象的方法实现(此方法一次仅支持删除一个元素):
removeByValue: function(arr, attr, value) { //数组,属性,属性值
var index=0;
for(var i in arr){
if(arr[i][attr]==value){
index=i;
break;
}
}
arr.splice(index,1);
}在调用删除接口的成功回调函数中,可按如下方式调用该方法:
Util.removeByValue(that.cards,"cardid",cardId); //参数分别为:卡列表数组,属性名,被删卡的属性值
根据对象数组中某一属性的值删除包含这一属性值的对象
// 原数组
var cars = [
{type:"BMW", year:2017},
{type:"Audi", year:2019},
{type:"porsche", year:2018}
];
// 方法
function removeByValue(arr, attr, value)
{
var index=0;
for(var i in arr){
if(arr[i][attr]==value){
index=i;
break;
}
}
arr.splice(index,1);
}
removeByValue(cars,"type","BMW");
console.log(cars);箴言:因为这些东西是非常简单的。不要抱怨自己学不会,那是因为你没有足够用心。
JavaScript怎么准确判断数据类型:typeof、instanceof与Object.prototype.toString
2026-11-05 17:09:21
JS中将数组和对象混合组装为JSON字符串
2026-11-05 16:41:42
JS运算符优先级与结合性的区别是什么?
2026-11-05 13:22:02
JS Map怎么只遍历Key或Value
2026-11-05 13:00:36
D3.js 与 ECharts 选型对比:灵活性 vs 开发效率
2026-11-05 09:45:01
