首页 > 解决方案 > JavaScript 解构理解的问题

问题描述

我希望从下面的 JavaScript 中我会得到 [1,2,3,4] 但我没有定义。

const {
  speakers: {
    datalist: { xxx },
  },
} = {
  speakers: {
    datalist: [1, 2, 3, 4],
  },
};
console.log(xxx);

标签: javascriptecmascript-6destructuring

解决方案


当你这样做

datalist: { xxx },

您是在告诉 JS 将 的xxx属性datalist放入一个名为xxx. 但是数组xxx上不存在任何属性。[1, 2, 3, 4]

如果代码是这样的,它会起作用:

const {
  speakers: {
    datalist: { xxx },
  },
} = {
  speakers: {
    datalist: {
      xxx: [1, 2, 3, 4],
    }
  },
};
console.log(xxx);

或者:

const {
  speakers: {
    datalist
  },
} = {
  speakers: {
    datalist: [1, 2, 3, 4],
  },
};
console.log(datalist);

但是这种嵌套的解构是非常难以阅读的。考虑避免它,以免出现此类问题:

const obj ={
  speakers: {
    datalist: [1, 2, 3, 4],
  },
};
const { datalist } = obj.speakers;
console.log(datalist);


推荐阅读