js解构赋值中，()与{}有什么区别？

<script type="text/javascript">
    function demo(name = "张三", age = 30) {
        //这里可以用（）也可以function demo({name = "张三", age = 30})

        console.log("姓名：" + name);
        console.log("nianl：" + age);
    }

    demo();
</script>

如代码中注释那样，加花括号和不加都没问题。只是加花括号后面调用也需要加{} ， 那么（）与{}有啥区别？

简单理解：解构赋值的意思是对应的位置，对应的 key 自动赋值。

使用() 还是 {}，要看你定义的函数的参数是什么样的，具体看下面的例子。

第一种：当函数的参数是一个对象时，需要使用 {}。这样在函数里面能通过参数的相同的 key 获取到参数对象里的 key 对应的值。

function demo({name, age}) {
  console.log(`姓名：${name}`)
  console.log(`年龄：${age}`)
}
demo({
  name: '张三',
  age: 24
})

第二种：当函数里的参数是多个时，这个时候用 ()。其实，这个不是结构赋值，真的只是ES5 里的形参而已，只不过你的代码里用到了 ES6 中的参数默认值设置而已。

function demo(name = "张三", age = 30) {
  console.log("姓名：" + name);
  console.log("nianl：" + age);
}

demo();