如何将arrayOfObjects的num字段匹配添加到API响应数据中？

你原代码的问题 #

• 语法错误：item.arrayOfObjects.map(innerItem => innerItem) = num 这种写法完全不符合JS语法，而且API返回的用户对象本身并没有arrayOfObjects属性
• 逻辑错误：没有实现将arrayOfObjects里的num按顺序和每个用户对象合并的目标

正确实现代码 #

因为API返回的用户数组和你的arrayOfObjects长度都是10，顺序一一对应，直接用map的索引就能匹配：

const url = "https://jsonplaceholder.typicode.com/users";

useEffect(() => {       
  const arrayOfObjects = [
     {num:1},
     {num:2},
     {num:3},
     {num:4},
     {num:5},
     {num:6},
     {num:7},
     {num:8},
     {num:9},
     {num:10},
  ];

  axios(url).then((res) => {
    const newData = res.data.map((user, index) => {
      // 合并原用户对象和对应的num字段
      return {...user, num: arrayOfObjects[index].num};
    });
    console.log(newData);
  });
}, []);

补充优化（处理数组长度不一致的情况） #

如果担心API返回的用户数量和arrayOfObjects长度不匹配，可以加个判断避免索引越界：

const newData = res.data.map((user, index) => {
  const numObj = arrayOfObjects[index];
  // 有对应num就添加，没有则设为默认值（比如null）
  return {...user, num: numObj ? numObj.num : null};
});

这样处理后，每个用户对象都会按顺序带上对应的num字段，完全符合你期望的格式。

内容的提问来源于stack exchange，提问作者Rio