【问题标题】:How can I do object destructuring with condition?如何使用条件进行对象解构?
【发布时间】:2019-04-06 16:34:12
【问题描述】:

所以我有:

// some function that returns two arrays ..
getArrays() {
  return {
    arr1: [...],
    arr2: [...]
  };
}

// and then ..
let arr1 = [];
let arr2 = [];
if (someCondition) {
  { arr1, arr2 } = getArrays();
}

// here we expect arrays, even if they are empty ..

当然,这会引发错误。 这甚至可能吗?

PS:我可以使用默认值并直接调用该函数,但仍然 - 我认为应该可以。

【问题讨论】:

  • 只需添加括号

标签: javascript ecmascript-6 destructuring


【解决方案1】:

一种解决方案是将解构表达式用括号括起来:

// some function that returns two arrays ..
function getArrays() {
  return {
    arr1: [1],
    arr2: [2]
  };
}
const someCondition = true;
let arr1 = [];
let arr2 = [];

if (someCondition) {
  ({ arr1, arr2 } = getArrays());
}

console.log(arr1, arr2);

另一种解决方案是将条件移动到getArrays()函数中,如果条件为false,则返回两个空数组:

const getArrays = (condition) =>
  condition ? 
    { arr1: [1], arr2: [2] }
    :
    { arr1: [], arr2: [] };

const someCondition = true;
const { arr1, arr2 } = getArrays(someCondition);

console.log(arr1, arr2);

你也可以在函数外使用条件和三元:

const getArrays = () => ({ arr1: [1], arr2: [2] });

const someCondition = true;
const { arr1, arr2 } = someCondition ? getArrays() : { arr1: [], arr2: [] };

console.log(arr1, arr2);

【讨论】:

  • 第一个解决方案完全是我想要的 :) ... 因为我不想用更多的代码使函数膨胀,而且 - 不同地方的条件不一样我正在使用这个。谢谢:)
  • 欢迎您 :) 我添加了另一个以在函数外使用条件。
  • 你好,只是为了理解这个方法,这样做的用例是什么? getArrays() 返回一个包含 2 个数组的对象。你可以很容易地声明一个对象让我们说'let arrays'然后使用函数'arrays = getArrays();'然后像“console.log(arrays.arrr1)”和“console.log(arrays.arrr1)”一样使用它。因为是我第一次看到你的方法,你能解释一下这在哪些情况下有用吗?
  • 这称为解构。当您想将数组/对象的一部分分配给一个或多个变量时,您可以使用它。您应该阅读有关Destructuring assignment on MDN 的更多信息。
猜你喜欢
  • 1970-01-01
  • 2020-06-16
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2016-04-19
  • 2019-09-18
  • 2020-08-28
  • 1970-01-01
相关资源
最近更新 更多