返回

ECMAScript 2015中的函数参数默认值及扩展

前端

在ECMAScript 2015中,函数的参数默认值和扩展得到了很大的增强,包括箭头函数、剩余参数、展开运算符和析构赋值。这些新特性使JavaScript代码更加简洁、易读和高效。

参数默认值

以前,如果要为函数的参数设置默认值,需要在函数体中使用逻辑代码来实现。例如,下面的foo函数有一个enable参数,默认值为true:

function foo(enable) {
  if (enable === undefined) {
    enable = true;
  }

  // ...
}

在ES2015中,可以直接在函数参数列表中为参数设置默认值。例如,上面的foo函数可以改写为:

function foo(enable = true) {
  // ...
}

箭头函数

箭头函数是一种简写形式的函数,它没有function,并且可以使用=>符号代替function。箭头函数的语法如下:

(parameters) => expression

例如,下面的foo函数可以改写为箭头函数:

const foo = (enable) => {
  // ...
}

箭头函数通常用于编写简单的函数,例如回调函数或事件处理函数。

剩余参数

剩余参数允许将多个参数收集到一个数组中。剩余参数的语法如下:

function foo(...args) {
  // ...
}

例如,下面的foo函数接收任意数量的参数,并将它们收集到一个名为args的数组中:

function foo(...args) {
  console.log(args);
}

foo(1, 2, 3); // [1, 2, 3]

剩余参数通常用于编写可变参数的函数。

展开运算符

展开运算符允许将数组或对象展开为单独的元素。展开运算符的语法如下:

...array

例如,下面的代码将数组[1, 2, 3]展开为三个单独的元素:

const numbers = [1, 2, 3];
console.log(...numbers); // 1 2 3

展开运算符通常用于将数组或对象传递给函数。

析构赋值

析构赋值允许将数组或对象中的元素赋值给变量。析构赋值的语法如下:

const [a, b, c] = array;
const { x, y, z } = object;

例如,下面的代码将数组[1, 2, 3]中的元素赋值给变量a、b和c:

const [a, b, c] = [1, 2, 3];
console.log(a); // 1
console.log(b); // 2
console.log(c); // 3

析构赋值通常用于从数组或对象中提取数据。

这些是ECMAScript 2015中函数参数默认值和扩展的一些新特性。这些新特性使JavaScript代码更加简洁、易读和高效。