`var { ... } = ...` 语句中的大括号有什么用？

解构赋值允许我们将数组或对象的属性赋值给一堆变量，这些变量有时非常方便和简短。考虑下图。下面提到的两种方法都是正确的，并且产生相同的结果。

• 没有解构：

  var array = [1, 20, 40];
  
  var first = array[0]
  var second = array[1]
  var third = arr[2]
  

• 解构

  var array = [1, 20, 40];
  
  var [first, second, third] = array;
  

对象解构可以对 JavaScript 对象进行解构。在赋值运算符的左侧，有一个变量模式，其中将存储对象的属性。变量的名称必须与对象中定义的名称相同。让我们从以下示例中看一下这个概念。

注意：大括号“{ }”用于解构 JavaScript 对象属性。

• 例子：

    
  
      
      GeeksForGeeks
  
    
  
      
        
          let example_object = {
              name: "Object",
              platform: "GeeksForGeeks",
              number: 100
          };
        
          let {name, platform, number} = example_object;
        
          console.log("Name: ", name);
          console.log("Platform: ", platform);
          console.log("Number: ", number);
      
  
    

• 输出：
  

如果我们希望将对象中定义的变量分配给具有其他名称的变量，那么我们可以使用冒号进行设置。

• 句法：

  {sourceProperty : targetVariable}

• 例子：

    
  
      
      GeeksForGeeks
  
    
  
      
          let cuboid = {
              width: 100,
              height: 50,
              depth: 10
          };
        
          // width -> w
          // height -> h
          // depth -> d
          let {width:w, height:h, depth:d} = cuboid;
        
          console.log("Width: ", w);
          console.log("Height:", h);
          console.log("Depth: ", d);
      
  
    

• 输出：
  

数组解构：数组的元素也可以用同样的方式进行解构。解构赋值可用于将数组值分配给 JavaScript 中的一堆不同变量。

注意：方括号“[]”用于解构数组元素。

• 例子：

    
  
      
      GeeksForGeeks
  
    
  
      
          var arr = [1, 2, 3];
        
          var [arr_1, arr_2, arr_3] = arr;
        
          console.log("First Element: ", arr_1);
          console.log("Second Element: ", arr_2);
          console.log("Third Element: ", arr_3);
      
  
    

• 输出：