我不明白 mdn 的闭包循环错误示例

问：

1.MDN示例

下面的代码片段分配了一个函数，该函数在聚焦时将帮助文本显示到每个文本字段，以下是指向 JsFiddle 的链接： https://jsfiddle.net/v7gjv/8164/

function showHelp(help) {
          document.getElementById('help').textContent = help;
        }
        
        function setupHelp() {
          var helpText = [
              {'id': 'email', 'help': 'Your e-mail address'},
              {'id': 'name', 'help': 'Your full name'},
              {'id': 'age', 'help': 'Your age (you must be over 16)'}
            ];
        
          for (var i = 0; i < helpText.length; i++) {
            var item = helpText[i];
            document.getElementById(item.id).onfocus = function() {
              showHelp(item.help);
            }
          }
        }
        
        setupHelp();

但它只会显示最后一个帮助文本，无论三个输入中的哪一个是重点。MDN 表示分配给所有三个输入的函数是一个闭包，因此当循环结束时，它们共享对变量 helpText 的相同引用，i=2，因此所有三个输入都引用了 helpText 中的最后一项。

2.My 测试

我不明白的部分是为什么所有三个输入都对同一个变量项具有相同的引用 我做了这样的测试

(function() {
  function closure() {
    var i = 0;
    return {
      display: function() {
        console.log(i);
      },
      add: function() {
        i += 1;
      }
    }
  }

  var a = closure();
  var b = closure();

  a.add();
  a.display(); //return 1
  b.display(); //return 0 
})()

3.My 想法和问题

从测试中，a 和 b 具有不同的 i 变量，a 的 i 发生了变化，但 b 保持不变。 但是在 for 循环中，所有输入都指向同一个变量，因此 for 循环更改值 i 导致所有输入都指向 helpText 中的最后一项

所以我的问题是为什么它们指向相同的变量，但在我的测试中 a，b 没有。