Flex中的this指向

为了便于对比和叙述，我们先上一段最简单的js+html代码：

<input type="button" value="test" id="htmBtn" onclick="alert(this.id)">

用惯js+html的程序员都知道，这里的this指向触发事件的html组件本身，所以this.id将如愿显示为”htmBtn”。

但是在flex3中，你写事件侦听函数时，this关键字将指向application，而不再指向触发事件本身的组件上了（与js+html完全不同）：

例如：

<mx:ComboBox name="ttt"  change="Alert.show('you have change the data!'+this.selectedLabel)">
<mx:dataProvider>
<mx:String>Dogs</mx:String>
<mx:String>Cats</mx:String>
<mx:String>Mice</mx:String>
</mx:dataProvider>
</mx:ComboBox>

中的this.selectedLabel将找不到任何东东。因为this并没有指向这个combobox！！！

那么怎么找到触发事件的组件呢？flex提供了event.currentTarget来指定触发事件的当前组件，如下方式：

<mx:ComboBox name="ttt"  change="Alert.show('you have change the data!'+event.currentTarget.selectedLabel)">
<mx:dataProvider>
<mx:String>Dogs</mx:String>
<mx:String>Cats</mx:String>
<mx:String>Mice</mx:String>
</mx:dataProvider>
</mx:ComboBox>

或者：

<mx:Script><![CDATA[
private function changeEvt(e:Event):void {
Alert.show('you have change the data!'+e.currentTarget.selectedLabel)"
}
]]></mx:Script>

<mx:ComboBox name="ttt"  change="changeEvt(event)"><mx:dataProvider>
<mx:String>Dogs</mx:String>
<mx:String>Cats</mx:String>
<mx:String>Mice</mx:String>
</mx:dataProvider>
</mx:ComboBox>

 

官方文档还提出了特别说明，使用event.currentTarget时有一个好习惯可以参考，即，最好先指定好该组件的类型，例如TextInput(e.currentTarget)，这样做的目的是防止由于该组件某个属性不存在时，编译时不报错而运行时才报错，看代码就明白了：

<?xml version="1.0"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">

<mx:Script><![CDATA[

import mx.core.UIComponent;

private function tiHandler(e:Event):void {

/* 
这段代码将会在运行时报错，而编译时不报错。因为TextInput根本没有tmesis属性
e.currentTarget.tmesis = 4;
*/

/*
这段代码的用法，就能在编译时便发现错误，不用等到运行时才报错
TextInput(e.currentTarget).tmesis = 4;
*/

}

]]></mx:Script>

<mx:TextInput id="ti1" click="tiHandler(event)"

text="This is some text. When you click on this control, the first three characters

are selected."/>

</mx:Application>