javascript - array.map的参数中方括号是做什么用的？

Question

不确定 .map(([key, value]) => [key, value * 2]) 我对方括号在该参数中的作用有一个要点.但是有人可以阐明语法规则，或者解释发生了什么吗？

以下是我对代码工作原理的看法:

1. Object.entries 将对象价格转换为数组。返回类似于 [[banana, 1], [orange, 2], [meat, 4]]
2. map 是一个数组方法，该函数将每件商品的价格加倍。
3. 然后 chagnes 被重新转换回对象。

如果 map 正在遍历项目；编写 .map((item) => [item[0], item[1] * 2])

会更有意义吗

正在学习来自 javascript.info 的类(class)

let prices = {
  banana: 1,
  orange: 2,
  meat: 4,
};

let doublePrices = Object.fromEntries(
  // convert to array, map, and then fromEntries gives back the object
  Object.entries(prices).map(([key, value]) => [key, value * 2])
);

console.log(doublePrices.meat); // 8

Answer 1

在您询问的代码片段中，左侧与右侧完全不同。让我们分解一下:

.map(([key, value]) => [key, value * 2])

首先，map 接受一个函数作为它的参数。这里的函数本质上是这样做的:

(entry) => { 
  const key = entry[0];
  const value = entry[1];
  const modified_entry = [ key, value * 2 ];
  return modified_entry; 
}

一种较短的写法是:

(entry) => [ entry[0], entry[1] * 2 ]

它的工作原理是一样的，因为函数体周围没有花括号，它使用值作为返回值。

现在您询问的代码没有使用单个变量作为函数的输入参数。它是单个参数，但它通过使用称为解构 或解构 的东西设置了 2 个变量。这是 Javascript 中的一项功能，可让您以简单的方式将对象分解为多个变量。例如看这个:

var entry = [ 'meat', 1]
var [ item, price ] = entry
// now item is 'meat', and price is 1, which is nicer than having to do this:
item = entry[0]
price = entry[1]

所以回到你的代码，他们将 entry 表示为 [key,value] 以便他们可以在函数中轻松使用，并且在右边=> 的手边我们有返回值，它是一个价格翻倍的新数组。

请记住，在左侧我们将一个对象分解为新的变量，这些变量会被分配值，而在右侧我们正在创建一个新的数组对象并返回。这可能有点令人困惑，因为它们都具有相同的形式，看起来像方括号中的数组。

另请注意，解构适用于对象和数组，因此这也是有效的代码:

var obj = { a:1, b:2, c:3 }
var { a, c } = obj
console.log(a,c)  // will print "1 3"

解构一个对象可以让你只从对象中取出你想要的部分，并创建以键命名的变量。请注意，我们没有请求 b，因此没有 b 变量 - 它只是被忽略了。