进阶开发者必备：js代码优化编程函数指南

2024-02-22 01:26:39

在js的编写过程中，函数设计就相当于那20%，时刻影响着你的代码，可以说是至关重要。那么对于函数的设计原则，你又了解多少？

1. 功能单一原则

函数返回值得合理性和参数检查息息相关。如下代码，如果array是null,直接就返回空数组，如果array不是null，再继续执行。

function getArrayLength(array) {
  if (array === null) {
    return [];
  }
  return array.length;
}

这种方式显然存在问题，如果调用者不小心传入了一个null值，那么函数就会返回一个空数组，而这并不是调用者想要的。为了避免这种问题，我们可以对参数进行检查，如下所示：

function getArrayLength(array) {
  if (array === null || array === undefined) {
    throw new Error("array cannot be null or undefined");
  }
  return array.length;
}

这样，如果调用者传入了一个null值或undefined值，函数就会抛出一个错误，调用者就可以及时发现并改正问题。

2. 避免全局变量

全局变量是指在函数外部声明的变量，它可以在函数的任何地方访问。全局变量会使代码难以维护，因为很难跟踪变量的来源和用途。因此，尽量避免使用全局变量，而是应该将变量声明在函数内部。

// 全局变量
var globalVariable = 1;

function add(a, b) {
  // 局部变量
  var localVariable = 2;
  return a + b + globalVariable + localVariable;
}

在这个例子中，全局变量globalVariable可以在函数add()的任何地方访问，而局部变量localVariable只能在函数add()内部访问。如果我们要修改globalVariable的值，那么在函数add()内部修改它是不行的，必须在函数外部修改它。这显然会给代码的维护带来很大的麻烦。

3. 使用闭包

闭包是指能够访问其创建时的局部变量的函数。闭包可以用来保存一些状态，即使函数已经返回。如下代码，我们使用闭包来保存一个计数器，并每次调用函数add()时将计数器加一。

function createCounter() {
  var counter = 0;
  return function() {
    return ++counter;
  };
}

var add = createCounter();

console.log(add()); // 1
console.log(add()); // 2
console.log(add()); // 3

在这个例子中，函数createCounter()返回了一个闭包，这个闭包保存了变量counter。每次调用函数add()时，闭包都会将变量counter加一并返回。由于闭包可以访问函数createCounter()的局部变量counter，因此即使函数createCounter()已经返回，我们仍然可以继续使用变量counter。

4. 使用箭头函数

箭头函数是es6中引入的一种新的函数语法。箭头函数的写法更加简洁，而且不需要使用function。如下代码，我们将使用箭头函数来重写函数add()：

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

在这个例子中，箭头函数add()的写法更加简洁，而且不需要使用function关键字。箭头函数的返回值是a + b，因为箭头函数只有一行代码，所以不需要使用return关键字。

5. 函数柯里化

函数柯里化是指将一个多参数的函数转换成一个单参数的函数的过程。函数柯里化可以使代码更加简洁，而且可以提高代码的可重用性。如下代码，我们将使用函数柯里化来重写函数add()：

function add(a, b) {
  return a + b;
}

const addCurry = a => b => a + b;

在这个例子中，函数add()是一个多参数的函数，而函数addCurry()是一个单参数的函数。函数addCurry()返回了一个闭包，这个闭包保存了变量a。每次调用函数addCurry()时，闭包都会将变量a与参数b相加并返回。由于闭包可以访问函数addCurry()的局部变量a，因此即使函数addCurry()已经返回，我们仍然可以继续使用变量a。

6. 函数的命名规则

函数的命名规则是代码风格的重要组成部分。函数的名称应该能够反映函数的功能，而且应该易于阅读和理解。如下是一些函数命名规则：