JavaScriptのいくつかのよく使われている解決forサイクルの中で同じ循環変数オブジェクトを参照する方法

JavaScriptのいくつかのよく使われている解決forサイクルの中で同じ循環変数オブジェクトを参照する方法
サンプルコード前提:HTMLコードのデフォルトは以下の通りです.

  
  0
  1
  2
  3
  4
  5

日常的にJSコードを作成する時、私達はよく次のような状況に遭遇します.
  各ボタンをクリックしたいときは、クリックされたボタンの索引を参照します.

  var btns = document.getElementsByTagName('button');
  for(var i=0;i<btns.length;i++){
      btns[i].onclick = function(){
       	  alert(i); //         i   6
       	};

  上記のような状況が発生したのは、JSにはブロックレベルの作用領域がなく、forサイクルにおけるサイクル変数iはグローバルスコープであり、関数で指すのは同じ変数iであり、このiは最後のループ後の値は6に変更されるからである.
  最近、何気なくいくつかの比較的によく使われている解決方法を発見しました.
方法1:for循環外部で独立した関数作用領域を作成し、循環変数値を転送します.

 for (var i = 0; i < 3; i++) {
     bindEvent(i); //         i
  };
 function bindEvent(n) {
     btns[n].onclick = function () {
          alert(n);
  };

方法2:関数をクリックする前に循環変数iの値を保存します.

 for(var i=0;i

方法3:クローズドメソッドで解決する(プライベートスコープ):

 for(var i=0;i

方法四:ECMAでletキーワードを追加してvarの代わりにする:
  letキーは、変数を宣言のスコープ(すなわちブロックレベルのスコープ)に結合します.

 for(let i=0;i