TypeScript: this bind 和 回调的正确用法
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
后面的几种,都是正常的结果

TypeScript: this bind 和 回调的正确用法的更多相关文章
- 你不知道的JavaScript--Item9 call(),apply(),bind()与回调
1.call(),apply(),bind()方法 JavaScript 中通过call或者apply用来代替另一个对象调用一个方法,将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定 ...
- 转载~kxcfzyk:Linux C语言多线程库Pthread中条件变量的的正确用法逐步详解
Linux C语言多线程库Pthread中条件变量的的正确用法逐步详解 多线程c语言linuxsemaphore条件变量 (本文的读者定位是了解Pthread常用多线程API和Pthread互斥锁 ...
- Spring MVC中Session的正确用法<转>
Spring MVC是个非常优秀的框架,其优秀之处继承自Spring本身依赖注入(Dependency Injection)的强大的模块化和可配置性,其设计处处透露着易用性.可复用性与易集成性.优良的 ...
- C#中dynamic的正确用法
C#中dynamic的正确用法 http://www.cnblogs.com/qiuweiguo/archive/2011/08/03/2125982.html dynamic是FrameWork4 ...
- C# string.Split对于换行符的分隔正确用法
C# string.Split对于换行符的分隔正确用法 tmpCase "11117144-8c91-4817-9b92-99ec2f9d784a\r\n23D95A26-012C-4332 ...
- 【转】Spring MVC中Session的正确用法之我见
Spring MVC是个非常优秀的框架,其优秀之处继承自Spring本身依赖注入(Dependency Injection)的强大的模块化和可配置性,其设计处处透露着易用性.可复用性与易集成性.优良的 ...
- C#中dynamic的正确用法 以及 typeof(DynamicSample).GetMethod("Add");
dynamic是FrameWork4.0的新特性.dynamic的出现让C#具有了弱语言类型的特性.编译器在编译的时候不再对类型进行检查,编译期默认dynamic对象支持你想要的任何特性.比如,即使你 ...
- 【转】改善C#程序的建议2:C#中dynamic的正确用法 空间
dynamic是FrameWork4.0的新特性.dynamic的出现让C#具有了弱语言类型的特性.编译器在编译的时候不再对类型进行检查,编译期默认dynamic对象支持你想要的任何特性.比如,即使你 ...
- C#中dynamic、ExpandoObject 的正确用法
原文地址:http://www.cnblogs.com/qiuweiguo/archive/2011/08/03/2125982.html dynamic是FrameWork4.0的新特性.dynam ...
随机推荐
- 图片上传js
var imgURL; function getImgURL(node) { try{ var file = null; if(node.files && node.files[0] ...
- 配置xml报错:URI is not registered ( Setting | Project Settings | Schemas and DTDs )
报红提示:URI is not registered ( Setting | Project Settings | Schemas and DTDs ) 解决方法:打开Schemas and DTDs ...
- ZT 将sublime text的tab改为四个空格
打开Sublime Text3,选择菜单Preferences->Settings-User,打开用户配置文件(据本人理解,Settings-Default是不允许用户自己修改的~而Settin ...
- php 微信调用扫一扫
类库代码: <?phpclass JSSDK { private $appId; private $appSecret; public function __construct($appId, ...
- 《Pro SQL Server Internals, 2nd edition》15w
第三章 统计 SQL Server查询优化器在为查询选择执行计划时使用基于成本的模型.它估计不同执行计划的成本,并选择成本最低的一个.但是,请记住,SQL Server并不搜索可用于查询的最佳执行计划 ...
- MySQL之UNION与UNION ALL
数据表中的数据如下: UNION: 可以获取books表与articles表中所有不同的title,如果两个表中title相同的只会显示一个. UNION ALL : 可以获取books表与arti ...
- jQuery-4.动画篇---动画切换的比较(toggle与slideToggle以及fadeToggle的比较)
jQuery中toggle与slideToggle以及fadeToggle的比较 操作元素的显示和隐藏可以有几种方法.例如: 改变样式display为none 设置位置高度为0 设置透明度为0 都能达 ...
- C语言权威指南和书单 - 适用于所有级别
注:点击标题免费下载电子书 所有级别 1. The C Programming Language (2nd Edition) 2. C: A Reference Manual (5th Edition ...
- css flex方法标题左右两边平衡线
<html> <div class="title"> <div class="line"></div> < ...
- Mawawa CSS 学习之旅 Display
CSS 类型之 Display 更新时间: 2018-2-10: 一个良好的布局结构从 display 开始! 分类:外部值.内部值.列表值.属性值.混合值.显示值.全局值: 一.外部值 作用:主要用 ...