JavaScriptのthis参照について

JavaScriptに限らず、JavaやPHPなどにも出てくる[this参照]。
JavaScriptでも多言語と同じ感覚で使っていてまた問題も特になかったのですが、
きちんと勉強すると、関数内のthis参照は関数の呼び出し方で変化するということを知りました。

// Objectを定義
var obj = {
    x : 3,
    func : function() { console.log('x : ' + this.x); }
}

// obj.funcをトップレベルの変数にコピー
var f = obj.func;


// f(); を実行する
f();   // 実行結果 => x : undefined

// トップレベルに変数xを定義
var x = 5;

// 再度f();を実行
f();   // 実行結果 => x : 5

感覚的には、12行目の関数の結果にて、
[x : 3]と表示してもらいところですが、結果は[x : undefined] となってしまいました。

これは、関数の実行がトップレベルにて行われているため、
thisはトップレベルを表すことになってしまった為です。

そのため、15行目に変数xを定義してf();を実行すると、実行結果に影響が出るという結果に。

恐らく素直なコーディングを行なっていればこのような動きには気付かないかと思いますが、一つ勉強になりました。