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

推荐订阅源

罗磊的独立博客
SecWiki News
SecWiki News
酷 壳 – CoolShell
酷 壳 – CoolShell
爱范儿
爱范儿
量子位
M
MIT News - Artificial intelligence
GbyAI
GbyAI
cs.AI updates on arXiv.org
cs.AI updates on arXiv.org
K
KPMG report finds enterprise disconnect between AI and its ROI | CIO
TaoSecurity Blog
TaoSecurity Blog
博客园 - 【当耐特】
H
Heimdal Security Blog
腾讯CDC
The Last Watchdog
The Last Watchdog
Security Archives - TechRepublic
Security Archives - TechRepublic
Hacker News: Ask HN
Hacker News: Ask HN
S
Schneier on Security
Microsoft Security Blog
Microsoft Security Blog
WordPress大学
WordPress大学
博客园 - 司徒正美
Recent Commits to openclaw:main
Recent Commits to openclaw:main
C
Cybersecurity and Infrastructure Security Agency CISA
S
SegmentFault 最新的问题
大猫的无限游戏
大猫的无限游戏
Application and Cybersecurity Blog
Application and Cybersecurity Blog
F
Full Disclosure
有赞技术团队
有赞技术团队
T
Tailwind CSS Blog
Engineering at Meta
Engineering at Meta
cs.CV updates on arXiv.org
cs.CV updates on arXiv.org
T
Threatpost
月光博客
月光博客
A
Arctic Wolf
OSCHINA 社区最新新闻
OSCHINA 社区最新新闻
雷峰网
雷峰网
T
Troy Hunt's Blog
freeCodeCamp Programming Tutorials: Python, JavaScript, Git & More
The Cloudflare Blog
D
DataBreaches.Net
O
OpenAI News
L
LINUX DO - 最新话题
宝玉的分享
宝玉的分享
小众软件
小众软件
V
Vulnerabilities – Threatpost
A
About on SuperTechFans
人人都是产品经理
人人都是产品经理
T
The Exploit Database - CXSecurity.com
Martin Fowler
Martin Fowler
美团技术团队
P
Privacy International News Feed

博客园 - 醒着/☆☆

移动硬盘删除不了东西 updata(dt:number)的常用用法 关键字 堆栈实现四则混合运算 在线资源 JS相比TS的缺点(或TS的优点) Vscode的JS debug环境 常见的代码片段 Cocos Creator-TypeScript与JS快速过渡 GooglePlay FB相关 上传速度慢 CocosCreator与Laya2.0区别 LayaBox 常用技巧 CSV的规范与使用 Laya2.0的转变 Laya for H5 之Bug追踪 常用资源 意外发现一个具有名称 的外部可见定义
TypeScript: this bind 和 回调的正确用法
醒着/☆☆ · 2018-10-23 · via 博客园 - 醒着/☆☆

TypeScript 中如果传递了 而且在回调函数中用了this 的话, 就要小心了, 这个this 不一定是指向当前类对象了,
如果想确保指向的还是那个对象的话, 需要在传递那个方法的时候, 先调用bind(this).
或者就是在回调的时候, 不要直接func(agrs) 而是改成 func.call(目标对象, args)

示例:

TestCallAndThis.ts 提供了2种回调的写法,第二种是推荐的写法
namespace naiking
{
    /**
     *author     : NaiKing
     *description: 
     */
    export class TestCallAndThis {
        /**
         * 不推荐的回调写法
         * 外部调用必须【必须】【必须】在回调参数方法后面添加.bind(this),
         * 否则可能会this异常
         */
        public static callBackTest(arg:number,callBack:Function):void
        {
            //返回 2 x arg
            let result:number=arg*2;
            //不推荐直接调用回调方法,应使用callBack.call(caller,result);
            callBack(result);
        }
        /**
         * 推荐的回调写法
         * @param arg 参数
         * @param caller 调用域 
         * @param method 指定的回调方法(兼容.bind(this) 也可以不加.bind(this) )
         */
        public static callMethod(arg:number,caller:any,method:Function):void
        {
            //返回 2 x arg
            let result:number=arg*2;
            //推荐的做法 .call(caller,result);
            method.call(caller,result);
           
        }
    }
}

调用(测试)

namespage naiking
{
   export class Luna
   {
   //注意观察,this异常的时候的isLoading的值是undefind private isLoading:
boolean = false; private getResult(rst:number):void { console.log("get rusult:"+rst+this.isLoading); } constructor() { //不推荐的回调写法, 遗漏了bind(this) logic.TestCallAndThis.callBackTest(1,this.getResult); //不推荐的回调写法, 使用了bind(this)( √ ) logic.TestCallAndThis.callBackTest(1,this.getResult.bind(this)); //提倡的回调写法 ,有无bind(this)都可以 logic.TestCallAndThis.callMethod(1,this,this.getResult); logic.TestCallAndThis.callMethod(1,this,this.getResult.bind(this)); }
}
}

运行第一种,this的指向是异常的,自然this.isLoading是undefind

打印的测试log:

get rusult:2undefined                     

后面的几种,都是正常的结果