JavaScript array.map总是返回最后一项

Question

我有一个对象数组，对象如下所示：

interface IDog{
id: number;
name: string;
summary: string;
wikiLink: string;
imageLink: string;
imageAlt: string;
}

我有这个功能：

private processDog(dogs: IDog[]) {
return dogs.map((dog) => {
let displayCard = this.dogDisplay;
find(displayCard.body, { id: "cardHeader" }).items[0].text = dog.name;
let adaptiveCard = CardFactory.adaptiveCard(displayCard);
let preview = this.dogPreview;
preview.content.title = dog.name;

return { ...adaptiveCard, preview };
});
}

现在，当我调用这个函数，传递一个Dogs数组时，让我们说[DogA，DogB，DogC，DogD]

let att = this.processDog(dogs);

我希望根据需要返回一组经过处理的狗，但返回的是一组4只DogD类型的经过处理的小狗。。这意味着DogD正在跟踪返回数组中的所有其他狗。我做错了什么？

完整代码：

//First method
public async onQuery(
context: TurnContext,
query: MessagingExtensionQuery
): Promise<MessagingExtensionResult> {

const dogs: any = require("./dogs.json");
let att = this.processdog(dogs);
console.log(att);
return Promise.resolve({
type: "result",
attachmentLayout: "list",
attachments: att, // [{ ...adaptiveCard, preview: defaultPreview }],
} as MessagingExtensionResult);
}
//second method
private processdog(dogs: Idog[]) {
return dogs.map((dog) => {
let displayCard = Object.assign({}, this.dogDisplayCard);
find(displayCard.body, { id: "cardHeader" }).items[0].text = dog.name;
find(displayCard.body, { id: "cardBody" }).items[0].text = dog.summary;
find(displayCard.body, {
id: "cardBody",
}).items[1].columns[0].items[0].url = dog.imageLink;
find(displayCard.body, { id: "cardBody" }).items[2].text = dog.imageAlt;
displayCard.actions[0].url = dog.wikiLink;
let adaptiveCard = CardFactory.adaptiveCard(displayCard);
let preview = Object.assign({}, this.dogPreviewCard);
preview.content.title = dog.name;
preview.content.text = dog.imageAlt;
preview.content.images[0].url = dog.imageLink;
return { ...adaptiveCard, preview };
});
}

dogPreview.json:

{
"contentType": "application/vnd.microsoft.card.thumbnail",
"content": {
"title": "",
"text": "",
"images": [
{
"url": ""
}
]
}
}

Answer 1

您需要像这样创建对象的深度副本

...
let displayCard = JSON.parse(JSON.stringify(this.dogDisplayCard));
...
let preview = JSON.parse(JSON.stringify(this.dogPreviewCard));
...

否则，您将使用后面的线来更改原始对象。{ ...adaptiveCard, preview }将包含对原始对象的引用，因此将在原始对象引用时更新。因此，您必须确保使用的是对象的新副本，该副本没有对原始对象的任何引用。