0

今日、私は自分のjavascriptコードの一部をcoffeescriptに移行していて、本当にばかげた何かで立ち往生していましたが、それを機能させる方法がわかりませんでした。

クリックイベントがトリガーされたときにグローバル変数の値を更新したかったので、以下のコードを見て、私の推測の1つを確認してください。

これがコードです

@activeObject = null

# Some other code

$ ->
  $('#header').click ->
    if !headerSelected  
      showMenu '#header-menu', event
    else
      @activeObject = "#header"
      showMenu '#menu-style-header', event

残念ながら、クリックイベントがトリガーされても、変数は更新されませんでした。

私は回避策を思いついた。変数の値を設定する関数を作成し、割り当ての代わりにそれを呼び出しましたが、今回は機能しました。

なぜ他の方法でそれができなかったのか知りたかっただけです。私にとっては単純な操作であり、このためだけに新しい関数を定義するのはばかげているように見えました。

4

2 に答える 2

2

@混乱は、基本的にこれのショートカットにすぎないの使用法に関するものだと思います。コードをコンパイルして、それが生成するCoffeeScriptコンパイラを確認すると、混乱が明らかになります。

this.activeObject = null;

$(function() {
  return $('#header').click(function() {
    if (!headerSelected) {
      return showMenu('#header-menu', event);
    } else {
      this.activeObject = "#header";
      return showMenu('#menu-style-header', event);
    }
  });
});

activeObjectがグローバルの場合、それを参照します

window.activeObject = null

window.activeObject = "#header";

このコードの両方のオカレンスで、2回目のオカレンスでウィンドウなしで使用したくなるかもしれませんが、それにより、新しいローカル変数が単純に定義されます。

一般に、CoffeeScriptから始める場合は、タブのhttp://coffeescript.org/でこのような小さなスニペットを試すと便利です。 Try Now

于 2012-08-26T20:36:27.020 に答える
2

あなたの問題は、クリックハンドラーの内側の@(AKA this)が外側の(AKA)と同じではないということです。

@activeObject = null

この:

@activeObject = "#header"

2つの異なるを参照していactiveObjectます。=>あなたは正しいものを得るためにすべてをバインドすることができるはずですthis

$ =>
  $('#header').click =>
    #...

以上(IMHO)の場合はwindow.activeObject、両方の場所で直接参照するだけで、グローバル変数を参照していることがすべての人にわかります。

window.activeObject = null
$ ->
  $('#header').click ->
    if !headerSelected  
      showMenu '#header-menu', event
    else
      window.activeObject = "#header"
      showMenu '#menu-style-header', event

または、おそらくデータ属性を優先して、グローバルの使用を完全に停止することもできます。

$ ->
  $('#header').data 'activeObject', null
  $('#header').click ->
    if !headerSelected  
      showMenu '#header-menu', event
    else
      $(@).data 'activeObject', '#header'
      showMenu '#menu-style-header', event
于 2012-08-26T08:11:04.280 に答える