将文字对象转换为特定类'；javascript中的对象

我想将对象文字列表从JSON文件转换为javascript中的特定类对象列表，我尝试过但未能实现，有人知道如何在ES5/ES6中实现这一点吗，因为我在angular 2中尝试了这一点：

这是我的JSON文件：

{"list":[
    {"name":"ABC", "cost":200},
    {"name":"LMN", "cost":100},
    {"name":"POP", "cost":200},
    {"name":"OEE", "cost":560},
    {"name":"WWO", "cost":450},
    {"name":"ERR", "cost":150},
    {"name":"OWE", "cost":250}
]}

产品类别：

export class Product{
static newId:number = 0;

constructor(public name: string = "", public cost: number = 0,public id: number = 0){
    this.id = ++Product.newId;
}};

这里，“list”数组包含类型为object的对象文本列表，我只想将它们全部转换为类型为“porduce”

以下是我想做的：

this.appService.getProductList().subscribe(
    data => this.productList = data.list,
    error => console.error("error"),
    () => console.log("GET done.")
  );

---

这里，“appService”是http服务，“getProductList（）”是服务方法返回observable，而“this.productList”是一个数组，我想用Product类型的对象填充这个数组，这个对象非常简单。请帮帮我。

我想这就是你想要的：

  this.appService.getProductList().subscribe(
    data => this.productList = data.list.map(item => new Product(item.name, item.cost)); 
    error => console.error("error"),
    () => console.log("GET done.")
  );

---

我想这就是你想要的：

  this.appService.getProductList().subscribe(
    data => this.productList = data.list.map(item => new Product(item.name, item.cost)); 
    error => console.error("error"),
    () => console.log("GET done.")
  );

---

在

.map

调用中的

getProductList（）

中，只需将其转换为“真实”产品：

---

我不会在

subscribe

中这样做，因为作为

getProductList（）

的消费者，我会假设实际上已经获得了产品，而不仅仅是JS对象。消费者不需要知道任何有关实现细节的信息。

在

getProductList（）

调用中的

.map

只需将其转换为“真正的”产品：

this.appService.getProductList().subscribe(
    data => this.productList = data.list.map( (listItem) => new Product(listItem),
    error => console.error("error"),
    () => console.log("GET done.")
  );

---

我不会在

subscribe

中这样做，因为作为

getProductList（）

的消费者，我会假设实际上已经获得了产品，而不仅仅是JS对象。消费者不需要知道有关实施细节的任何信息。

回答晚了，但想添加一个方面：

this.appService.getProductList().subscribe(
    data => this.productList = data.list.map( (listItem) => new Product(listItem),
    error => console.error("error"),
    () => console.log("GET done.")
  );

虽然在大多数情况下，使用旧对象作为参数创建新对象肯定是最好和最安全的，但也可以修改现有对象的原型，从而有效地将一个简单的

{“name”：“ABC”，“cost”：200}

变成

产品

例如：

class Greeter {
  constructor(public name: string) {
  }

  hello() {
    console.log(`Hello ${this.name}!`);
  }
}

const obj = {name: 'World'}; // Normal object literal which is not a Greeter instance

obj.hello(); // Error
Object.setPrototypeOf(obj, Greeter.prototype); // Now obj is a Greeter instance
obj.hello(); // Prints 'Hello world!'

如果使用TypeScript，您还必须在之后将

obj

转换为

Greeter

，或者使用

Object.setPrototypeOf

返回使用给定原型键入的给定对象：

Object.setPrototypeOf(obj, Greeter.prototype); 
const greeter = obj as Greeter;

或者更简单一点：

const greeter = Object.setPrototypeOf(obj, Greeter.prototype); 

现在，

obj

是一个

Greeter

实例（但类型仍然是

{name:string}

，因此您不能执行

obj.hello（）

），但是

Greeter

是类型

Greeter

> obj.hello();
error TS2339: Property 'hello' does not exist on type '{ name: string; }'

> greeter.hello();
Hello World!

---

显然，这可能会有风险，因此必须小心操作，因为您断言一个不是用

Greeter

的构造函数创建的对象是具有相同属性等的兼容对象。因此在大多数情况下，这可能是应该避免的，但绝对是可能的。

回答晚了，但希望添加一个方面：

虽然在大多数情况下，使用旧对象作为参数创建新对象肯定是最好和最安全的，但也可以修改现有对象的原型，从而有效地将一个简单的

{“name”：“ABC”，“cost”：200}

变成

产品

例如：

class Greeter {
  constructor(public name: string) {
  }

  hello() {
    console.log(`Hello ${this.name}!`);
  }
}

const obj = {name: 'World'}; // Normal object literal which is not a Greeter instance

obj.hello(); // Error
Object.setPrototypeOf(obj, Greeter.prototype); // Now obj is a Greeter instance
obj.hello(); // Prints 'Hello world!'

如果使用TypeScript，您还必须在之后将

obj

转换为

Greeter

，或者使用

Object.setPrototypeOf

返回使用给定原型键入的给定对象：

Object.setPrototypeOf(obj, Greeter.prototype); 
const greeter = obj as Greeter;

或者更简单一点：

const greeter = Object.setPrototypeOf(obj, Greeter.prototype); 

现在，

obj

是一个

Greeter

实例（但类型仍然是

{name:string}

，因此您不能执行

obj.hello（）

），但是

Greeter

是类型

Greeter

> obj.hello();
error TS2339: Property 'hello' does not exist on type '{ name: string; }'

> greeter.hello();
Hello World!

---

显然，这可能会有风险，因此必须小心操作，因为您认为不是使用

Greeter

的构造函数创建的对象是具有相同属性等的兼容对象。因此，在大多数情况下，这可能是可以避免的，但这绝对是可能的。

谢谢您的回答，我有一个疑问，在这个例子中，我使用了其他的角度分量，我使用的方式如下：private model:Product=new Product（）；但是我不能得到当前的产品id，因为它不是asyc，我该怎么做才能得到当前的产品id。我真的不明白这个问题。你想实现什么？

{{product.name}}

这里我使用输入comp组件，在该组件中我再次创建一个变量，如：`private model:product=new product（）；`但是如果我跟踪model.id得到“1”，我希望当前的id在本例中是“8”。好吧，这个组件在您的

getProductList（）

返回之前创建了它的产品，这就是为什么它得到

id

1。这意味着我需要异步行为来实现这一点，非常感谢。感谢这个答案，我有一个疑问，在这个例子中，我使用了其他的角度分量，我使用的方式如下：private model:Product=new Product（）；但是我不能得到当前的产品id，因为它不是asyc，我该怎么做才能得到当前的产品id。我真的不明白这个问题。你想实现什么？

{{product.name}}

这里我使用输入comp组件，在该组件中我再次创建一个变量，如：`private model:product=new product（）；`但是如果我跟踪model.id得到“1”，我希望当前的id在本例中是“8”。这个组件在

getProductList（）

返回之前创建了它的产品，这就是为什么它得到

id

1。这意味着我需要异步行为来实现这一点，非常感谢。@Günter Zöchbauer，谢谢，我真的很感激你的帮助replay@Günter Zöchbauer，谢谢，我真的很感谢你的重播