【javascript】回调函数的使用

现在有这样一个场景,需要对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);  //找到节点并隐藏

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

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 173,764评论 25 709
  • 在此处先列下本篇文章的主要内容 简介 next方法的参数 for...of循环 Generator.prototy...
    醉生夢死阅读 1,463评论 3 8
  • 1.被拒绝本来就是人生常态,不要太玻璃心。 2.想要追求自由随性的生活,就一定要先从自律开始。 3.穷人思维:不把...
    许小敬阅读 121评论 0 1
  • 这个状态真的是想打自己好多巴掌,拿个手机就刷刷一天,你是不是真的忙……我觉得不是。你是真的傻。一堆paper,居然...
    青烷阅读 490评论 0 0