addEventListener 调用函数时,有参数与无参数的差别

目录

  • 1.addEventListene有哪些参数?
  • 2.调用函数无参数
  • 3.调用函数有参数

1.addEventListene有哪些参数?

参数1:type(种类)

参数2:func(函数)

参数3:useCapture(true:事件捕获阶段调用事件处理程序;false:事件冒泡阶段调用事件处理程序)

2.调用函数无参数

	// 处理函数
    function handle() {
        console.log(Math.random());
    }
    // 滚动事件(函数调用没有加括号,可以多次执行监听事件)
    window.addEventListener('scroll',handle);
    
  	// 滚动事件(函数调用加括号只能调用一次监听事件,)
   	window.addEventListener('scroll',handle());
  

3.调用函数有参数


	//带参数的处理函数
 	function handle(wait) {
        alert(wait);
    }
    // 滚动事件(直接调用只会执行一次监听事件)
    window.addEventListener('scroll',handle(1000));
    

    //带参数的处理函数(通过retrurn function可以执行多次监听事件)
	function handle1(wait) {
         return function(){alert(wait)};
    }
    
	// 滚动事件(函数经过处理,可以执行多次监听事件)
    window.addEventListener('scroll',handle(1000));
   

深入理解JS防抖与节流传送门

你可能感兴趣的:(Js)