JS篇 优化流程处理

描述:记录一些可以优化流程处理代码的js片段。

1、 环境判断

根据不同环境执行代码的情景,常用于浏览器兼容,利用闭包和函数重写,只需在初始化时检验一次环境,避免反复执行检验环境的代码。

PS:参考自:Coffce 2015年06月19日发布 https://segmentfault.com/a/1190000002920768

>>举个简单栗子

function foo() {  
     context=1;
     console.log(context);
     context=2;
      foo = function() {
        console.log(context);
     }
}

执行foo(), 第一次输出1,第二次输出2

>>举个实际应用的栗子: 兼容IE8的选择器匹配方法

// 判断element是否匹配选择器selector
function matchSelector(element, selector) {
    var match = 
        document.documentElement.webkitMatchesSelector || 
        document.documentElement.mozMatchesSelector || 
        document.documentElement.msMatchesSelector ||
        // 兼容IE8及以下浏览器
        function(selector, element) {
            // 这是一个好方法,可惜IE8连indexOf都不支持
            // return Array.prototype.indexOf.call(document.querySelectorAll(selector), this) !== -1;
            if (element.tagName === selector.toUpperCase()) return true;
            var elements = document.querySelectorAll(selector),
            length = elements.length;
            while (length--) {
            if (elements[length] === this) return true;
            }
            return false;
        };
    // 重写函数自身,使用闭包keep住match函数,不用每次都判断兼容
    matchSelector = function(element, selector) {
        return match.call(element, selector);
    };
    return matchSelector(element, selector);
}

只有在第一次调用时需要判断加哪个前缀执行哪个方法,其后都是调用了闭包的match函数。

你可能感兴趣的:(JS篇 优化流程处理)