【问题标题】:Push Functions to an array, Convert let to var将函数推送到数组,将 let 转换为 var
【发布时间】:2018-06-13 20:36:39
【问题描述】:

是否可以使用var 而不是let 将函数推送到数组。我正在查看的代码是:

function slideRightLoop() {
    let work = [];

    for (var n = 1; n < 5; n++) {
        let next = (n + 1 < 5) ? n + 1 : 1;
        let el = document.querySelector(".position_" + n)[0];
        var change = function change () {
            el.classList.add("position" + next);
            el.classList.remove("position_" + n);
        }
        work.push(change);
    }

    work.forEach(function (n) { 
      return n();
    });
}

【问题讨论】:

  • 为什么 var 不适合你?
  • @terary 我认为是因为它的块现在在每次迭代时都在范围内,因此可以重新分配并保持范围。但是,当我使用 var 时,我认为它会被提升并且不会在每个循环上重新分配。
  • because compatibility 兼容性是什么意思?如果你需要支持古老的浏览器,你可以通过 Babel 运行它。另外,不要使用querySelectorAll 并选择NodeList 中的第一个元素,而是使用querySelector。我没有看到将每个函数放在一个数组中然后执行它的意义——为什么不只使用一个循环来执行每个块?
  • @CertainPerformance 更改为querySelector 并去掉了箭头函数并更改了其中的一些变量。我只是不知道是否有可能通过将函数推送到可以使用var 的数组来保持这种愚蠢,或者是否只需要废弃它并在执行时将元素推送到常规数组。

标签: javascript variables ecmascript-6 scope ecmascript-5


【解决方案1】:

您可以将其放入https://babeljs.io/repl/ 并查看转换为什么。最简单的方法是让循环体成为一个接受所有循环变量作为参数的函数:

function slideRightLoop(n, work) {
  var next = (n + 1 < 5) ? n + 1 : 1;
  var el = document.querySelector(`.position_${n}`);
  var change = function change () {
      el.classList.add(`position_${next}`);
      el.classList.remove(`position_${n}`);
  }
  work.push(change);
}

function slideRight() {
    var work = [];

    for (var n = 1; n < 5; n++) {
      slideRightLoop(n, work);
    }

    work.forEach(function (n) { 
      return n();
    });
}

【讨论】:

  • 这非常有用。我还注意到那里的模板文字,所以通过并删除了它们。但是,是的,谢谢你的回答。也有点 geekin' rn 你摇滚。
  • 啊,我忽略了模板文字:D
【解决方案2】:

要使用var 做你想做的事,你可以使用一个临时函数来围绕你的nnext 值创建一个闭包。

我稍微更改了代码以保留有意义的部分

function slideRight() {
    let work = [];

    for (var n = 1; n < 5; n++) {
        var next = (n + 1 < 5) ? n + 1 : 1;
        let change = function(next, n){
          return function change () {
          console.log(next, n)
        }}
        work.push(change(next, n));
    }
  

    work.forEach(function (n) { 
      return n();
    });
}

slideRight()

这应该会输出所需的值

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2015-09-10
    • 1970-01-01
    • 1970-01-01
    • 2021-01-27
    • 1970-01-01
    • 2020-07-10
    • 1970-01-01
    相关资源
    最近更新 更多