首页 > 请看我对这段代码的解释对不对

请看我对这段代码的解释对不对

<button id="btn">按钮</button>

<script>
var e =document.getElementById("btn");
e.addEventListener("click",demo1())   

function demo1(){
alert("hello1")
    }
<script>

这段话的执行结果是:打开网页,立即执行demo1(),然后点击按钮没反应。
我是这么理解的:

因为函数名后面加括号代表立即执行该函数,解释器在解释这句话时,将demo1执行了,而e.addEventListener("click",demo1())因为第二项参数不符合,则成了无效代码,不被执行。

大家看看这么理解对不对呢?



"无效代码,不被执行",这半句我觉得可以再深入一点。你在e.addEventListener("click",somename)的时候,第二个参数代表的是变量名。

somename就是一个变量名,你用typeof somename可以得到这个变量的类型,如果它是function,那么click事件发生的时候就会去执行这个函数。

但是现在直接把somename()传进去之后是什么意思呢?意思是把somename()的运行结果作为第二个参数传进去,那么typeof somename()得到的是什么呢?undefined。所以这里就发生了:1.运行函数(发生了alert),得到结果(undefined),将结果作为addEventListener的第二个参数传入;2.click事件发生的时候,执行undefined,所以什么也不发生,当然e.addEventListener("click",undefined)第二个参数为undefined的话,这个绑定动作其实也没有发生,所以你说“第二项参数不符合”也是OK的。


楼主搜一下(js预解释),或许会有不同的理解。


理解的没错,理解的没错


‘因为第二项参数不符合’你这样说也没错,可以这样理解;
e.addEventListener("click",demo1()) 当代码执行这段时demo1()被执行而且函数返回值是undefined,相当于e.addEventListener("click",undefined);这情况下这个绑定事件也不会被成功绑定,也就是button压根没被绑上‘click’事件,所以你再点他时是没有反应的。



终于分清函数函数执行

【热门文章】
【热门文章】