Titanium JavaScript 事件处理程序和类范围答案

【问题标题】：Titanium JavaScript event handler and class scopeTitanium JavaScript 事件处理程序和类范围
【发布时间】：2013-09-26 13:44:56
【问题描述】：

在 Titanium 下开发时，我在 OOP JavaScript 和事件处理程序范围内遇到了这种奇怪的行为。这是我的代码：

MyClass = function()
{
   this.var1 = '50';
   this.button = Ti.UI.createButton({
      ...
   });
   this.button.parentRef = this;
   this.button.addEventListener('click', function(e){
      var self = e.source.parentRef;
      console.log(self.var1);
      console.log(self.var2);
   });

   this.var2 = 'Test';
   ...
   /* this.button is then added to a view */
};
... 
var c = new MyClass();
...

当我点击按钮时，我希望在控制台中找到：

50
Test

但实际上结果是：

50
<null>

如果我移动作业

this.var2 = '测试'

之前

this.button.addEventListener

语句，结果为：

50
Test

听起来 this.button.parentRef = 这个分配是通过复制而不是通过引用...

这种行为的原因是什么？

【问题讨论】：

您确定e.source 是按钮本身吗？它甚至不是标准的事件属性。
Ti.UI.createButton 是返回实际的 DOM 元素（在其上触发事件）本身还是创建一个包装器？
@Bergi 它为原生 android/ios 按钮创建了一个 proxy object
@C5H8NNaO4：糟糕，这可能会使我的回答无效。谢谢，我应该自己去找。你知道这些事件是否也被代理了吗？
@Bergi 源事件属性记录在这里：docs.appcelerator.com/titanium/latest/#!/api/…

标签： javascript titanium

【解决方案1】：

你是对的。

您正在做的事情与 Titanium 不同，每当您向 Titanium 原生对象添加属性时，它都会按值传递，因为底层对象（您的视图）实际上是一个 native 映射到一个 JavaScript 对象。那么发生的情况是该对象的当前值（在您的情况下为 this）通过 Javascript-to-native 桥发送并设置为本机对象的属性（或类似的东西）。

归根结底是，您设置的本机对象上的任何属性几乎都被该对象克隆，这就是您看到上述功能的原因。

那么有什么方法可以解决这个问题呢？

这是最简单的方法：

var self = this;
this.button.addEventListener('click', function(e){
    console.log(self.var1);
    console.log(self.var2);
});

它在某种程度上污染了您的按钮侦听器范围，但至少它不在全局范围内。

【讨论】：