使用TypeScript和Object.assign给我一个错误"属性'赋值'在类型'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,因此Object接口没有assign定义.

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

target: 'es6'

或者您可以使用该方法扩展ObjectConstructor接口 assign

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

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

或者你可以强迫Object到any,而忽略它的打字:

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

无论您选择哪种方式,请记住,如果您希望在旧版浏览器上运行此功能,则需要添加polyfill.大多数现代浏览器都非常接近于实现ES2015功能集,但它们并非100%存在,这意味着如果您依赖ES2015功能,代码的某些部分仍然会失败.

Object.assign在针对ES5或更早版本时,Typescript不会进行填充,这就是您收到此错误的原因.另一方面,Babel确实有插件形式的polyfill,这意味着您需要将Babel transpilation合并到您的构建管道中,请参阅:https://babeljs.io/docs/plugins/transform-object-assign/

作为最后的选项,你可以考虑使用一个库作为Lodash或jQuery,它们有自己的实现Object.assign(被调用extend)

Answer 2

使用Typescript 2.1或更高版本,您可以使用Object spread语法.

let obj = { x: 1, y: "string" };
var newObj = {...obj, z: 3, y: 4}; // { x: number, y: number, z: number }

指定扩展操作的顺序决定了结果对象中最终的属性; 后来的点差中的属性"赢出"以前创建的属性.