JavaScript解构与函数用法疑问：为什么函数参数采用({ names })形式声明？

1. 关于函数参数({ names })的写法 #

这是ES6的函数入参对象解构语法，核心逻辑是：

• 这个函数的第一个入参本身是一个对象
• 我们不需要完整接收整个入参对象，直接从入参对象里提取names属性作为变量使用
• 外层的圆括号是语法强制要求：如果直接写{ names }作为参数，JS引擎会把开头的{识别为代码块起始标记，所以必须用圆括号包裹对象解构的表达式

举个等价的普通写法对比就很清楚：

// 解构写法
export default ({ names }) => {
  // 内部可以直接用names变量
}

// 等价于普通写法
export default (params) => {
  const names = params.names;
  // 后续逻辑完全一致
}

2. 后续嵌套解构的默认值逻辑 #

代码里的嵌套解构加了多层默认值，是为了避免属性不存在时的报错：

const { 
    people: { 
        children = [] 
      } = {} 
  } = names;

• 如果names里没有people属性，people会默认取值为空对象{}，避免读取people.children时报Cannot read properties of undefined错误
• 如果people里没有children属性，children会默认取值为空数组[]，避免后续调用children.find()时报错

补充注意点 #

你贴的这段代码里，children.find((child) => child.email) 这一行没有加return，同时箭头函数外层有大括号包裹，所以函数最终的返回值是undefined，如果需要拿到查找结果，要给这行前面加return。

内容的提问来源于stack exchange，提问作者Bjork