高阶函数

学习笔记，非原创

高阶函数就是可以把函数作为参数，或者是将函数作为返回值的函数

• 回调函数
• 偏函数
• 截流函数
• 去抖函数

回调函数

回调函数会作为另一个函数的参数传入，并在该函数内部被执行

//callback
var list = ['one', 'two', 'three'];
Array.prototype.forEach = function (fn) {
    var i, len;
    for (i = 0, len = this.length; i < len; i++) {
        fn(this[i], i, this);
    }
};
list.forEach(function (item, index, arr) {
    console.log('item = ', item);
    console.log('index = ', index);
});

偏函数

偏函数可以缓存预先确定的参数，然后在返回的函数运行时，获得这些参数

// partial
var isType = function(type) {
    return function(obj) {
        return Object.prototype.toString.call(obj) === "[object "+ type +"]";
    };
};
isString = isType('String');
isNumber = isType('Number');
isArray = isType('Array');
console.log(isString('1'));
console.log(isNumber(18));
console.log(isArray([1, 18, '1', '18']));

节流函数

在某些场景下，某些事件可能会被重复的触发，但事件处理函数并不需要每次都执行，可以设置时间间隔，让一个函数无法在很短的时间间隔内连续调用， 当上一次函数执行后过了规定的时间间隔，才能进行 下一次该函数的调用

function throttle(func, wait) {
    var context, args, timeout, result, previous = 0;
    var later = function() {
        previous = new Date();
        timeout = null;
        result = func.apply(context, args);
    };
    return function() {
        var now = new Date();
        var remaining = wait - (now - previous);
        context = this;
        args = arguments;
        if (remaining <= 0) {
            clearTimeout(timeout);
            timeout = null;
            previous = now;
            result = func.apply(context, args);
        } else if (!timeout) {
            timeout = setTimeout(later, remaining);
        }
        return result;
    };
};

去抖函数

在某些场景下，某些事件可能会被重复的触发，但事件处理函数并不需要每次都执行，可以设置时间间隔, 让一个函数在一定间隔内没有被调用时，才开始执行被调用方法

var searchInput = document.getElementById('search-input');
function debounce(func, wait, immediate) {
    var timeout, result;
    return function() {
        var context = this, args = arguments;
        var later = function() {
            timeout = null;
            if (!immediate) result = func.apply(context, args);
        };
        var callNow = immediate && !timeout;
        clearTimeout(timeout);
        timeout = setTimeout(later, wait);
        if (callNow) result = func.apply(context, args);
        return result;
    };
};
var execute = function () {
    console.log('execute');
};
searchInput.oninput = debounce(execute, 100);