【javascript】回调函数的使用

2017-07-17  本文已影响0人  老夫当年也是神一般的少年

现在有这样一个场景,需要对100000个节点进行检索与修改操作,先来看看检索与修改操作耦合的情况:

/* 不好的编程方式 */
var findNodes = function(){
    var i = 100000,
        nodes = [],
        found = document.getElementById("found");
    while(i){
        i -= 1;
        //这里是复杂的逻辑
        nodes.push(found);
    }
    return nodes;
};
var hide = function(nodes){
    var i = 0,
        max = nodes.length;
    for(; i<max; i+=1){
        nodes[i].style.display = "none";
    }
};
//执行,让每个节点隐藏
hide(findNodes());  //低效,应为hide需要再次遍历

可以看到,上述的编码是不优雅的,主要有两点:一是搜索与修改的业务逻辑耦合,不能当做一个通用函数使用;二是在hide函数里又再一次进行了遍历,效率低下;

那么针对这两点,我们可以使用回调函数来做下优化:

var findNodesc = function(callback){
    var i = 100000,
        nodes = [],
        found = document.getElementById("found");
    //检查回调函数是否为可调用的
    if(typeof callback !== "function"){
        callback = false;
    }
    while(i){
        i -= 1;
        //这里是复杂的逻辑
        if(callback){
            callback(found);
        }
        nodes.push(found);
    }
    return nodes;
}
var hides = function(node){
    node.style.display = "none";
}
findNodesc(hides);  //找到节点并隐藏

以上,由第一种方法产生的问题完美解决。

上一篇 下一篇

猜你喜欢

热点阅读