Javascript 将响应映射到可预测对象

我希望能够将fetch响应映射到某种程度上可预测的响应类型，但我不确定如何做到这一点。如果键存在，我想将响应值映射到它

我同意回答中不一定存在字段。 我只想映射可以通过键映射到值的字段

如果您使用过TypeScript，那么我要查找的基本上等于

const article: ArticleResponseBody = fetch(``)
//           ^ this right here   ^
// Now when I do article. 
//                      ^  I get statically evaluated autocompletion.

代码：

端点输出的数据将共享articleResponseBody中的一些键。i、 e

[
  {
    accessRestriction: "none",
    bylines: "",
    layout: "standard",
    title: "test",
    image: {
      author: "dtest",
      captionHtml: "dtest",
      width: 974,
      height: 548,
      id: "",
      imageType: "",
      type: "image",
      url:  "://"
    },
    publicationTime: "2021-03-24T15:05:47.765+01:00",
    sectionPath: "test0",
    targetLink: {
      url: "://"
    },
    readingTime: "",
    id: "test",
    vignette: "",
    text: "",
    tags: "",
    updateTime: null
  }
]

可以使用从对象和嵌套对象中提取要保留/放弃的属性，然后使用（

…

）使用要保留的属性构建新对象：

const-articlesponsebody=（响应）=>{
常数[{
id，//要删除的密钥
标签，
更新时间，
image:{url}={}，//要保留的键
…rest//上面未列出的所有其他对象属性
}={}]=响应；
返回{…rest，图像：{url}；
}
const articleData=[{accessRestriction:“none”，署名：，“layout:“standard”，标题：“test”，图像：{作者：“dtest”，标题HTML:“dtest”，宽度：974，高度：548，id:，图像类型：，类型：“image”，url:：/”}，发布时间：“2021-03-24T15:05:47.765+01:00”，节路径：“test0”，目标链接：{url:：/”，读取时间：，id:“测试”，vignette:，文本：，标记：，updateTime:null}]
console.log（articlesponsebody（articleData））；

也许您想执行类似于

返回response.map（obj=>（{accessRestriction:obj.accessRestriction，etc…}）的操作

？@NickParsons很好，基本上我猜是这样。但是，如果我不必键入赋值，而是通过隐式对象销毁来赋值，那就更好了。在TypeScript中，你只需执行

const response:article response

，我就可以得到我想要的，但因为这不是一个选项，我必须以不同的方式来做您可以使用解构使其更简洁，我添加了一个答案来说明如何使用hanks，但我只想保留const{id，title，etc}中的字段。当我写

文章时，它也没有给我任何智能感。

。不确定如何静态地推断这些道具是否会存在。这有点难以解释，但本质上，我想要typescript的

类型

功能。即

const-article:article-response=wait-fetch（…）

Hm，我以前确实不需要配置intellisense，所以我对这一部分不太确定。也许可以考虑在函数上方添加jsdoc注释……我的意思是，应该静态推断返回的对象将具有这些键。例如，

const example={a:1，b:2}

。如果我接着做

示例。

我会看到

a

和

b

。是的，我会猜到它应该以类似于您的示例的方式工作。当我在codesandbox中尝试它时，它能够推断出所有潜在的属性（因此那些被排除的属性，例如

id

仍然是apear）。使用JSDoc，您可以让事情更清楚：

[
  {
    accessRestriction: "none",
    bylines: "",
    layout: "standard",
    title: "test",
    image: {
      author: "dtest",
      captionHtml: "dtest",
      width: 974,
      height: 548,
      id: "",
      imageType: "",
      type: "image",
      url:  "://"
    },
    publicationTime: "2021-03-24T15:05:47.765+01:00",
    sectionPath: "test0",
    targetLink: {
      url: "://"
    },
    readingTime: "",
    id: "test",
    vignette: "",
    text: "",
    tags: "",
    updateTime: null
  }
]