惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

aimingoo的专栏
aimingoo的专栏
S
Securelist
博客园 - Franky
Cyber Security Advisories - MS-ISAC
Cyber Security Advisories - MS-ISAC
IT之家
IT之家
GbyAI
GbyAI
Microsoft Azure Blog
Microsoft Azure Blog
The Cloudflare Blog
云风的 BLOG
云风的 BLOG
N
News and Events Feed by Topic
AI
AI
cs.AI updates on arXiv.org
cs.AI updates on arXiv.org
Schneier on Security
Schneier on Security
Attack and Defense Labs
Attack and Defense Labs
Vercel News
Vercel News
腾讯CDC
Google DeepMind News
Google DeepMind News
K
KPMG report finds enterprise disconnect between AI and its ROI | CIO
M
MIT News - Artificial intelligence
WordPress大学
WordPress大学
freeCodeCamp Programming Tutorials: Python, JavaScript, Git & More
N
Netflix TechBlog - Medium
量子位
S
Schneier on Security
Hacker News: Ask HN
Hacker News: Ask HN
Cyberwarzone
Cyberwarzone
S
Security Affairs
钛媒体:引领未来商业与生活新知
钛媒体:引领未来商业与生活新知
N
News and Events Feed by Topic
T
Tenable Blog
PCI Perspectives
PCI Perspectives
MyScale Blog
MyScale Blog
L
Lohrmann on Cybersecurity
cs.CL updates on arXiv.org
cs.CL updates on arXiv.org
C
Cyber Attacks, Cyber Crime and Cyber Security
W
WeLiveSecurity
N
News | PayPal Newsroom
P
Proofpoint News Feed
O
OpenAI News
C
CERT Recently Published Vulnerability Notes
B
Blog
Cisco Talos Blog
Cisco Talos Blog
Microsoft Security Blog
Microsoft Security Blog
V
Visual Studio Blog
MongoDB | Blog
MongoDB | Blog
大猫的无限游戏
大猫的无限游戏
A
Arctic Wolf
Y
Y Combinator Blog
OSCHINA 社区最新新闻
OSCHINA 社区最新新闻
Spread Privacy
Spread Privacy

博客园 - kingBook

git patch git 修改最后一次提交的日期 Win10 修改特定格式文件的右键快捷菜单 LayaAir3.x 侦听程序退出 旋转力学例子 旋转力学公式 凹多边形碰撞检测 LayaAir3.x 侦听键盘事件 URP 阴影 TypeScript 里的 override TypeScript 类的自身类型 Unity 二维数组序列化 C# 匿名对象、动态属性 Cocos Creator 安卓模拟器中无法运行 Unity Editor 保存图片、缩放纹理 LayaAir3.2.0-beta.2 设置2d刚体线性速度,在不同设备(分辨率)下,表现不一致的问题 LayaAir3.x 物理2D碰撞事件 TypeScirpt 声明Map类型变量 TypeScript 声明函数类型变量
TypeScript async、 await、Promise
kingBook · 2025-04-29 · via 博客园 - kingBook

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Statements/async_function
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Operators/await
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Guide/Using_promises

实现延时:
// LayaAir3.x 中测试
const { regClass, property } = Laya;

@regClass()
export class Test extends Laya.Script {

    onStart() {
        this.delay(1000);
        // 先输出1,1秒后输出2
        // 输出: 
        // 1
        // 2 
    }
    
    private sleep(ms: number): Promise<any> {
        return new Promise(resolve => setTimeout(resolve, ms));
    }

    private async delay(ms: number): Promise<any> {
        console.log("1");
        await this.sleep(ms);
        console.log("2");
    }
    
}
延时执行 for循环:
// LayaAir3.x 中测试
const { regClass, property } = Laya;

@regClass()
export class Test extends Laya.Script {

    onStart() {
        this.handler(1000);
        // 输出 
        // start
        // 一秒后
        // 0
        // 一秒后
        // 1 
        // 一秒后
        // 2
        // end
    }

    private sleep(ms: number): Promise<any> {
        return new Promise(resolve => setTimeout(resolve, ms));
    }

    private async handler(ms:number): Promise<any> {
        console.log("start");
        for (let i = 0; i < 3; i++) {
            await this.sleep(ms);
            console.log(i);
        }
        console.log("end");
    }
    
}
Promise

例:使用 Promise 代替传参式的完成回调

// LayaAir3.x 中测试
const { regClass, property } = Laya;

@regClass()
export class TestPromise extends Laya.Script {

    public onAwake(): void {
        console.log("start");
        this.delay().then((value: any) => {
            console.log("end", value);
        });

        /*output: 
        start
        ...3秒后...
        end hello
        */
    }

    private delay(): Promise<any> {
        return new Promise((resolve: (value: any) => void, reject: (reason?: any) => void) => {
            setTimeout(() => {
                resolve("hello");
            }, 3000);
        });
    }

}

多个缓动

// LayaAir3.x 中测试
const { regClass, property } = Laya;

@regClass()
export class TestPromiseTweenComplete extends Laya.Script {

    public onAwake(): void {
        this.startTween();
        /*output:
        a
        // ...1秒后...
        b
        // ...1秒后...
        c
        */
    }

    private async startTween(): Promise<any> {
        console.log("a");
        await this.tween0();
        console.log("b");
        await this.tween1();
        console.log("c");
    }

    private tween0(): Promise<any> {
        return new Promise((resolve: (value: any) => void, reject: (reason?: any) => void) => {
            Laya.Tween.create(this.owner).duration(1000).to("x", 100).then(tweener => {
                resolve(tweener);
            }, this);
        });

    }

    private tween1(): Promise<any> {
        return new Promise((resolve: (value: any) => void, reject: (reason?: any) => void) => {
            Laya.Tween.create(this.owner).duration(1000).to("y", 100).then(tweener => {
                resolve(tweener);
            }, this);
        });

    }
}

Promise在TypeScript中是一个对象,它代表了一个异步操作的最终结果。一个Promise对象可以处于以下三种状态之一:
Pending(进行中): 初始状态,既不是成功,也不是失败状态。
Fulfilled(已成功): 意味着操作成功完成。
Rejected(已失败): 意味着操作失败。

// 缺省变量的类型,any 根据调用 resolve, reject 时传入的参数的类型进行变化
// promise: Promise<any>
// resolve: (value: any) => void
// reject: (reason?: any) => void

// 创建一个新的Promise对象
let promise = new Promise((resolve, reject) => {
    // 异步操作的代码
    if (/* 异步操作成功 */) {
        resolve(value); // 成功时调用resolve函数
    } else {
        reject(error); // 失败时调用reject函数
    }
});
Promise 的错误处理

通过.then()方法,可以指定fulfilled状态和rejected状态的回调函数,这些回调函数可以返回一个新的Promise,从而形成链式调用。

promise.then((value) => {
    // 成功时执行的代码
}).catch((error) => {
    // 失败时执行的代码
});
promise.then((value) => {
    throw new Error('Something went wrong');
}).catch((error) => {
    // 捕获前面.then()中抛出的错误
});
Promise的静态方法

Promise还提供了一些静态方法,如Promise.all()和Promise.race(),它们可以用于处理多个Promise的组合.

// 等待所有Promise完成
Promise.all([promise1, promise2]).then((values) => {
    // 所有Promise都成功时执行的代码
});

// 竞赛,哪个Promise先完成就使用哪个Promise的结果
Promise.race([promise1, promise2]).then((value) => {
    // 最先完成的Promise的结果
});
Promise的类型推断
// TypeScript能够推断出res的类型为number
Promise.resolve(123).then((res) => {
    // res的类型被推断为number
});
Promise 返回值测试
// LayaAir3.x 中测试
const { regClass, property } = Laya;

@regClass()
export class TestPromiseReturn extends Laya.Script {


    private resolvePromise(): Promise<any> {
        return new Promise((resolve: (value: any) => void, reject: (reason?: any) => void) => {
            setTimeout(() => {
                resolve("resolve promise");
            }, 1000);
        });
    }


    private rejectPromise(): Promise<any> {
        return new Promise((resolve: (value: any) => void, reject: (reason?: any) => void) => {
            setTimeout(() => {
                reject("reject promise");
            }, 1000);
        });
    }

    public onAwake(): void {
        const pa = this.resolvePromise();
        const pb = this.resolvePromise().then();
        const pc = this.resolvePromise().catch();
        console.log("pa", pa);
        console.log("pb", pb);
        console.log("pc", pc);
        /* output:
        pa Promise {<pending>}[[Prototype]]: Promise[[PromiseState]]: "fulfilled"[[PromiseResult]]: "resolve promise"
        pb Promise {<pending>}[[Prototype]]: Promise[[PromiseState]]: "fulfilled"[[PromiseResult]]: "resolve promise"
        pc Promise {<pending>}[[Prototype]]: Promise[[PromiseState]]: "fulfilled"[[PromiseResult]]: "resolve promise"
        */

        const pb1 = this.resolvePromise().then(res => { });
        const pb2 = this.resolvePromise().then(res => { }, err => { });
        const pb3 = this.resolvePromise().then(res => { }, err => { return err; });
        console.log("pb1", pb1);
        console.log("pb2", pb2);
        console.log("pb3", pb3);
        /* output:
       pb1 Promise[[Prototype]]: Promise[[PromiseState]]: "fulfilled"[[PromiseResult]]: undefined
       pb2 Promise[[Prototype]]: Promise[[PromiseState]]: "fulfilled"[[PromiseResult]]: undefined
       pb3 Promise[[Prototype]]: Promise[[PromiseState]]: "fulfilled"[[PromiseResult]]: undefined
       */

        const pb4 = this.resolvePromise().then(res => { return res; });
        const pb5 = this.resolvePromise().then(res => { return res; }, err => { });
        const pb6 = this.resolvePromise().then(res => { return res; }, err => { return err; });
        console.log("pb4", pb4);
        console.log("pb5", pb5);
        console.log("pb6", pb6);
        /* output:
        pb4 Promise[[Prototype]]: Promise[[PromiseState]]: "fulfilled"[[PromiseResult]]: "resolve promise"
        pb5 Promise[[Prototype]]: Promise[[PromiseState]]: "fulfilled"[[PromiseResult]]: "resolve promise"
        pb6 Promise[[Prototype]]: Promise[[PromiseState]]: "fulfilled"[[PromiseResult]]: "resolve promise"
        */
    }

    public onEnable(): void {
        const p1 = this.rejectPromise();
        const p2 = this.rejectPromise().then();
        const p3 = this.rejectPromise().catch();
        console.log("p1", p1);
        console.log("p2", p2);
        console.log("p3", p3);
        /* output:
        p1 Promise {<pending>}[[Prototype]]: Promise[[PromiseState]]: "rejected"[[PromiseResult]]: "reject promise"
        p2 Promise {<pending>}[[Prototype]]: Promise[[PromiseState]]: "rejected"[[PromiseResult]]: "reject promise"
        p3 Promise {<pending>}[[Prototype]]: Promise[[PromiseState]]: "rejected"[[PromiseResult]]: "reject promise"
        */

        const p11 = this.rejectPromise().then(res => { }, err => { });
        const p22 = this.rejectPromise().then(res => { }, err => { return err; });
        console.log("p11", p11);
        console.log("p22", p22);
        /* output:
        p11 Promise {<pending>}[[Prototype]]: Promise[[PromiseState]]: "fulfilled"[[PromiseResult]]: undefined
        p22 Promise {<pending>}[[Prototype]]: Promise[[PromiseState]]: "fulfilled"[[PromiseResult]]: "reject promise"
        */

        const p33 = this.rejectPromise().catch(err => { });
        const p44 = this.rejectPromise().catch(err => { return err; });
        console.log("p33", p33);
        console.log("p44", p44);
        /* output:
        p33 Promise {<pending>}[[Prototype]]: Promise[[PromiseState]]: "fulfilled"[[PromiseResult]]: undefined
        p44 Promise {<pending>}[[Prototype]]: Promise[[PromiseState]]: "fulfilled"[[PromiseResult]]: "reject promise"
        */
    }

    public onStart(): void {
        this.resolvePromise().then(res => { }).then(res => { console.log("res", res); });             // 1秒后,输出:res undefined
        this.resolvePromise().then(res => { return res; }).then(res => { console.log("res", res); }); // 1秒后,输出:res resolve promise

        this.rejectPromise()
            .then(res => { return res; }, err => { }) // 定义了 onrejected 回调,在赋值到变量或链式调用时,将不再被执行
            .then(res => { return res; }, err => { console.log("err0", err); }); // 无输出

        this.rejectPromise()
            .then(res => { return res; }, err => { return err; }) // 定义了 onrejected 回调,在赋值到变量或链式调用时,将不再被执行
            .then(res => { return res; }, err => { console.log("err1", err); }); // 无输出

        this.rejectPromise()
            .then(res => { return res; }) // 
            .then(res => { return res; }, err => { console.log("err2", err); }); // 1秒后,输出:err2 reject promise

        this.rejectPromise().catch().catch(err => { console.log("err3", err); }); // 1秒后,输出:err3 reject promise

        this.rejectPromise()
            .catch(err => { }) // 定义了 onrejected 回调,在赋值到变量或链式调用时,将不再被执行
            .catch(err => { console.log("err4", err); }); // 无输出
        this.rejectPromise()
            .catch(err => { return err; }) // 定义了 onrejected 回调,在赋值到变量或链式调用时,将不再被执行
            .catch(err => { console.log("err5", err); }); // 无输出
    }

}
Promise await 返回值测试
// LayaAir3.x 中测试
const { regClass, property } = Laya;

@regClass()
export class TestPromiseAwaitReturn extends Laya.Script {

    public createSpriteAsync(): Promise<Laya.Sprite> {
        return new Promise((resolve, reject) => {
            setTimeout(() => {
                const sprite = new Laya.Sprite();
                resolve(sprite);
            }, 1000);
        });
    }

    public createSpriteAsyncErr(): Promise<Laya.Sprite> {
        return new Promise((resolve, reject) => {
            setTimeout(() => {
                reject(new Error("create sprite error"));
            }, 1000);
        });
    }


    public async onAwake() {
        const promise: Promise<Laya.Sprite> = this.createSpriteAsync();
        console.log("promise:", promise); // promise: Promise {<pending>}[[Prototype]]: Promise[[PromiseState]]: "fulfilled"[[PromiseResult]]: Sprite

        const sprite: Laya.Sprite = await this.createSpriteAsync();
        console.log("sprite:", sprite); // 1秒后,输出:sprite: Sprite {_bits: 9, _reactiveBits: 16, _hideFlags: 0, _parent: null, _destroyed: false, …}


        const promise1: Promise<Laya.Sprite> = this.createSpriteAsyncErr();
        console.log("promise1:", promise1); // promise1: Promise {<pending>}[[Prototype]]: Promise[[PromiseState]]: "rejected"[[PromiseResult]]: Error: create sprite error at ...

        const sprite1: Laya.Sprite = await this.createSpriteAsyncErr();
        // 因报错而中止,此处以下的所有代码不会执行
        console.log("sprite1:", sprite1);
    }

}