访问对象内部的数组答案

【问题标题】：Access Array Inside Object访问对象内部的数组
【发布时间】：2020-10-23 14:01:23
【问题描述】：

我有一个 javascript 对象，我想通过它的一个属性进行映射，该属性是一个数组。但是由于某种原因，当我通过它进行映射甚至在我知道是数组的属性上调用 .length 时，它会将属性视为不是数组。

对象正在从异步对象中的 axios get 请求创建。

useEffect(() => {

   async function fetchData() {
            const dummyData = await axios.get(
                'http://localhost:3000/data',
            );
            dummyData.data.videos.map(video => {
                return (
                    setCurrentEdition(video.currentEdition[0])
                );
            });
        }
        fetchArtPiece();
        return () => console.log('clean artPiece detail page');
    }, []);

currentEdition: {
  videoAssociated: {id: "oYu5J4TQbJ728c45ExWopZicY9LrCxNNTEZ3"}
  bids: []
  id: "Kr3fjeo51"
  owners: (2) [{…}, {…}]
}

我现在要做的就是 .map() ，它会抛出一个未定义的错误

currentEdition.owners.map(owners => console.log(owners))

即使当我检查 currentEdition.owners.length 时，它也会抛出一个未定义的错误，当我记录 currentEdition.owners 时，proto: 是一个数组，它有方括号和所有内容，所以为什么当我不将其视为数组时尝试对其进行操作？

谢谢

【问题讨论】：

对象是动态加载的吗？我认为我们需要查看更多代码。
Array.isArray(currentEdition.owners) 返回什么？它可能只是一个类似数组的对象，或者它正在运行时被修改。
展示你是如何创建对象的。我怀疑它是异步创建的，您正在尝试在填充之前访问该属性。
要检查您正在记录的内容在您登录时而不是将来确实存在，请不要console.log(currentEdition)，而是console.log(JSON.stringify(currentEdition, null, 2))
“感谢您的快速响应，我正在异步创建对象” 比您在送至您家之前尝试吃披萨更好。

标签： javascript arrays object array.prototype.map

【解决方案1】：

好吧，既然您正在处理异步数据，您应该始终确保您拥有数据，然后开始使用它。

因此，要解决此问题，您需要为您的 JSX 创建一个条件，如下所示：

<Grid item xs={7}> {Array.isArray(currentEdition?.owners) && console.log(currentEdition.owners.length)} </Grid>

【讨论】：