ES6-learning：函数扩展的7个重要特性-平芜编程栈

ES6-learning：函数扩展的7个重要特性

【免费下载链接】ES6-learning《深入理解ES6》教程学习笔记项目地址: https://gitcode.com/gh_mirrors/es6l/ES6-learning

ES6（ECMAScript 2015）为JavaScript函数带来了诸多强大的扩展特性，极大地提升了代码的简洁性和可读性。本文将深入探讨ES6函数的7个重要特性，帮助开发者快速掌握这些实用技能，优化日常编码效率。

1. 默认参数：简化参数初始化

在ES5中，为函数参数设置默认值需要在函数体内通过逻辑判断实现，而ES6允许直接在参数定义时指定默认值，使代码更加简洁。

// ES6默认参数写法 function a(num = 6, callback = function(data) { console.log('ES6: ', data) }) { callback(num * num); } a(); // 输出 "ES6: 36"（使用默认参数） a(10, data => console.log(data * 10)); // 输出 1000（使用自定义参数）

优势：减少函数体内的条件判断，直接明了地展示参数默认值。需要注意的是，默认参数会使函数内部的arguments对象与参数值解耦，其行为类似于ES5的严格模式。

2. 不定参数：灵活处理可变参数

ES6引入了不定参数（Rest Parameters），使用...前缀表示一个数组，用于接收函数的剩余参数，解决了ES5中通过arguments对象处理可变参数的不便。

// 不定参数示例 function sum(...numbers) { return numbers.reduce((acc, val) => acc + val, 0); } console.log(sum(1, 2, 3)); // 输出 6 console.log(sum(10, 20, 30, 40)); // 输出 100

使用限制：不定参数必须作为函数的最后一个参数，且不能用于对象字面量的setter方法中。

3. 展开运算符：解构数组为参数

展开运算符（Spread Operator）同样使用...语法，但其作用与不定参数相反：它将数组或类数组对象解构为独立的参数序列。

// 展开运算符示例 const numbers = [10, 20, 50, 40, 30]; const max = Math.max(...numbers); console.log(max); // 输出 50（无需使用Math.max.apply）

应用场景：数组拼接、函数参数传递、浅拷贝对象等，替代了ES5中的apply方法和concat函数。

4. 箭头函数：简洁语法与词法this

箭头函数（Arrow Function）是ES6最受欢迎的特性之一，它使用=>语法简化函数定义，并绑定词法作用域的this。

// 箭头函数基础用法 const add = (a, b) => a + b; console.log(add(2, 3)); // 输出 5 // 数组排序示例 const arr = [10, 50, 30, 40, 20]; arr.sort((a, b) => a - b); console.log(arr); // 输出 [10, 20, 30, 40, 50]

核心特性：

没有自己的this，继承自外层作用域
不绑定arguments对象
不能作为构造函数使用
无法通过call/apply改变this指向

5. 块级函数：限制函数作用域

ES6允许在块级作用域（如if、for语句）中声明函数，严格模式下其作用域被限制在块内，避免了ES5中函数提升导致的作用域污染问题。

// 严格模式下的块级函数 "use strict"; if (true) { function blockFunction() { return "我是块级函数"; } console.log(blockFunction()); // 正常执行 } try { blockFunction(); // 抛出ReferenceError } catch (e) { console.log(e.message); // "blockFunction is not defined" }

最佳实践：始终在严格模式下使用块级函数，确保作用域隔离。

6. 尾调用优化：提升递归性能

尾调用（Tail Call）是指函数的最后一条语句是调用另一个函数。ES6引擎会对符合条件的尾调用进行优化，避免栈溢出，显著提升递归函数的性能。

// 尾调用优化的阶乘函数 "use strict"; function factorial(n, p = 1) { if (n <= 1) return 1 * p; return factorial(n - 1, n * p); // 尾调用 } console.log(factorial(5)); // 输出 120（无栈溢出风险）

优化条件：

尾调用是函数的最后一条语句
结果直接返回，不参与其他运算
调用的函数不是闭包

7. 生成器函数：控制函数执行流程

生成器函数（Generator）是一种特殊函数，使用function*定义，通过yield关键字控制执行流程，可暂停和恢复函数执行，是异步编程的重要工具。

// 简单生成器示例 function* createIterator() { yield 1; yield 2; yield 3; } const iterator = createIterator(); console.log(iterator.next()); // { value: 1, done: false } console.log(iterator.next()); // { value: 2, done: false } console.log(iterator.next()); // { value: 3, done: false } console.log(iterator.next()); // { value: undefined, done: true }

应用场景：异步操作控制、迭代器生成、无限序列生成等。