JavaScript 束縛された関数が呼ばれる bind について教えてください

Question

この関数の中でbind(null,elements[i])
で取得した引数からelementを渡していることがわかります。
menu-aはHTMLのノードです。メニューで表示されている文字です。

  var elements = document.getElementsByClassName('menu-a');
      for (var i = 0; i < elements.length; i++) {
        //ここのbindの第1引数がnullなのがわかりません。
        elements[i].onmouseover = changeTextToJapanese.bind(null, elements[i]);
        elements[i].onmouseout = changeTextToEnglish.bind(null, elements[i]);
      }

この関数を呼び出してelementを渡しています。

  // 英語→日本語に変換する関数。マウスオーバー時に呼ばれる。
    function changeTextToJapanese(element) {

      switch(element.innerHTML) {
        case 'About':
//つづく

MDNの説明では

bind() メソッドは、呼び出された時に新しい関数を生成します。新しい関数が呼び出される時、this キーワードは与えられた値がセットされ、ます。2 個目以降の引数は、新しい関数より前に、ターゲット関数の引数として与えられます。

fun.bind(thisArg[, arg1[, arg2[, ...]]])

thisArg
束縛された関数が呼ばれる時、this 値としてターゲット関数に渡される値を指定します。束縛された関数が new 演算子によって構築された場合、この引数は無視されます。
arg1, arg2, ...
ターゲット関数を呼び出す時、束縛された関数に与えられる引数の前に付けてターゲット関数に渡す引数。

this値としてターゲットに渡されるとはどういう意味でしょうか？
さらに理解できないのが、MDNの説明です

#MDNより引用
最もシンプルな bind() の使い方は、どのように呼び出された場合でも特定の this 値を持つ関数を生成することです。初心者の JavaScript プログラマーがよくやる間違いは、あるオブジェクトからメソッドを取り出し、後でその関数を呼び出すとき、その内側の this 値が元のオブジェクトになると考えてしまうことです（例えば、そのメソッドをコールバック関数に使うケース）。特に配慮しなければ、元のオブジェクトは失われてしまいます 【訳注: 取り出した関数内の this としては使えなくなる】。その関数に元々のオブジェクトを bind() して束縛された関数を生成すれば、この問題をきちんと解決することができます：

this.x = 9;    // this はブラウザーのグローバルな "window" オブジェクトを参照する
var module = { 
  x: 81,
  getX: function() { return this.x; }
};

module.getX(); // 81

var retrieveX = module.getX;
retrieveX(); 
// この関数はグローバルスコープで呼び出されるため9を返します。

// 'this' を module に結びつけた新しい関数を生成
// 初心者のプログラマーはグローバル変数の x と
// モジュールプロパティの x とを混同するかもしれません。
var boundGetX = retrieveX.bind(module);
boundGetX(); // 81

module.getX();で81が返却される意味がわかりません。
なぜこうなるのでしょうか？

Answer 1

module.getX();で81が返却される意味がわかりません。

this.x = 9;    // this はブラウザーのグローバルな "window" オブジェクトを参照する
var module = { 
  x: 81,
  getX: function() { return this.x; }
};

module.getX(); // 81

↑「return this.x」とありますね。
「this」というのは「module」自体のことを指します。
moduleの宣言内のxをmodule.getX()で返しているのです。

Comments

[happy_teeth]

ありがとうございます！
bindで第1引数が省略されているのは、自分自身の関数をオブジェクトとして渡していないからという理解で良いですか？

[think49]

> bindで第1引数が省略されているのは、

横からですが…、引数省略は boundGetX() を指しますか。
module.getX() は元々、第一引数が未定義なのでは？

[happy_teeth]

//ここのbindの第1引数がnullなのがわかりません。
elements[i].onmouseover = changeTextToJapanese.bind(null, elements[i]);
ここのことです。
boundGetX()ではないです。

[think49]

第一引数は省略されていません。this値はnullになります。

changeTextToJapanese() の第一引数を束縛する為、this値は何でもいいので指定された、というところだと思いますが、正確には本人に確認下さい。
少なくとも、私なら event.currentTarget で参照可能なノードを第一引数に束縛しません。