无法更新JSON值：筛选JSON数组后修改键值不生效是什么原因？

Array.prototype.filter() 方法的返回值是符合筛选条件的所有元素组成的新数组，而非单个匹配的对象。你代码中的itemVar实际是长度为1的数组[{Id: "3", ab: '34'}]，直接给数组本身添加ab属性，并不会修改到数组内部存储的目标对象，所以看起来修改不生效。

有两种常用的修复写法：

• 写法1：取filter返回数组的第一个元素

var itemVar = data.filter(item => item.Id == '3')[0];
itemVar.ab = '22';

• 写法2（更推荐）：使用Array.prototype.find()方法，该方法会直接返回第一个匹配筛选条件的元素，无需额外取下标，且匹配成功后就会停止遍历，性能更优

// 增加非空判断避免匹配不到时报错
var itemVar = data.find(item => item.Id == '3');
if (itemVar) {
  itemVar.ab = '22';
}

修改完成后打印原data数组，就能看到Id为3的对象的ab属性已经更新为22。

内容的提问来源于stack exchange，提问作者Rakesh