在参数里直接定义函数,那这个函数到底是个什么?

在参数里直接定义函数,那这个函数到底是个什么?

例如在本章节“JavaScript实现简易计算器”4-4课程里,老师写了如下这个回调函数

function each(array, fn) {
		    	for (var i = 0; i < array.length; i++) {
		    		fn(i, array[i]);
		    	}
		    }

我尝试把下面这段代码改写一下,套用老师写的这个each函数

function abcd(){
    for(var j=0; j<len; j++){
        btn[j].onclick=function(x){
            return function(){
                alert(x);
            }
        }(j);
    }
}

改写如下:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>效果测试</title>
<style type="text/css"> 
body{text-align:center;}
label{width:50px; height:30px; display:inline-block; background:pink;}
</style>
</head> 
<body>
   <label for="radio1" class="active"></label> 
   <label for="radio2"></label>
   <label for="radio3"></label>
   <label for="radio4"></label>

<script type="text/javascript">

var btn=document.getElementsByTagName("label");

function each(array,fn){
    for(var i=0; i<array.length; i++){
        fn(i,array[i]);
    }
}

each(btn,function abc(){     
    btn[i].onclick=function(){   
        alert(i);
    }
});

console.log(abc);    //abc is not defined
</script>

</body>
</html>


其实与这个each()函数的本体无关,我主要是想问下在参数里面定义一个函数,例如上代码each(btn,function abc(){ ... });,这个函数abc()是直接在参数里面定义的,它的创建环境不明,它既不是在全局环境中创建的(console.log打印不出来),也不是在each()环境里面创建的(变量 i 取不到),那么它的创建环境到底是什么?

抑或说它是个临时函数,没有创建环境?

正在回答

登陆购买课程后可参与讨论,去登陆

4回答


each(btn,function abc(a,b){     
    b.onclick=function(){   
        alert(a);
    }
});

你可以看下我修改的,你写的参数用的不对,肯定出不来啊

  • woximiemie 提问者 #1
    点错了采纳答案了,不好意思,答案是我知道的,我现在不懂的是这个函数abc的创建环境,以及它的变量查找
    2017-12-27 17:42:41
  • woximiemie 提问者 #2
    each(btn,function abc(index,elem){ elem=function(){ alert(index); } });
    2017-12-27 17:43:48
  • woximiemie 提问者 #3
    each(btn,function abc(index,elem){ elem.onclick=function(){ alert(index); } });
    2017-12-27 17:44:26
小丸子爱吃菜 2017-12-27 18:40:17

//img1.sycdn.imooc.com//climg/5a4378690001c62c05760399.jpg

如果这样写,要获取到i的话,必须要传参,不传参的话,abc是获取不到each里面的变量i的

  • 提问者 woximiemie #1
    好吧,谢谢老师
    2017-12-28 20:34:36
小丸子爱吃菜 2017-12-27 13:49:30

首先, fn(i,array[i])这里是有实参传进去的,那么你下面的函数abc就要有形参

其次。函数abc是each函数的参数,那么它就是该函数局部环境中的变量,所以你在外面是获取不到的。

还是要将作用域和函数的课多听听


  • 提问者 woximiemie #1
    这里函数abc的参数我是特意不传的,我是想看下函数abc里面的i能不能向上(在函数each里面)查找得到。那如老师你所说的函数abc是函数each里面的变量,那么函数abc里面的i应该能从函数each里面找得到,但结果是控制台那里报错提示i is not defined,这点我不是很懂
    2017-12-27 17:17:16
小丸子爱吃菜 2017-12-26 14:39:48

each方法是JQ里面的遍历方法,你用在JS中是何故?

可以将你测试代码的完整部分发来,已注释不需要的烦请去掉,这样更有利于我们去定位你说的问题,代码这样有些乱。

祝学习愉快!

  • 提问者 woximiemie #1
    老师你好,标题和描述已经改好了,麻烦看下,谢谢
    2017-12-27 11:57:15
问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
HTML5与CSS3实现动态网页 2018
  • 参与学习       1887    人
  • 提交作业       4643    份
  • 解答问题       5760    个

有HTML和CSS基础,却不知道如何进阶?本路径带你通过系统学习,完成从“会做网页”到“做出好的动态网页”的蜕变,迈出成为前端工程师的第一步。

了解课程
请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师