让代码更简短、更简洁、更易读的 JS 小技巧

使用箭头函数

箭头函数（也称为匿名函数）可以代替传统的匿名函数表达式，从而使代码更加简洁。箭头函数的语法如下：

(parameters) => expression

例如，以下代码使用传统的匿名函数表达式来计算两个数字的和：

const sum = function(a, b) {
  return a + b;
};

我们可以使用箭头函数来重写这段代码，如下所示：

const sum = (a, b) => a + b;

使用默认参数

默认参数允许我们在函数调用时不传递某些参数。如果未传递参数，则使用默认值。默认参数的语法如下：

function functionName(parameter1, parameter2 = defaultValue) {
  // ...
}

例如，以下代码使用默认参数来计算两个数字的和，如果未传递第二个参数，则默认为 0：

function sum(a, b = 0) {
  return a + b;
}

利用解构和扩展运算符

解构运算符允许我们将对象或数组中的值解构到单个变量中。扩展运算符允许我们将对象或数组中的值展开到另一个对象或数组中。

例如，以下代码使用解构运算符从对象中提取 name 和 age 属性：

const person = {
  name: "John Doe",
  age: 30
};

const { name, age } = person;

console.log(name); // "John Doe"
console.log(age); // 30

以下代码使用扩展运算符将数组中的值展开到另一个数组中：

const numbers = [1, 2, 3];

const newNumbers = [...numbers, 4, 5];

console.log(newNumbers); // [1, 2, 3, 4, 5]

使用模板字符串

模板字符串允许我们在字符串中嵌入变量。模板字符串的语法如下：

`string ${expression}`

例如，以下代码使用模板字符串来格式化字符串：

const name = "John Doe";
const age = 30;

const greeting = `Hello, my name is ${name} and I am ${age} years old.`;

console.log(greeting); // "Hello, my name is John Doe and I am 30 years old."

使用正则表达式

正则表达式（regular expressions）允许我们在字符串中搜索模式。正则表达式的语法非常复杂，但我们可以使用正则表达式对象来简化正则表达式的使用。

例如，以下代码使用正则表达式对象来查找字符串中的所有数字：

const string = "123 Main Street";

const regex = new RegExp("\\d+");

const matches = regex.exec(string);

console.log(matches); // ["123"]

总结

通过使用箭头函数、默认参数、解构运算符、扩展运算符、模板字符串和正则表达式，我们可以写出更简洁、更易读的 JavaScript 代码。这些技巧可以帮助我们提高代码的可维护性和可读性，并使我们的代码更易于调试。