JavaScript函数后面加不加括号的区别

程序员瑞雪技术 2022年11月15日

0 收藏 453 点赞 3,710 浏览 777 个字

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<button id="btn">按钮</button>
<script>
var e =document.getElementById("btn");
e.addEventListener("click",demo1)function demo1(){
alert("hello1")
    }
e.addEventListener("click",demo2)
function demo2(){
alert("hello2")
    }
</script>
</body>
</html>

e.addEventListener("click",demo2)中，demo2后面加了括号变成打开页面直接弹出对话框而不用去点击按钮，不加括号则是通过点击按钮才触发事件弹出对话框，我感觉这个问题是个挺常见且也有迷惑性的，也总结一下。function Fun(){
　　return 5
　}
var a = Fun；
var b = Fun();
首先定义了一个简单的函数，函数是一种叫做function引用类型的实例，因此函数是一个对象。对象是保存在内存中的，函数名Fun则是指向这个对象的指针。
var a = Fun，这相当于把函数名这个指针拷贝一份给变量a，函数本身并没有被复制。
但是如果在Fun后面加上括号，就相当于立即执行了，也就是b会直接获取到函数的返回值。
然后上面代码的问题是：
事件触发是要有用户进行某项操作才会通过事件监听器调用这个操作对应的某个函数。addEventListener()方法接受三个参数，其中第二个参数就是当事件被触发时应该执行的函数，如果没有事件被触发，那函数肯定不会被调用。如果加上括号，相当于不需要监听前面的事件就可以触发。