Angular中向数组添加新对象值失败，报错Property 'includes'不存在的解决方法求助

算力阿峰

2026-4-27

解决数组添加对象时的两个问题：编译错误与存在性判断

1. 先搞定`Property 'includes' does not exist on type`编译错误

你遇到的这个错误是因为Array.prototype.includes是ES2016（ES7）新增的API，而你的TypeScript配置里没有包含对应的库文件。解决方法很简单：

打开你的tsconfig.json文件，找到compilerOptions下的lib数组，确保里面包含"es2016"或者更高版本（比如"es2020"）。修改后的配置大概是这样：

{
  "compilerOptions": {
    // 其他配置...
    "lib": ["es2016", "dom"]
  }
}

保存后重启TypeScript服务，这个编译错误就会消失了。

2. 修正对象存在性判断的逻辑问题

不过这里要提醒你：就算解决了编译错误，用this.arr.includes(this.a)来判断对象是否存在，大概率不是你想要的结果。因为对象是引用类型，includes用的是严格相等（===）来比较，只有当this.a和数组里的某个对象是同一个内存引用时，才会返回true。

比如如果你的数组里已经有一个和this.a内容完全一样但不是同一个对象的元素，includes会认为它不存在，然后重复添加。

如果你的需求是根据id来判断对象是否已经存在（比如两个对象id相同就算重复），应该用Array.prototype.some()方法来替代：

修改你的addVala方法：

addVala() {
  // 根据id判断是否已存在
  const isExists = this.arr.some(item => item.id === this.a.id);
  if (isExists) {
    console.log('This obj already there');
  } else {
    this.arr.push(this.a);
  }
  console.log(this.arr);
}

这样就能正确根据id来判断对象是否已经在数组里了。