3

ここでJavaScriptを初めて使用します。

だから私はRaphael.jsの使い方を学ぼうとしていて、このhttp://jsfiddle.net/terryyounghk/AeU2r/コードスニペットに出くわしました。

167行目を見ると、私には理解できないこの「if」ステートメントがあります。

   Raphael.el.style = function (state, style, aniOptions)
    {
     if (!this.class)
     {
        this.class = style ? style : 'default';
        this.aniOptions = aniOptions ? aniOptions : null;

        // start assigning some basic behaviors
        this.mouseover(function () { this.style('hover'); });
    ....

どのクラス？何が戻ってきますか？誰がそれを返しますか？

何をチェックしているの？それはクラスですか？

4

3 に答える 3

4

Raphael documentationから、独自のメソッドをクラスRaphael.elに追加する方法です。Raphael.element一般に、このクラスの目的は、SVG 要素の操作を容易にすることです。

this.classコード例の は、前の文で使用されているように、プログラミングの意味でクラスという単語とは何の関係もありません。(私が見る限り) 標準の Raphael フレームワークの一部でもありません。classまた、HTML および SVG 要素が持つことができる属性を参照するものでもなく、通常、element.classNameまたはを使用して JavaScript でアクセスされますelement.setAttribute('class', '...')。

thisは要素ラッパー オブジェクト ( のインスタンスRaphael.element) を参照しており、このメソッドを作成した人は単にその名前を使用classして要素ラッパーに追加情報を格納したようです。(コメントで指摘されているように、これはclassjavascript の予約済みキーワードであるため、悪い考えかもしれませんが、とにかく機能します。)

具体的には、この例では、Raphael またはコードの他のどこにも値が割り当てられていないため、this.class最初はです。句では、 にundefined評価され、次の行では、関数 for に値が渡されていないため、「デフォルト」に評価されます。したがって、値「デフォルト」が割り当てられます。その後、形状を右クリックしてUse custom styleを選択すると、その形状の が「カスタム」になります。if!undefinedtruestylestyle ? style : 'default'this.classclass

JavaScript を使用すると、どこにも初期化されていないオブジェクトのプロパティを簡単に参照したり、値を代入したりできることに注意してください。エラーはスローされませんが、undefined値が割り当てられていない場合は単純に戻ります。

何が起こっているかをブラウザコンソールに記録する行を挿入することで、これらすべてを見ることができます:

console.log('style', state, style, aniOptions, this, 'class:', this.class);

次に、ブラウザーの開発者ツールを使用して出力 ( JSFiddle ) を確認します。

于 2013-01-13T15:21:47.770 に答える
0

プロパティclassが定義されているかどうかを確認し、定義されていない場合はに割り当てstyle ? style : 'default'ます。

于 2013-01-13T10:40:30.640 に答える
0

表示されているのは単なる条件文です。これを省略形のif-else-clauseとして見てください。これは、styletrueまたはfalseと評価されるかどうかをチェックし、trueの場合this.Classは値をstyle、そうでない場合はの値を取得します'default'。

raphael.jsがどのように機能するかはわかりませんが、単なるhtml要素クラスのように見えます。

于 2013-01-13T10:42:20.537 に答える