ES6（ECMAScript 6）是 JavaScript 的新版标准，它在函数封装方面引入了箭头函数和对象扩展法的特性，这使得函数的编写更加简洁优雅，也更易读易懂。本文将介绍如何使用箭头函数和对象扩展法进行函数封装，并附有实际例子。
箭头函数
箭头函数是 ES6 中最受欢迎的一个特性之一。它的主要优点是语法短小精悍，可读性强，同时还能避免了 this 指针的混淆问题，因此在函数封装中也有着得天独厚的优势。
1. 基本语法
箭头函数的基本语法如下：
(param1, param2, ..., paramN) => expression
其中，param1 到 paramN 是函数的参数列表，箭头函数的参数可以有零个、一个、多个，多个参数之间用逗号隔开，也可以使用括号来包含参数列表；expression 是函数体，它可以是任意表达式，返回值将自动成为函数的返回值。
示例：
// 传统函数
function add(x, y) {
return x + y;
}
// 箭头函数写法
const add = (x, y) => x + y;2. 箭头函数的注意点
- 如果函数只有一个参数，那么
()可以省略。
示例：
const numbers = [1, 2, 3, 4]; numbers.map(number => number * 2); // 等价于 numbers.map((number) => number * 2);
- 如果函数体是一个语句块，那么必须使用
{}把代码块括起来，且需要使用return返回值。
示例：
const numbers = [1, 2, 3, 4];
numbers.filter(number => {
return number % 2 === 0;
});- 箭头函数的
this绑定的是词法作用域（Lexical Scope），而不是动态作用域。这意味着箭头函数内部的this始终指向定义时所在的对象，而不是执行时的对象。
示例：
-- -------------------- ---- -------
-- --- --
--- ------ - -
----- -------
------ ---------- -
---------------- -- ---- -- - - -----------
-
--
-- --- ------
----- ------ - -
----- -------
------ -- -- -
---------------- -- ---- -- - - -----------
-
--
--------------- -- --- -- ---- -- ---------3. 箭头函数的封装应用
箭头函数在函数封装方面也有着广泛的应用。下面是一个将数组中的所有元素都乘以 2 的例子：
const numbers = [1, 2, 3, 4]; const double = arr => arr.map(x => x * 2); console.log(double(numbers)); // [2, 4, 6, 8]
在这个例子中，我们使用了箭头函数对数组的 map 方法进行了封装。箭头函数 arr => arr.map(x => x * 2) 接收一个数组 arr，并对其调用了 map 方法来实现数组中所有元素都乘以 2 的功能。
对象扩展法
对象扩展法是 ES6 中新增加的一个语法糖，它可以非常方便地进行对象的操作和封装。
1. 基本语法
对象扩展法的基本语法如下：
const obj = {
prop1: value1,
prop2: value2,
...
method1() { ... },
method2() { ... },
...
};其中，prop1 到 propN 是对象的属性列表，method1 到 methodN 是对象的方法列表。值得注意的是，在对象扩展法中，对象的方法可以使用箭头函数进行封装，这可以使代码显得更加简洁易读。
示例：
-- -------------------- ---- -------
-- ----
----- ------ - -
----- -------
------ ---------- -
---------------- -- ---- -- - - -----------
-
--
-- -------
----- ------ - -
----- -------
------- -
---------------- -- ---- -- ---------------
-
--2. 对象扩展法的注意点
- 在对象扩展法中，不需要使用冒号来分隔属性名和属性值，而是直接使用等号
=。
示例：
-- -------------------- ---- ------- ----- ----- - --- -- ---- ----- --- - - ----- ----- -- -- ------- ----- --- - - ---- - ----- --
- 在对象扩展法中，可以使用表达式来作为属性名。
示例：
-- -------------------- ---- ------- ----- -------- - --------- -- ---- ----- --- - - ----------- ----- -- -- ------- ----- --- - - ----------- ----- --
3. 对象扩展法的封装应用
对象扩展法在函数封装方面也非常实用。下面是一个用对象扩展法封装函数的例子：
-- -------------------- ---- -------
----- ---------- - -- ----- ---- ----- -- -- -
------ -
-----
----
------
------- -
---------------- -- ---- -- ------------- --- ----------- ----- ---- --- -- ----- -- ----------------
-
--
--
----- ---- - ------------ ----- ------- ---- --- ------ ------------------ ---
------------- -- --- -- ---- -- ----- --- -- ----- ---- --- -- ----- -- ----------------在这个例子中，我们使用对象扩展法封装了一个 createUser 函数，这个函数接收一个包含 name、age 和 email 属性的对象参数，并返回一个新的对象，这个对象包含这三个属性，还有一个 sayHi 方法用于输出这个用户的基本信息。
总结
箭头函数和对象扩展法是 ES6 中的两个重要特性，都能大大提升函数封装的代码品质和可读性。在实际开发中，我们可以使用它们来构建更加简洁、易读、易维护的程序。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64d4af21b5eee0b525c8135b