zoukankan      html  css  js  c++  java
  • JS高阶函数的理解(函数作为参数传递)

    JS高阶函数的理解

    高阶函数是指至少满足下列条件之一的函数。

    · 函数可以作为参数被传递

    · 函数可以作为返回值输出

    一个例子,我们想在页面中创建100个div节点,这是一种写法。我们发现并不是所有用户都是想把这100个div显示的的。所以就有第二种写法

    var appendDiv=function(){
            for(var i=0;i<100;i++){
                var div =document.createElement('div');
                div.innerHTML=i;
                document.body.appendChild(div);
           div.style.display='block';
     } }
    appendDiv();
    

      

    第二种写法

    这是我们appendDiv传入了一个函数

    function(node){
       node.style.display='none';
    }
    

      

    然后在appendDiv中判断这个是否是function,如果是我们就执行他,把它传入appendDiv()中

        var appendDiv=function(callback){
            for(var i=0;i<100;i++){
                var div =document.createElement('div');
                div.innerHTML=i;
                document.body.appendChild(div);
                if(typeof callback=='function'){
                    callback(div);
                    //console.log(callback);
                }
            }
        }
        appendDiv(function(node){
            node.style.display='none';
        });

    结论:

    div.style.display='block';//这段代码是不合理的,这段代码放进去成为了难以复用的程序,所以我们得用函数作为参数传进去
    
    //原理是这样的,function(node){node.style.display='block';}传入进去后,就相当于把这个匿名函数变成了callback函数
    //即
    var callback = function(node){
            node.style.display='block';
        }
    callback(div);//函数执行
    
     
  • 相关阅读:
    IDEA使用总结1-Github下载代码和上传代码到Git
    Mysql-安装指南
    Dubbo安装及其实战1
    分布式设计(学习内容目录--后端架构师)
    elasticsearch安装指导(new)
    浅谈TCP/IP(new 常见面试问题)
    浅谈常用的设计模式(new)
    浅谈Elasicsearch
    浅谈数据库分库分表(new)
    JAVA 电子书下载地址
  • 原文地址:https://www.cnblogs.com/yz-blog/p/6478946.html
Copyright © 2011-2022 走看看