常见的一些函数思想

[iloveyou11]

函数柯里化

在数学和计算机科学中，柯里化是一种将使用多个参数的一个函数转化为一系列使用一个参数的函数的技术。
前端使用柯里化的用途主要是简化代码结构，提高系统的维护性，一个方法只有一个参数，强制了功能的单一性。很自然就做到了功能内聚，降低了耦合性。

function add() {
    let arr = Array.from(arguments)
    return arr.reduce((pre, cur) => {
        return pre + cur
    }, 0)
}

function FixedCurry(fn) {
    // 这里的arguments是[add, 1, 2] 
    let _args = Array.prototype.slice.call(arguments, 1)
        //相当于[].call(arguments,1) 
    return function() {
        // 这里的arguments是[2, 3] 
        let newArgs = _args.concat([].slice.call(arguments, 0))
            //这里的 newArgs相当于完成了所有参数的拼接 [1,2,2,3] 
        return fn.apply(this, newArgs)
    }
}
let newAdd = FixedCurry(add, 1)
console.log(newAdd(1, 2));
console.log(newAdd(3));
console.log(newAdd(4));

输出结果：

4
4
5

function add() {
    let arr = Array.from(arguments)
    return arr.reduce((pre, cur) => {
        return pre + cur
    }, 0)
}

function FixedCurry(fn) { // 这里的arguments是[add, 1, 2] 
    let _args = Array.prototype.slice.call(arguments, 1) //相当于[].call(arguments,1) 
    return function() { // 这里的arguments是[2, 3] 
        let newArgs = _args.concat([].slice.call(arguments, 0)) //这里的 newArgs相当于完成了所有参数的拼接 [1,2,2,3] 
        return fn.apply(this, newArgs)
    }
}
// 要实现的效果 
// let newAdd = Curry(add) // newAdd(1, 2, 3, 4) // newAdd(1)(2)(3)(4) // newAdd(1, 2)(3)(4) // ... 
function Curry(fn, length) {
    length = length || fn.length //fn.length代表fn函数需要传入的参数个数
    return function() {
        if (arguments.length < length) {
            // combined=[fn,1,2,3,...] 
            let combined = [fn].concat([].slice.call(arguments, 0)) // 递归 
            return Curry(FixedCurry.apply(this, combined), length - arguments.length)
        } else { // 传入的参数个数达到要求时，执行函数 
            return fn.apply(this, arguments)
        }
    }
}
let newAdd = Curry(add, 4)
console.log(newAdd(1, 2, 3, 4));
console.log(newAdd(1)(20)(3)(4));
console.log(newAdd(1, 22)(3)(4));

输出结果：

10
28
30

在ajax请求中应用函数curry化：

function ajax(type, url, data) {
    let xhr = new XMLHttpRequest()
    xhr.open(type, url, true)
    xhr.send(data)
}

const GET = 'get'
const POST = 'post'
ajax(POST, 'www.test1.com', "age=12")
ajax(POST, 'www.test2.com', "age=20")
ajax(POST, 'www.test23com', "age=23")

let ajaxCurry = curry(ajax)

let post = ajaxCurry(POST)
post('www.test1.com', 'age=12')

let postFromTest = post('www.test1.com')
postFromTest('age=12')

惰性函数

惰性函数是指在函数调用后，改变函数的实现，这样就不需要在每次调用此函数时都去根据条件选择具体的实现，有几个典型的应用场景：

1. 用户vip会员判断（一次判断后固定优惠策略）
2. 浏览器内核检测
3. 事件绑定函数封装
4. ……

示例代码如下：

// 场景1：永远打印第一次调用时的时间 
let printTime = (function() {
    let t = null
    return function() {
        if (t)
            return t
        t = new Date().getTime()
        return t
    }
})()

// 以上版本有个问题，下次再调用时依次会走判断逻辑 
let printTime = function() {
    let t = new Date().getTime()
    test = function() {
        return t
    }
    return test
}

// 场景2：事件绑定方法邓庄 
function addEvent(dom, type, handler) {
    if (dom.addEventListener) {
        dom.addEventListener(type, handler, false)
        addEvent = function(dom, type, handler) {
            dom.addEventListener(type, handler, false)
        }
    } else {
        dom.attachEvent('on' + type, handler)
        addEvent = function() {
            dom.attachEvent('on' + type, handler)
        }
    }
}

函数组合

函数组合是指将多个函数的实现，糅合到一个函数（功能组合），示例如下：

// 古老版本，但是如果传入的是很多个函数呢？ 
function comose(f, g) {
    return function(x) {
        return f(g(x))
    }
}
// 依次传入很多个函数f1,f2,f3,f4...，要返回一个组合函数f1(f2,f3,f4(x)) 
function compose() {
    let args = Array.prototype.slice.call(arguments) //变为数组 
    let idx = args.length - 1
    return function(x) {
        let result = args[idx](x)
        while (idx--) {
            result = args[idx](result)
        }
        return result
    }
}
// 进一步优化 
function compose() {
    let args = Array.prototype.slice.call(arguments) //变为数组 
    return function(x) {
        return args.reduceRight((prev, cur) => {
            return cur(prev)
        }, x)
    }
}
// 进一步简化 
const compose = (...args) => x => args.reduceRight((prev, cur) => {
    return cur(prev)
}, x)

// 测试
const f = compose(fn1, fn2, fn3)
console.log(f('dferfes'));

函数记忆

函数记忆是针对需要重复计算和获取值的场景下设置的，类似于动态规划的思想，将每一个状态的前一个状态记录下来，这样可以加速运算~

let count = 0,
    cache = []

function fn(n) {
    if (cache[n]) {
        return cache[n]
    } else { // 
        if (n === 0 || n === 1) {
            cache[0] = 1
            cache[1] = 1
            return 1
        } // 
        cache[n] = n * fn(n - 1)
        return cache[n]
    }
}
// 优化，缓存应该是私有的 
function memorize(fn) {
    let cache = {} //对象的查找速度比数组更快
    return function() { // 保证key唯一 
        let key = arguments.length + Array.prototype.join.call(arguments)
        if (cache[key]) {
            return cache[key]
        } else {
            cache[key] = fn.apply(arguments)
            return cache[key]
        }
    }
}