【我的前端】面向 JavaScript 开发：前端必学的4种函数

函数式编程技术是现代 Wed 开发中的热门话题。这一切都是关于将应用程序框架设计为简单功能的组合，一边写更多可扩展的代码。它允许您简单的交换任何功能而不会破坏程序的另一部分，并且更容易理解和调试程序。

在本文中我们将讨论7种可用于 JavaScript 的函数式编程技术，让您更好地了解如何在Web开发项目中应用函数式编程。

1、纯函数

如果我们发送相同的参数，纯函数会返回相同的结果。他们只是返回他们的操作结果，不看范围之外的任何东西。除了返回他们的返回值之外，纯函数不会影响任何东西。

const helloworld = (name) => 'Hi ${name}';
helloworld('Piumi');

副作用是函数式编程中的一个概念，当当一个函数不尽返回一个值，而且在后台更该组件时，它就会发生，当一个函数执行时，它有可能修改一些东西。最好减少副作用。这就是纯函数的一个优点，因为它的副作用很小。

2、避免程序循环

纯函数式编程的一个显著特征是不变性。您将不得不抛弃标准的循环方法，例如for、while和do-while，以避免在变量初始化后发生变异（例如循环计数器）。相反，JavaScript提供了诸如map、filter、reduce和foreach等高阶函数抽象迭代过程。

我在这里分别为foreach、map、filter和reduce各举一个例子：

foreach：为数组中的每一个元素调用一个函数。

let sum = 0;
const numbers = [10, 25, 73, 84];
numbers.forEach(addNumbers);
function addNumbers(numbers) {
    sum += numbers;
}

map：每个数组项映射到一个函数，函数调用的返回值帮助我们创建一个新数组，映射器函数将数组项作为输入并返回输出。

array.map(mapper)

filter：根据条件过滤数组。在这种情况下，条件是一个函数，它获取数组中的每个元素并决定是否保存它，并且返回真实的布尔值。

array.map(condition);

reduce：将数组减少为单个值的函数。

array.map(reduce);

3、函数链

在JavaScript中，函数链接是一种允许在同一对象上按照顺序调用多个函数的模式。我们可以使用这种技术使用相同的对象调用多个函数，它是代码更具可读性，并减少了冗余代码的数量。

var obj = {
    output: 0,
    addNumber: function (p, q) {
        this.output = p + q;
        return this;
    },
    multiplyNumber: function (p){
        this.output = this.output * p;
        return this;
    } 
};
obj.addNumber(10, 20).multiplyNumber(10)
console.log(obj.output)

在上面的代码示例中，由于addNumber函数反映了当前的obj对象，因此返回值包含了附加的函数。我们在同一对象运行第二个函数multiplyNumber以便于它们链接在一起。

4、Currying

Currying是将多参数函数分解为一元（单参数）高阶函数序列的过程。

function fsum (a, b) { 
    return a + b
}
// Currying functions
function fsum_curry (a, b) {
    return function(b){
        return a + b
    }
}
fsum(10, 2) // 12
fsum_curry(10)(2) // 12

这里柯里化的好处是记忆。我们现在可以记住函数调用中的某些参数，以便以后重用他们，而无需复制和重新计算。

结论

函数式编程在JavaScript开发人员中越来越流行，因为它简化了复杂应用程序的实用，是它们更具可读性。