忍者ブログ
[117] [116] [115] [114] [113] [112] [111] [110] [109] [108] [107]

DATE : 2017/12/12 (Tue)
×

[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。


DATE : 2006/07/23 (Sun)

今日やってしまったミスをメモしておきます orz

例えば、次のようなオブジェクトを定義したとします。

function MyObject() {
    this.a = 100;
}

MyObject.prototype = {
    call : function() {
        alert(this.a);
    }
}

このコードでは、メソッドとして call 関数(引数なし)をもつ MyObject を定義しています。

そして、次のコードを実行すると、「100」と書かれたダイアログが表示されます。

var myObject = new MyObject();

myObject.call();

これは、call 関数の中の「this」キーワードが、生成された MyObject を表しているためです。

ここで、次のような関数を用意します。この関数は、他の関数(Function オブジェクト)を受け取って呼び出す関数です。

function callFunction(callback) {
    callback();
}

次のコードを実行すれば、myObject の call 関数が呼び出されるはずです。

var myObject = new MyObject();

callFunction(myObject.call);

しかし、表示されるダイアログには「undefined」と出てしまいます。つまり、call 関数の中にある「this.a」が定義されていないということになります。

実際には、JavaScript の「this」は、呼び出し元を表します。つまり、「myObject.call()」で call 関数を呼び出した場合には、myObject 経由で call 関数が呼び出されるので「this」は myObject を指します。しかし、「callFunction(myObject.call)」(実際の呼び出しは「callback()」)では、myObject を経由せずに直接 call 関数が呼び出されるので、「this」は myObject を指しません(Firefox での実行では、Window オブジェクトを指しました)。そのため、「undefined」となったわけです。

ついつい Java と同じつもりでコードを書いていて、見事に失敗してしまいました orz

(;^ω^)まあ、言語の使い初めにはよくあることですね。

PR
●この記事にコメントする
お名前
タイトル
文字色
メールアドレス
URL
コメント
パスワード
●この記事へのトラックバック
この記事にトラックバックする:
忍者ブログ [PR]
ブログ内検索
最近の状況
リンク
カレンダー
11 2017/12 01
S M T W T F S
1 2
3 4 5 6 7 8 9
10 11 12 13 14 15 16
17 18 19 20 21 22 23
24 25 26 27 28 29 30
31
使用許諾
最新コメント
(08/15)
(05/04)
(03/06)
(03/04)
(09/25)
最新トラックバック
T/O
(11/05)
ブログ内検索
最近の状況
リンク
カレンダー
11 2017/12 01
S M T W T F S
1 2
3 4 5 6 7 8 9
10 11 12 13 14 15 16
17 18 19 20 21 22 23
24 25 26 27 28 29 30
31
使用許諾
最新コメント
(08/15)
(05/04)
(03/06)
(03/04)
(09/25)
最新トラックバック
T/O
(11/05)