JavaScript 解构理解的问题

Question

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

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

Answer 1

当你这样做时

datalist: { xxx },

您告诉 JS 将 datalist 的 xxx 属性放入名为 xxx 的独立变量中。但是[1, 2, 3, 4] 数组上不存在xxx 属性。

如果代码是这样的就可以了：

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);