3. 函数新增了哪些扩展？

一、先给一个面试开场思路如果面试官问ES6 对函数新增了哪些扩展不要一上来就堆概念。比较好的回答方式是先分类ES6 对函数的扩展我一般会从参数、作用域、函数写法、this 绑定、尾调用、函数名、rest/spread这几个方面来说。比较核心的有默认参数、剩余参数rest、扩展运算符、箭头函数、函数的 name 属性增强、严格模式和参数作用域的变化、尾调用优化等。这样开头会很有结构。二、ES6 中函数新增了哪些扩展1函数参数默认值ES6 之前如果想给参数默认值通常这样写function foo(x, y) { y y || default return [x, y] }这种写法有问题比如当y 0、、false时也会被错误替换。ES6 写法function foo(x, y default) { return [x, y] } console.log(foo(1)) // [1, default] console.log(foo(1, 0)) // [1, 0]优点写法更简洁语义更清晰不会误伤0、false、面试加分点默认参数是在函数调用时生效的而且它会形成一个单独的参数作用域。2默认参数可以配合解构使用这个是 ES6 很常见的写法。function ajax(url, { method GET, timeout 3000 } {}) { console.log(url, method, timeout) } ajax(/api) ajax(/api, { method: POST })为什么好在配置对象场景下非常实用尤其适合请求参数组件配置初始化选项面试亮点默认参数 解构赋值是 ES6 中非常有实用价值的组合很多库和框架源码里都会用到。3剩余参数rest作用用于接收多余参数形式是...变量名。function sum(...args) { return args.reduce((prev, cur) prev cur, 0) } console.log(sum(1, 2, 3)) // 6和arguments的区别arguments类数组对象不能直接调用数组方法不够直观rest是真正的数组更语义化可以直接用数组方法示例function fn(a, b, ...rest) { console.log(a) // 1 console.log(b) // 2 console.log(rest) // [3, 4, 5] } fn(1, 2, 3, 4, 5)面试加分说法rest参数本质上是对arguments的改进让不定参数处理更符合现代 JavaScript 的数组式操作习惯。4扩展运算符...在函数里扩展运算符主要用于将数组展开为参数列表。const arr [1, 2, 3] console.log(Math.max(...arr)) // 3替代 ES5 写法Math.max.apply(null, arr)作用函数传参更方便可读性更强配合 rest 构成“收集”和“展开”的完整能力面试亮点rest是“收集参数”spread是“展开参数”两者在语法上很像但语义相反。这句话特别适合面试。5箭头函数这是 ES6 函数扩展里最核心的一部分。基本写法const add (a, b) a b等价于const add function(a, b) { return a b }特点一写法更简洁const square x x * x如果只有一个参数可以省略括号如果函数体只有一行表达式可以省略return。特点二没有自己的this这是最重要的点。箭头函数的this不是运行时绑定的而是定义时所在作用域的this。function Timer() { this.count 0 setInterval(() { this.count console.log(this.count) }, 1000) }这里箭头函数中的this会继承外层Timer的this。特点三不能作为构造函数const Person () {} new Person() // TypeError因为箭头函数没有prototype也没有自己的this。特点四没有argumentsconst fn () { console.log(arguments) // 报错或取外层 }如果要获取不定参数应该用rest。特点五不能使用yield所以箭头函数不能作为 Generator 函数。面试加分点箭头函数最大的价值不是“简写”而是它固定了this的指向避免了传统函数在回调中this丢失的问题。这句很加分。6函数的name属性增强ES6 对函数的name属性做了增强。function foo() {} console.log(foo.name) // foo匿名函数赋值给变量时也能推导出函数名const bar function() {} console.log(bar.name) // bar箭头函数也一样const baz () {} console.log(baz.name) // baz作用调试更方便错误栈信息更清晰这个点虽然不如箭头函数常考但说出来会显得你比较细。7参数作用域这是很多人容易忽略的高级点。ES6 中函数参数会形成一个独立作用域。示例let x 1 function foo(x, y function() { return x }) { let x 2 return y() } console.log(foo(5)) // 5这里y默认值里的x取的是参数作用域中的x不是函数体里的x。面试加分说法ES6 的默认参数不只是语法糖它还会引入独立的参数作用域这也是一些边界行为和 ES5 不同的原因。8严格模式相关变化ES6 中如果函数参数使用了默认值、解构赋值或rest参数函数内部就不能显式再设定严格模式。function foo(a 1) { use strict // 报错 }因为参数会形成独立作用域和显式严格模式的处理有冲突。这个属于进阶知识能提一下就不错。9尾调用优化Tail Call Optimization什么是尾调用如果函数最后一步是调用另一个函数这就叫尾调用。function f(x) { return g(x) }ES6 的意义ES6 在规范层面支持尾调用优化。理论上的好处减少调用栈占用避免深递归栈溢出提升递归效率但实际要补充一句虽然 ES6 规范层面提到了尾调用优化但现实中大多数 JavaScript 引擎并没有很好地实现所以实际开发中不能完全依赖它。这句很重要很显成熟。三、面试里怎么把这些内容组织得更好建议按下面几个层次回答第一层参数增强默认参数解构 默认值rest 参数spread 传参第二层函数写法增强箭头函数更简洁的表达形式固定 this第三层函数行为增强name属性增强参数作用域尾调用优化这样回答会显得特别清楚。四、标准版面试回答ES6 对函数的扩展主要体现在几个方面。第一是参数能力增强比如支持默认参数、解构赋值默认值以及rest参数。默认参数让函数定义更直观也避免了 ES5 中通过||设置默认值误伤0、false这类值的问题。rest参数则替代了以前不太方便的arguments因为它拿到的是真正的数组。第二是扩展运算符...可以把数组展开成参数列表常用来替代apply。第三是箭头函数。箭头函数让函数写法更简洁但更重要的是它没有自己的this会继承定义时外层作用域的this所以很适合回调场景。同时它也不能作为构造函数没有自己的arguments。第四是函数的一些行为层面的增强比如name属性更完善了默认参数会形成独立的参数作用域以及 ES6 规范中还提到了尾调用优化。如果从工程实践来看我觉得 ES6 对函数最核心的提升是让函数参数处理更自然让回调中的this更可控也让函数表达形式更简洁、更适合现代开发。五、如果想回答得更精彩可以补充这几个重点1箭头函数不是普通函数的完全替代品你可以主动说箭头函数并不是用来完全替代普通函数的。如果需要动态this、需要作为构造函数、或者需要arguments我还是会使用普通函数。这句特别专业。2默认参数不只是语法糖默认参数除了简化写法还引入了独立的参数作用域这是 ES6 函数行为上一个比较本质的变化。3rest和spread要区分清楚rest是收集参数spread是展开参数语法一样但语义相反。六、对比总结表扩展作用说明默认参数给参数设置默认值替代 ES5 参数解构默认值配置项更方便常用于对象参数rest参数收集剩余参数真正数组替代arguments扩展运算符...展开参数常替代apply箭头函数更简洁的函数写法无自身this、argumentsname属性增强获取函数名更准确调试更方便参数作用域默认参数有独立作用域ES6 新行为尾调用优化理论上优化递归现实支持有限七、精简版面试回答如果时间比较短可以这样答ES6 对函数主要新增了几类扩展一是参数增强比如默认参数、解构默认值和rest参数二是扩展运算符可以把数组展开成参数列表三是箭头函数它不仅写法更简洁更重要的是没有自己的this适合回调场景四是函数行为上的增强比如name属性更完善、默认参数形成独立作用域以及规范层面的尾调用优化。我觉得 ES6 对函数最大的提升是让参数处理更优雅也让this的使用更加可控。八、一句话总结面试官真正想听的是你是否知道ES6 函数新增了哪些能力你能不能分层分类回答而不是散点背诵你是否理解箭头函数、默认参数、rest/spread 的本质你有没有结合实际开发讲出它们的价值和边界