像诗人一样编码：让函数参数充满张力！

2023-11-19 15:49:38

一、箭头函数：让参数更简洁

在 ES6 中，箭头函数（又称匿名函数）的出现极大地简化了函数参数的书写。与传统函数相比，箭头函数没有 function ，并且可以省略大括号和 return 关键字。这使得箭头函数的代码更加简洁，更易于阅读。

// ES5 函数
function add(a, b) {
  return a + b;
}

// ES6 箭头函数
const add = (a, b) => a + b;

如上例所示，ES6 箭头函数只需一行代码即可完成两个数字的相加操作。这种简洁性使得箭头函数非常适合用于需要快速、简单地处理数据的场景。

二、剩余参数：让函数更灵活

在 ES6 中，剩余参数（又称可变参数）允许函数接收任意数量的参数。这使得函数更加灵活，可以处理各种不同数量的参数。

// ES5 函数
function sum() {
  var args = Array.prototype.slice.call(arguments);
  var total = 0;
  for (var i = 0; i < args.length; i++) {
    total += args[i];
  }
  return total;
}

// ES6 箭头函数
const sum = (...numbers) => numbers.reduce((a, b) => a + b, 0);

如上例所示，ES6 箭头函数可以使用 ...运算符来收集剩余参数。这种特性使得函数可以更加灵活地处理不同数量的参数。

三、默认值：让参数更友好

在 ES6 中，函数参数可以设置默认值。这使得函数在调用时可以不指定某些参数，从而简化了函数的调用。

// ES5 函数
function greet(name) {
  name = name || 'World';
  console.log(`Hello, ${name}!`);
}

// ES6 箭头函数
const greet = (name = 'World') => console.log(`Hello, ${name}!`);

如上例所示，ES6 箭头函数可以在参数中设置默认值。这种特性使得函数在调用时更加友好，可以减少参数的传递数量。

四、解构：让参数更优雅

在 ES6 中，解构是一种将对象或数组的值分解成独立的变量的语法。这使得我们可以更加轻松地访问对象或数组中的数据。

// ES5 函数
function printName(person) {
  console.log(`Name: ${person.name}`);
  console.log(`Age: ${person.age}`);
}

// ES6 箭头函数
const printName = ({ name, age }) => {
  console.log(`Name: ${name}`);
  console.log(`Age: ${age}`);
};