极客笔记如何在promise中包装setTimeout()方法
setTimeout()方法在特定的毫秒数之后执行某些代码块或函数。有时候，我们需要在特定的延迟之后解析或拒绝promise，这时我们可以使用setTimeout()方法与promise一起使用。
在JavaScript中，promise是返回异步操作结果的对象。在这里，我们将学习如何使用setTimeout()方法在一段延迟时间后解析或拒绝promise。
示例1（没有使用setTimeout()方法的promise）
在下面的示例中，我们使用Promise()构造函数创建了一个新的promise。promise构造函数接受一个回调函数作为参数，回调函数执行resolve()方法来解析promise。这演示了promise的基本用法。
<html>
<body>
<h2>Using the Promises without setTimeOut() method in JavaScript</h2>
<div id = "content"> </div> <br />
<button onclick = "start()"> Resolve Promise </button>
<script>
let content = document.getElementById('content');
// function for promise example
function start() {
let promise = new Promise(function (resolve, reject) {
resolve("Promise is resolved!");
});
promise.then((value) => {
content.innerHTML = "The result from resolved promise is " + value;
});
}
</script>
</body>
</html>
语法
用户可以按照下面的语法使用 setTimeOut() 方法与 promises。
new Promise(function (resolve, reject) {
setTimeout(function () {
resolve();
}, delay);
});
在上面的语法中，我们在setTimeOut()方法中执行了resolve()方法。它会在指定的延迟毫秒数之后执行resolve()方法。
示例2（异步函数和setTimeOut()方法的Promise）
在下面的示例中，我们创建了一个名为’resolvePromise’的异步函数。我们创建了一个Promise并将其存储在’sumPromise’变量中。然后，我们使用await关键字暂停函数执行，直到Promise得到解决。
用户可以观察到当他们按下按钮时，它会在2000毫秒后解决Promise。
<html>
<body>
<h3>Using Promises with setTimeOut() method and async functions in JavaScript</h3>
<div id = "content"> </div> <br>
<button onclick = "resolvePromise()"> Resolve Promise </button>
<script>
let content = document.getElementById('content');
// function for promise example
async function resolvePromise() {
let sumPromise = new Promise(function (resolve, reject) {
setTimeout(function () {
resolve("The sum of all data is 100.");
}, 3000);
});
let result = await sumPromise;
content.innerHTML = "The resolved promise's result is " + result;
}
</script>
</body>
</html>
示例3（使用then()块和setTimeout()方法的Promise）
在下面的示例中，我们使用了then()块来解析promise，而不是像示例2中的async/await语法。我们还在promise内部使用了setTimeout()，如示例2中的用法，以在一定延迟后解析promise。
<html>
<body>
<h2>Using the Promises with setTimeOut() method in JavaScript</h2>
<div id = "content"></div>
<br>
<button onclick = "resolvePromise()"> Resolve Promise </button>
<script>
let content = document.getElementById('content');
// function for promise example
function resolvePromise() {
let promise = new Promise(function (resolve, reject) {
setTimeout(function () {
resolve("This promise is resolved after 2000 milliseconds");
}, 2000);
});
promise.then(function (value) {
content.innerHTML = "The resolved promise's result is " + value;
});
}
</script>
</body>
</html>
本教程教用户将setTimeOut()方法包装在promises中。此外，我们还使用了async/await语法和then()块来解决promise。用户可以观察上述示例的输出，它在特定毫秒后解决了promise。