javascript - 在 JavaScript 中使用解构的正确方法

Question

我从数据库中获取数据，我只需要两个数组。使用两个变量，我得到了我需要的结果，但我明白，这段代码写得不正确。甚至 npm 也写了箭头函数应该返回一些东西，所以我添加了“return false”；

let flagUrls = [];
let countryNames = [];

country.map((country, index) => {
   flagUrls[index] = country.flagUrls;
   countryNames[index] = country.countryNames;
   return false;
});

this.setState({ flagUrls, countryNames });

我试过这样的:

let flagsAndCountrys =  country.map((country, index) =>[country.flagUrls, country.countryNames])


this.setState({ 
   flagsAndCountrys.flagUrls,
   flagsAndCountrys.countryNames 
   });

Answer 1

map方法在调用数组中的每个元素上使用提供的函数的返回值创建一个新数组。
请注意上面一行中的 return 一词。您需要返回将插入到新数组中的内容。

因此，使用 map，您可以创建一个新数组，其中包含只有 flagUrls 和 countryNames 字段的对象，如下所示:

let result = country.map((country, index) => {
   return {
     flagUrl: country.flagUrls,
     countryName: country.countryNames
   }
});

如果你想维护两个 flagUrls 和 countryNames 数组，你不应该使用 map 。最好在这里使用 forEach，如下所示:

let flagUrls = [];
let countryNames = [];
country.forEach((country, index) => {
   flagUrls.push(country.flagUrls);
   countryNames.push(country.countryNames);
});

为此使用解构，将传递给提供的函数 country 的第一个参数替换为如下值:{flagUrls, countryNames}

country.forEach(({flagUrls, countryNames}, index) => {
   flagUrls.push(flagUrls);
   countryNames.push(countryNames);
});