web-dev-qa-db-ja.com

document.readyでCoffeeScriptクラスを実行する

私が持っています

class Main
   test:->
      alert "yay!"

coffeescriptで、index.html内で実行したい

<script>
    $(function(){
        //and obv Main.test(); doesn't work
    });
</script>

ウェブサイトにこれに関するメモがあります、それはそれが機能しないだろうと言います。しかし、私はそれを機能させる方法を見つけることができませんでした。何か案は?私はcoffeescriptクロージャーラッパーが何であるかを知る必要があります。

それとも、coffeescriptはdocument.readyの後に実行されますか?

どうも!

20
Devrim

_class Main_

代わりに_class @Main_を試してください。

obv Main.test();動作しません

正しい。 new Main().test()またはMain::test()である必要があります。

とにかく、coffeescriptはdocument.readyの後に実行されますか?

extras/coffee-script.js を介して実行し、jQueryを使用していると仮定します。

24
matyr

Document.readyの後にCoffeescriptを実行するには、次のようにjQueryを使用できます。

$ ->
  # Put your function code here
  init()

これは、次のリンクの3番目のセクションのようにjQuery(function(){callback ...})を実行しています。 http://api.jquery.com/jQuery/

これは基本的にこれを言います:

jQuery(callback)戻り値:jQuery説明:DOMの読み込みが完了したときに実行される関数をバインドします。

ドキュメントの準備ができていない外部のすべてのクラスなどを宣言してから、init関数を呼び出して、適切なタイミングで実行します。

お役に立てば幸いです。

26
Brandon

Coffeescriptはコードを関数呼び出しでラップするため、誤ってグローバル変数を上書きすることはありません。

変数、関数、またはクラスをグローバルにする(他のファイルからアクセスできるようにする)場合は、それらをthisまたはwindowにアタッチして、明示的にグローバルにする必要があります。

# Stays within the function scope, so you can't access it outside the file
myNotGlobalFunction -> return

# Attaches it to `this` aka `window`, so can be accessed globally
this.myGlobalFunction -> return

# A shortcut using @ which is an alias to `this.`
@myOtherGlobalFunction -> return

これは次のようにコンパイルされます。

(function() {
  myNotGlobalFunction(function() {
    return;
  });
  this.myGlobalFunction(function() {
    return;
  });
  this.myOtherGlobalFunction(function() {
    return;
  });
}).call(this);
9
Derek Dahmer

私も以前にこの問題に遭遇しました。まず、クラスを定義しているので、それをインスタンス化する必要があります。次に、インスタンスでtest関数を呼び出すことができます。

<script>
    $(function(){
        var an_instance_of_main = new Main();
        an_instance_of_main.test();
    });
</script>

ただし、ブラウザがMainクラスを見つけられないことに気付いたかもしれません。これは、CoffeeScriptがコンパイルされるときに、Mainがグローバルにアクセスできないようにするために、クラス定義の周りに自己実行関数をラップするためです。グローバルにアクセスできるようにする場合は、接頭辞としてwindowを付けることができます。

class window.Main
   test:->
      alert "yay!"

または、定義後に割り当てます。

class Main
   test:->
      alert "yay!"

window.Main = Main
0
Andrew