JavaScript: For-Loop传递变量

Question

我一直在为一个问题苦苦挣扎，但找不到任何解决方案。尽管我已阅读 this question and answers on Whosebug，但我无法弄清楚哪里出了问题。可能是由于缺乏良好的英语。所以欢迎德语回答。

但是，我试图将变量传递给 for 循环之外的另一个函数。这是我的代码：

"use strict";
// gobal vars
var sort = new Array();

$(document).ready(function(){

// Sortable.js
// Copyright 2013-2015 Lebedev Konstantin <ibnRubaXa@gmail.com>
// http://rubaxa.github.io/Sortable/

    var min = 2,
        max = 5,
        elems = new Array();
    elems[0] = document.getElementById("left");
    elems[1] = document.getElementById("center");
    elems[2] = document.getElementById("right");

    for(var i=0, len=elems.length; i<len; i++) {
        var amnt = elems[i].getElementsByTagName("div").length,
            group = "gewicht";
        if (amnt <= min) {
            group = {name: "gewicht", pull: false, put: true};
        } else if (amnt >= max) {
            group = {name: "gewicht", pull: true, put: false};
        }
        sort[i] = Sortable.create(elems[i], {
            group: group,
            animation: 150,
            ghostClass:"ghost",
            draggable: ".draggable",
            onSort: function(evt) {sortEnd(evt, i, min, max)}
        })
    }
});

function sortEnd(evt, j, min, max) {
    var targ = evt.target,
        amnt = targ.getElementsByTagName("div").length;
    console.log(j);
    amnt = targ.getElementsByTagName("div").length;
    if (amnt <= min) {
        sort[j].option("group", {name: "gewicht", pull: false, put: true});
    } else if (amnt > max) {
        sort[j].option("group", {name: "gewicht", pull: true, put: false});
    } else {
        sort[j].option("group", {name: "gewicht", pull: true, put: true});
    }
}

问题出在onSort: function(evt) {sortEnd(evt, i, min, max)}，其中for循环内的变量i为0、1、2。但在循环外，函数sortEnd()中的console.log()它将 return 3.

有我能理解的解释就好，能更好地解决我的问题，两者都最好。

谢谢

Answer 1

根据链接的问题，您需要将您的操作包装在一个函数中：

(function(group, i) {
  sort.push(Sortable.create(elems[i], {
    group: group,
    animation: 150,
    ghostClass:"ghost",
    draggable: ".draggable",
    onSort: function(evt) {sortEnd(evt, i, min, max)}
  }))
}(group, i));

否则 group 和 i 的每个实例都将引用相同的值。

此外，在使用数组时，请使用 push 而不是直接设置 ID。

Answer 2

问题是您的 i 变量正在被捕获，然后它的值正在改变。最好的解决方案是 IIFE（立即调用的函数表达式）：

for (var i = 0, len = elems.length; i < len; i++) {
  ..
  (function(val) {
    sort[val] = Sortable.create(elems[val], {
        group: group,
        animation: 150,
        ghostClass:"ghost",
        draggable: ".draggable",
        onSort: function(evt) {sortEnd(evt, val, min, max)}
    });
  })(i);
}

JavaScript: For-Loop传递变量

JavaScript: For-Loop passing variables

javascript

variables

loops

for-loop