乐趣区

JavaScript-setTimeout补充

写在前面

平时使用中,我们只会给 setTimeout() 传递两个参数。但其实该函数是支持多个参数的。

  • 参数 1:可以是表达式或函数;
  • 参数 2:可以省略,默认为 0;
  • 参数 3,4,···,n:传递给函数的参数;

用例

页面及需求:

<p> 点击按钮 2 秒后输出 "hello"。</p>
<p> 实例中,我们也会输出传递给 alertFunc() 函数的参数 ( IE9 及更早版本不支持)。</p>

<button onclick="myStartFunction()"> 开始 </button>

<p id="demo"></p>
<p id="demo2" style="color:red;"></p>

具体实现:

  • 常规写法
var myVar;
function myStartFunction() {myVar = setTimeout(alertFun,2000,'Angular','Vue');
}
function alertFun(param1,param2) {document.getElementById('demo').innerHTML = 'hello';
    document.getElementById('demo2').innerHTML = 'Frameworks:' + param1 + ',' + param2;
}
  • 匿名函数写法
var myVar;
function myStartFunction() {myVar = setTimeout((param1,param2) => {document.getElementById('demo').innerHTML = 'hello';
        document.getElementById('demo2').innerHTML = 'Frameworks:' + param1 + ',' + param2;
    },2000,'Vue','Angular')
}

或者:

var myVar;
function myStartFunction() {myVar = setTimeout(() => {alertFun('Vue','Angular');
    },2000)
}
function alertFun(param1,param2) {document.getElementById('demo').innerHTML = 'hello';
    document.getElementById('demo2').innerHTML = 'Frameworks:' + param1 + ',' + param2;
}
退出移动版