函数式风格统治 JavaScript 的天下

2023-12-11 13:32:40

在函数式编程中，函数就像乐高积木。它们是可重用的、可组合的，你能够通过各种方式对函数进行组合，从而构建出新的函数，然后，使用这些函数来构建更大的函数，直到满足你需求。这就是函数式编程的魅力所在。

函数的定义

函数是 JavaScript 中的一个基本概念，它是一组可被重复利用的代码块，可以接受参数并返回一个值，或者不接受参数也不返回任何值。函数可以分为两种：声明式函数和表达式式函数。

声明式函数使用 function 声明，例如：

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

表达式式函数使用箭头函数语法声明，例如：

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

函数的参数

函数可以接受多个参数，参数是传递给函数的数据。参数在函数体中使用 arguments 对象来访问，arguments 对象是一个类数组对象，它包含了传递给函数的所有参数。

function sum() {
  let total = 0;
  for (let i = 0; i < arguments.length; i++) {
    total += arguments[i];
  }
  return total;
}

函数的调用

函数可以通过两种方式调用：直接调用和间接调用。

直接调用就是直接使用函数名来调用函数，例如：

sum(1, 2, 3);

间接调用是通过一个变量来调用函数，例如：

const myFunc = sum;
myFunc(1, 2, 3);

函数的闭包

闭包是 JavaScript 中的一个重要概念，它指的是一个函数可以访问其定义作用域之外的变量。闭包可以用来创建私有变量，也可以用来实现函数的柯里化。

function outer() {
  let x = 1;
  function inner() {
    return x++;
  }
  return inner;
}

const myFunc = outer();
console.log(myFunc()); // 1
console.log(myFunc()); // 2

函数的高阶函数

高阶函数是指一个函数可以接受另一个函数作为参数，或者返回一个函数作为结果。高阶函数是函数式编程中非常重要的一种概念，它可以用来实现函数的组合、柯里化等操作。

function compose(...funcs) {
  return function(...args) {
    return funcs.reduceRight((result, func) => func(result), args);
  };
}

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

const addAndMultiply = compose(multiply, add);
console.log(addAndMultiply(1, 2)); // 6

函数的作用域

作用域是 JavaScript 中的一个重要概念，它指的是变量或函数的可访问范围。JavaScript 中有两种作用域：全局作用域和局部作用域。

全局作用域是指整个程序都可以访问的变量或函数，局部作用域是指只在函数内部可访问的变量或函数。

let x = 1; // 全局变量

function outer() {
  let y = 2; // 局部变量

  function inner() {
    let z = 3; // 局部变量
    console.log(x, y, z); // 1 2 3
  }

  inner();
}

outer();

函数的传值和传引用

JavaScript 中函数的参数传递是通过值传递的，这意味着在函数内部对参数的修改不会影响到函数外部的变量。但是，如果参数是一个对象，那么函数内部对对象属性的修改会影响到函数外部的变量。

function changeValue(a) {
  a = 2;
}

let x = 1;
changeValue(x);
console.log(x); // 1

function changeObject(obj) {
  obj.x = 2;
}

const myObj = { x: 1 };
changeObject(myObj);
console.log(myObj.x); // 2