JavaScript: 当数组为空时解构对象数组时出错

Question

解决这种情况的最干净的方法是什么？

考虑到我有一个对象数组：

let originalArray = [{
  personName: 'Ben'
}];

我可以这样解构：

const [{
  personName: name
}] = originalArray;

console.log(name); // "Ben"

但是，如果 originalArray 为空...

let originalArray = [];

const [{
  personName: name
}] = originalArray;

我收到这个错误

Uncaught TypeError: Cannot destructure property `personName` of 'undefined' or 'null'

我发现了一些 articles/docs 解释了在仅解构一个对象时如何处理错误，但如果它是一个对象数组，并且该数组为空，则不会。

Answer 1

您可以为未定义的属性设置默认值

const [{
  personName: name = ''
} = {}] = originalArray;

console.log(name); // ""

Answer 2

您可以设置一个默认值

var [{ personName: name = 'default' } = {}] = [{ personName: 'Ben' }];
console.log(name);

var [{ personName: name = 'default' } = {}] = [];
console.log(name);

Answer 3

你应该这样声明数组。所以默认情况下它将是一个空的对象数组。否则会抛出那个错误。

let originalArray = [{}];

如果您知道您将拥有多少属性，您也可以声明一个默认值。

let originalArray = [];

const [{
 personName: name = 'ben',
 personAge: age = '23'
} = {}] = originalArray;

console.log(name); // "Ben"
console.log(age); // "23"

JavaScript: 当数组为空时解构对象数组时出错

JavaScript: Error when destructuring an array of objects when the array is empty

javascript

destructuring