javascript - 使用 TypeScript 和 Object.assign 给我一个错误 "property ' assign' does not exist on type 'ObjectConstructor' "

Question

我正在重新写我的问题，因为之前它没有什么意义，而且我不是很清楚。

我从 API 接收的数据看起来像这样:

{"photos":[{"id":1,"title":"photo_1_title"}]}

因此，在我的代码中，我有一个 photos 变量和一个名为 getPhotos() 的方法

我正在使用无限滚动，所以当我到达页面底部时，我再次调用 getPhotos()。

photos: any;

getPhotos() {
  this.photoService.getPhotos()
    .subscribe(
      photos => this.photos = photos
      // here, instead of doing this, I want to add the array of photos I get back to this.photos using Object.assign however it is giving me the said error
    )
}

所以如果下次我调用它时，我返回 {"photos":[{"id":2,"title":"photo_2_title"}]}，那么我正在尝试将 this.photos 设置为

{"photos":[{"id":1,"title":"photo_1_title"}, {"id":2,"title":"photo_2_title"}]}

谁能帮我解释一下原因
jsfiddle.net/ca46hLw9 不起作用？我认为 assign 应该将对象的内容合并在一起，对吗？

Answer 1

Object.assign是 ECMAScript2015 功能，在 ECMAScript5 及更低版本中不存在。

您的目标很可能是为 ECMAScript5 编译您的 Typescript，因此对象接口(interface)没有 assign定义。

您可以通过更改 TS 编译器配置来定位 ECMAScript2015

target: 'es6'

或者您可以使用 assign 方法扩展 ObjectConstructor 接口(interface)

declare interface ObjectConstructor {
    assign(...objects: Object[]): Object;
}

(你可以在任何地方添加这个声明，重新声明一个接口(interface)扩展它而不是覆盖它)

或者你可以强制Object至 any并忽略它的类型:

(<any>Object).assign( this.photos, photos )

无论您选择哪种方式，请记住，如果您希望它在旧版浏览器上运行，您需要添加一个 polyfill。大多数现代浏览器都相当接近实现 ES2015 功能集，但它们并不是 100% 实现了，这意味着如果您依赖 ES2015 功能，您的代码的某些部分仍然会失败。

Typescript 不会 polyfill Object.assign当以 ES5 或更早版本为目标时，这就是您收到此错误的原因。另一方面，Babel 确实有插件形式的 polyfill，这意味着您需要将 Babel 转译合并到您的构建管道中，请参阅:https://babeljs.io/docs/plugins/transform-object-assign/

作为最后一个选项，您可以考虑使用像 Lodash 或 jQuery 这样的库，它们有自己的 Object.assign 实现。 (称为 extend)