我最近不得不创建一个没有后端端点的用户界面（ui）。重点是使 ui 尽可能具有响应性，以便用户可以知道操作何时正在进行。
这主要意味着当进行 ajax 调用时，ui 应进行指示，并在调用完成时进行相应更新。
为了帮助 ui 的开发，我创建了一个函数来模拟 ajax 调用。该功能能够：
typescript 代码如下（请参阅带有文档字符串的完整代码示例的要点）：
export async function delay<t>(
timeout: number,
probability?: number,
result?: t
): promise<t> {
return new promise<t>((resolve, reject) => {
settimeout(() => {
if (!probability || probability 1) {
resolve(result);
return;
}
const hit = math.random();
if (hit
<p>要使用此功能：<br></p>
<pre class="brush:php;toolbar:false">async function handlebuttonclick() {
// update the ui to show a loading indicator.
try {
// highlight-start
// make the call take 3 seconds, with a 10% chance of failure,
// and return an array of users.
const result = await delay(null, 0.9, [
{
email: 'user1@example.com',
username: 'user 1',
},
]);
// highlight-end
// update the ui when the call completes succesfully.
} catch (err: any) {
// update the ui when the call fails.
}
}
相同函数的 javascript 版本如下：
export async function delay(timeout, probability, result) {
return new Promise((resolve, reject) => {
setTimeout(() => {
if (
!probability ||
typeof probability !== 'number' ||
probability 1
) {
resolve(result);
return;
}
const hit = Math.random();
console.log(hit, probability);
if (hit
<p><em>这篇文章首次发表于 cheehow.dev</em></p>