jQuery.inArray返回-1而不考慮值

Question

我正在嘗試使用jQuery的.inArray比較兩個數組。 這似乎很簡單，但是比較的每個值都返回-1（不在數組中）。 下面是我的代碼

finalClick();
function finalClick(){
    roles=["President", "Dog", "Treasurer"]
    neededRoles=["President", "Secretary", "Treasurer"];
    $(neededRoles).each(function(){
        if(jQuery.inArray(this, roles)=='-1'){
            console.log("not in array "+this);
        }
    });
}

如果您想玩轉它， 可以在這里查看我的小提琴。

提前致謝

Answer 1

在松散模式下， this 始終是對象類型，而不是原始類型。 因此，回調中的this是String ，而不是原始字符串。 inArray使用=== （嚴格相等）進行檢查，並且原始字符串並不嚴格等於String對象。

您可以選擇以下幾種方式：

使用嚴格模式

在嚴格模式下， this可以是原始的，因此您的代碼可以正常工作（如果添加變量聲明；請參見答案末尾的“附帶說明”）：

 "use strict"; var consoleLine = "<p class=\\"console-line\\"></p>"; console = { log: function (text) { $("#console-log").append($(consoleLine).html(text)); } }; finalClick(); function finalClick(){ var roles=["President", "Dog", "Treasurer"] var neededRoles=["President", "Secretary", "Treasurer"]; // console.log("test: "+roles[0]); var rolecount=0; console.log("value changed"); $(neededRoles).each(function(){ //console.log("this is this "+this+" "+rolecount+" "+roles[rolecount]); if(jQuery.inArray(this, roles)=='-1'){ console.log("Not in array "+this); } else { console.log("Found in array "+this); } //rolecount++; }); } 

 <div id="console-log"></div> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 

使用$.each代替$().each

代替$(neededRoles).each(...) ，使用$.each(neededRoles, function(index, role)並使用role ，它將是一個字符串基元：

 var consoleLine = "<p class=\\"console-line\\"></p>"; var console = { log: function (text) { $("#console-log").append($(consoleLine).html(text)); } }; finalClick(); function finalClick(){ var roles=["President", "Dog", "Treasurer"] var neededRoles=["President", "Secretary", "Treasurer"]; // console.log("test: "+roles[0]); var rolecount=0; console.log("value changed"); $.each(neededRoles, function(index, role){ //console.log("this is this "+this+" "+rolecount+" "+roles[rolecount]); if(jQuery.inArray(role, roles) == -1){ console.log("Not in array " + role); } else { console.log("Found in array " + role); } //rolecount++; }); } 

 <div id="console-log"></div> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 

使用Array#forEach和Array#indexOf

或者更好的方法是，使用Array#forEach和Array#indexOf ，在沒有它們的舊版瀏覽器中填充它們：

 var consoleLine = "<p class=\\"console-line\\"></p>"; var console = { log: function (text) { $("#console-log").append($(consoleLine).html(text)); } }; finalClick(); function finalClick(){ var roles=["President", "Dog", "Treasurer"] var neededRoles=["President", "Secretary", "Treasurer"]; // console.log("test: "+roles[0]); var rolecount=0; console.log("value changed"); neededRoles.forEach(function(role) { if (roles.indexOf(role) == -1) { console.log("Not in array " + role); } else { console.log("Found in array " + role); } //rolecount++; }); } 

 <div id="console-log"></div> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 

使用Array#filter

如果您的目標是查找所需的缺少角色，則可以使用Array#filter ：

 var consoleLine = "<p class=\\"console-line\\"></p>"; var console = { log: function(text) { $("#console-log").append($(consoleLine).html(text)); } }; finalClick(); function finalClick() { var roles = ["President", "Dog", "Treasurer"] var neededRoles = ["President", "Secretary", "Treasurer"]; var missingRoles = neededRoles.filter(function(role) { return roles.indexOf(role) == -1; }); console.log("Missing roles: " + missingRoles.join(", ")); } 

 <div id="console-log"></div> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 

---

旁注：您的原始代碼是“隱式全球性恐怖”的犧牲品，因為您沒有聲明很多變量。 我已經在上述所有示例中修復了該問題。

Answer 2

jQuery的each方法都有2個參數： index和element 。 如果您使用這些參數代替this參數， this代碼有效

var consoleLine = "<p class=\"console-line\"></p>";
console = {
    log: function (text) {
        $("#console-log").append($(consoleLine).html(text));
    }
};
finalClick();

function finalClick() {
    roles = ["President", "Dog", "Treasurer"]
    neededRoles = ["President", "Secretary", "Treasurer"];
    // console.log("test: "+roles[0]);
    rolecount = 0;
    console.log("value changed");
    $(neededRoles).each(function (i, e) {        // using index and element
        if (jQuery.inArray(e, roles) == '-1') {
            console.log("not in array " + e);
        }
    });
}

---

each方法的jQuery 文檔