jQuery.inArray (), jak z niego prawidłowo korzystać?

345

Pierwszy raz pracuję jQuery.inArray()i to działa trochę dziwnie.

Jeśli obiekt znajduje się w tablicy, zwróci 0, ale 0 w kodzie JavaScript jest fałszywe. Więc wypisane zostaną: „NIE jest w tablicy”

var myarray = [];
myarray.push("test");

if(jQuery.inArray("test", myarray)) {
    console.log("is in array");
} else {
    console.log("is NOT in array");
}

Będę musiał zmienić instrukcję if na:

if(jQuery.inArray("test", myarray)==0)

Ale to sprawia, że ​​kod jest nieczytelny. Zwłaszcza dla kogoś, kto nie zna tej funkcji. Spodziewają się, że jQuery.inArray („test”, moja tablica) daje wartość true, gdy „test” znajduje się w tablicy.

Więc moje pytanie brzmi: dlaczego tak się dzieje? Naprawdę nie lubię tego. Ale musi być dobry powód, aby zrobić to w ten sposób.

nbar
źródło

Odpowiedzi:

734

inArrayzwraca indeks elementu w tablicy, a nie wartość logiczną wskazującą, czy element istnieje w tablicy. Jeśli element nie został znaleziony, -1zostanie zwrócony.

Aby sprawdzić, czy element znajduje się w tablicy, użyj:

if(jQuery.inArray("test", myarray) !== -1)
Dennis
źródło
16
CoffeeScript:if jQuery.inArray('test', myarray) isn't -1
Joshua Pinter
9
Oczywiście zawsze można zdefiniować własną, bardziej intuicyjną funkcję, taką jak$.isInArray = function(test,array) { return $.inArray(test, array) !== -1; };
Wesley Smith
1
Lub krócej: $.isInArray = function(item, array) { return !!~$.inArray(item, array); };(Chciałbym zachować taki tajemniczy kod w dobrze nazwanej funkcji, aby zachować jasność intencji :))
Dennis
2
Dzięki @ Chips_100 za pokazanie wizualnym uczniom, jak to zrobić dobrze, byłoby miło, gdyby jQuery mógł zaktualizować, aby uwzględnić to w swoim przykładzie.
asherrard
2
możesz również użyćif( $.inArray(test, array) > -1) { // do stuff }
MistyDawn
48

$.inArrayzwraca indeks elementu, jeśli został znaleziony, lub -1, jeśli nie jest - nie jest wartością logiczną. Więc poprawne jest

if(jQuery.inArray("test", myarray) != -1) {
    console.log("is in array");
} else {
    console.log("is NOT in array");
} 
Jon
źródło
26

Odpowiedź pochodzi z pierwszego akapitu sprawdzania dokumentacji, czy wyniki są większe niż -1, a nie, czy jest to prawda czy fałsz.

Metoda $ .inArray () jest podobna do rodzimej metody JavaScript .indexOf (), ponieważ zwraca -1, gdy nie znajdzie dopasowania. Jeśli pierwszy element w tablicy odpowiada wartości, $ .inArray () zwraca 0.

Ponieważ JavaScript traktuje 0 jako luźno równe false (tj. 0 == fałsz, ale 0! == fałsz), jeśli sprawdzamy obecność wartości w tablicy, musimy sprawdzić, czy nie jest ona równa (lub większa niż ) -1.

Patsy Issa
źródło
23

Właściwym sposobem korzystania inArray(x, arr)jest wcale nie używanie go , a używanie zamiast niego arr.indexOf(x).

Oficjalna standardowa nazwa jest również bardziej wyraźna w fakcie, że zwrócona wartość jest indeksem, więc jeśli przekazany element jest pierwszym, otrzymasz go 0(to jest fałsz w JavaScript).

(Uwaga: niearr.indexOf(x) jest obsługiwany w przeglądarce Internet Explorer do wersji IE9 , więc jeśli potrzebujesz obsługi IE8 i wcześniejszych wersji, nie będzie to działać, a funkcja jQuery jest lepszą alternatywą).

6502
źródło
1
Muszę się zgodzić. Nazwa inArray jest myląca. Wydaje się, że powinien zwrócić wartość logiczną, ale robi dokładnie to samo, co indexOf
namiot Enrique Moreno
Za każdym razem, gdy $.inArrayużyłem na początku jakiegoś kodu, musiałem naprawić błąd, jęczę. W każdym razie powinna to być zaakceptowana odpowiedź.
Aluan Haddad
11

Lub jeśli chcesz uzyskać odrobinę fantazji, możesz użyć bitowych operatorów not (~) i logicznych not (!), Aby przekonwertować wynik funkcji inArray na wartość boolowską.

if(!!~jQuery.inArray("test", myarray)) {
    console.log("is in array");
} else {
    console.log("is NOT in array");
}
Jason
źródło
4
Zastosowanie operatorów bitowych jest ogólnie zabronione / odrzucone we wspólnych standardach kodowania JavaScript. Więc jeśli używasz lintera (jshint, eslint itp.), Prawdopodobnie nie dostaniesz tego poprzez przegląd kodu. Rozwiązanie działa jednak.
jhrr
8

Zwykle używam

if(!(jQuery.inArray("test", myarray) < 0))

lub

if(jQuery.inArray("test", myarray) >= 0)
DDan
źródło
3
Jeszcze lepiej ...if( $.inArray("test", myarray) > -1 )
MistyDawn
8

Metoda jQuery inArray () służy do wyszukiwania wartości w tablicy i zwracania jej indeksu, a nie wartości logicznej. A jeśli wartość nie zostanie znaleziona, zwróci -1.

Aby sprawdzić, czy wartość jest obecna w tablicy, postępuj zgodnie z poniższą praktyką:

myArray = new Array("php", "tutor");
if( $.inArray("php", myArray) !== -1 ) {

    alert("found");
}

Odniesienie

Hassan Amir Khan
źródło
7

inArrayZwraca wskaźnik obiektu podany jako pierwszy argument funkcji w tablicy dostarczanego jako drugi argument funkcji.

Kiedy inArrayzwraca 0, oznacza to, że pierwszy argument został znaleziony na pierwszej pozycji dostarczonej tablicy.

Aby użyć inArrayw instrukcji if użyj:

if(jQuery.inArray("test", myarray) != -1) {
    console.log("is in array");
} else {
    console.log("is NOT in array");
}

inArrayzwraca, -1gdy pierwszy argument przekazany do funkcji nie zostanie znaleziony w tablicy przekazanej jako drugi argument.

Kevin Bowersox
źródło
5

zamiast używać jQuery.inArray()możesz również użyć includesmetody dla tablicy int:

var array1 = [1, 2, 3];

console.log(array1.includes(2));
// expected output: true

var pets = ['cat', 'dog', 'bat'];

console.log(pets.includes('cat'));
// expected output: true

console.log(pets.includes('at'));
// expected output: false

sprawdź oficjalny post tutaj

Saurabh Solanki
źródło
1
zawiera nie jest obsługiwany przez IE - :: use indeOf
anoldermark
3

jQuery.inArray () zwraca indeks elementu w tablicy lub -1, jeśli element nie został znaleziony. Przeczytaj więcej tutaj: jQuery.inArray ()

Darvex
źródło
3

Zwróci indeks elementu w tablicy. Jeśli nie zostanie znaleziony, otrzymasz-1

Johan
źródło
3

Jeśli chcemy sprawdzić, czy element znajduje się w zestawie elementów, możemy na przykład:

var checkboxes_checked = $('input[type="checkbox"]:checked');

// Whenever a checkbox or input text is changed
$('input[type="checkbox"], input[type="text"]').change(function() {
    // Checking if the element was an already checked checkbox
    if($.inArray( $(this)[0], checkboxes_checked) !== -1) {
        alert('this checkbox was already checked');
    }
}
Gustavo Andrade Ferreira
źródło
2
/^(one|two|tree)$/i.test(field) // field = Two; // true
/^(one|two|tree)$/i.test(field) // field = six; // false
/^(раз|два|три)$/ui.test(field) // field = Три; // true

Jest to przydatne do sprawdzania zmiennych dynamicznych. Ta metoda jest łatwa do odczytania.

Сергей Савельев
źródło
2

$.inArray()robi DOKŁADNĄ TĄ SAMĄ RZECZY jak myarray.indexOf()i zwraca indeks elementu, który sprawdzasz w tablicy pod kątem istnienia. Jest po prostu kompatybilny z wcześniejszymi wersjami IE przed IE9. Najlepszym wyborem jest prawdopodobnie użycie, myarray.includes()które zwraca logiczną wartość prawda / fałsz. Zobacz fragment kodu poniżej, aby uzyskać przykłady wszystkich 3 metod.

// Declare the array and define it's values
var myarray = ['Cat', 'Dog', 'Fish'];

// Display the return value of each jQuery function 
// when a radio button is selected
$('input:radio').change( function() {

  // Get the value of the selected radio
  var selectedItem = $('input:radio[name=arrayItems]:checked').val();
  $('.item').text( selectedItem );
  
  // Calculate and display the index of the selected item
  $('#indexVal').text( myarray.indexOf(selectedItem) );
  
  // Calculate and display the $.inArray() value for the selected item
  $('#inArrVal').text( $.inArray(selectedItem, myarray) );
  
  // Calculate and display the .includes value for the selected item
  $('#includeVal').text( myarray.includes(selectedItem) );
});
#results { line-height: 1.8em; }
#resultLabels { width: 14em; display: inline-block; margin-left: 10px; float: left; }
label { margin-right: 1.5em; }
.space { margin-right: 1.5em; }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Click a radio button to display the output of
&nbsp;<code>$.inArray()</code>
&nbsp;vs. <code>myArray.indexOf()</code>
&nbsp;vs. <code>myarray.includes()</code>
&nbsp;when tested against
&nbsp;<code>myarray = ['Cat', 'Dog', 'Fish'];</code><br><br>

<label><input type="radio" name="arrayItems" value="Cat"> Cat</label>
<label><input type="radio" name="arrayItems" value="Dog"> Dog</label>
<label><input type="radio" name="arrayItems" value="Fish"> Fish</label>  
<label><input type="radio" name="arrayItems" value="N/A"> ← Not in Array</label>
<br><br>

<div id="results">
  <strong>Results:</strong><br>
  <div id="resultLabels">
    myarray.indexOf( "<span class="item">item</span>" )<br>
    $.inArray( "<span class="item">item</span>", myarray )<br>
    myarray.includes( "<span class="item">item</span>" )
  </div>
  <div id="resultOutputs">
    <span class="space">=</span><span id="indexVal"></span><br>
    <span class="space">=</span><span id="inArrVal"></span><br>
    <span class="space">=</span><span id="includeVal"></span>
  </div>
 </div>

MistyDawn
źródło
Należy zauważyć, że $.inArraypowinien być złotym standardem, jeśli masz dostęp do biblioteki jQuery. W przeciwnym razie .indexOfnależy użyć JavaScript z polifillem dla IE8. Trzymaj się z dala od takich nowoczesnych rzeczy jak .includes().
Alexander Dixon,
1

Człowieku, sprawdź dokument .

na przykład:

var arr = [ 4, "Pete", 8, "John" ];
console.log(jQuery.inArray( "John", arr ) == 3);
Alberto Cerqueira
źródło
1

Z jakiegoś powodu, gdy próbujesz sprawdzić element DOM jquery, nie będzie działał poprawnie. Więc przepisanie funkcji by załatwiło sprawę:

function isObjectInArray(array,obj){
    for(var i = 0; i < array.length; i++) {
        if($(obj).is(array[i])) {
            return i;
        }
    }
    return -1;
}
Joeneter10
źródło
1

var abc = {
      "partner": {
        "name": "North East & Cumbria (EDT)",
        "number": "01915008717",
        "areas": {
        "authority": ["Allerdale", "Barrow-in-Furness", "Carlisle"]
        }
      }
    };
    
    
    $.each(abc.partner.areas, function(key, val){
     console.log(val);
      if(jQuery.inArray("Carlisle", val)) {
        console.log(abc.partner.number);
    }
    });
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

abhinavxeon
źródło
0

Po prostu nikt nie używa $zamiast jQuery:

if ($.inArray(nearest.node.name, array)>=0){
   console.log("is in array");
}else{
   console.log("is not in array");
}
William Hu
źródło
Jestem tylko ciekawy dlaczego? Czy powoduje to jakiś nietypowy problem ze zgodnością? Nigdy nie miałem żadnych problemów z używaniem $zamiast jQuery.
MistyDawn
0

najkrótsza i najprostsza droga to.

arrayHere = ['cat1', 'dog2', 'bat3']; 

if(arrayHere[any key want to search])   
   console.log("yes found in array");
Muhammad Amir Shahzad
źródło