函数参数中变量周围的花括号是什么意思 [英] What do curly braces around a variable in a function parameter mean

问题描述

我在包装上看到了以下代码:

I saw this code on a package:

const SortableList = SortableContainer(({items}) => {
 return (
     <ul>
        {items.map((value, index) =>
            <SortableItem key={`item-${index}`} index={index} value={value} />
        )}
    </ul>
 );
});

items通过在函数参数中加上花括号将发生什么情况?

What is happening to items by putting curly braces around it in the function parameters?

推荐答案

这是在破坏分配语法.

再举一个例子，以下两行代码是相等的:

As another example, the following two lines of code are equal:

const { items } = args

const items = args.items

简而言之，它是访问给定变量的特定字段以在该范围中进一步使用的简化方法.

Simply put, it is a simplified way of accessing specific field of a given variable for further use in that scope.

在您的原始示例中，它声明了一个变量items，供在函数主体中使用，该变量是该第一个参数的items字段.

In your original example, it is declaring a variable items for use in the function body that is the items field of that first argument.

const SortableList = SortableContainer(({items}) => {
    // do stuff with items here

等于

const SortableList = SortableContainer((input) => {
    const items = input.items
    // do stuff with items here

这篇关于函数参数中变量周围的花括号是什么意思的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！