jQuery.inArray (), come usarlo nel modo giusto?


345

La prima volta che lavoro jQuery.inArray()e si comporta in modo un po 'strano.

Se l'oggetto si trova nella matrice, restituirà 0, ma 0 è falso in Javascript. Quindi verrà generato: "NON è in array"

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

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

Dovrò cambiare la dichiarazione if in:

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

Ma questo rende il codice illeggibile. Soprattutto per qualcuno che non conosce questa funzione. Si aspetteranno che jQuery.inArray ("test", myarray) dia true quando "test" è nella matrice.

Quindi la mia domanda è: perché è fatto in questo modo? Non mi piace davvero. Ma ci deve essere una buona ragione per farlo in quel modo.

Risposte:


734

inArrayrestituisce l'indice dell'elemento nell'array, non un valore booleano che indica se l'elemento esiste nell'array. Se l'elemento non è stato trovato, -1verrà restituito.

Quindi, per verificare se un elemento si trova nell'array, utilizzare:

if(jQuery.inArray("test", myarray) !== -1)

16
CoffeeScript:if jQuery.inArray('test', myarray) isn't -1
— Joshua Pinter,

9
Certo, potresti sempre definire la tua funzione, più intuitiva, come$.isInArray = function(test,array) { return $.inArray(test, array) !== -1; };
— Wesley Smith,

1
O più breve: $.isInArray = function(item, array) { return !!~$.inArray(item, array); };(Vorrei mantenere il codice criptico come quello in una funzione ben definita per mantenere chiara l'intenzione :))
— Dennis,

2
Grazie @ Chips_100 per averci mostrato agli studenti visivi come farlo nel modo giusto, sarebbe bello se jQuery potesse aggiornarlo per includerlo nel proprio esempio.
— asherrard,

2
puoi anche usareif( $.inArray(test, array) > -1) { // do stuff }
— MistyDawn il

48

$.inArrayrestituisce l' indice dell'elemento se trovato o -1 se non lo è - non un valore booleano. Quindi il corretto è

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

26

La risposta viene dal primo paragrafo della documentazione verificare se i risultati sono maggiori di -1, non se è vero o falso.

Il metodo $ .inArray () è simile al metodo .indexOf () nativo di JavaScript in quanto restituisce -1 quando non trova una corrispondenza. Se il primo elemento all'interno della matrice corrisponde a valore, $ .inArray () restituisce 0.

Poiché JavaScript considera 0 come vagamente uguale a false (ovvero 0 == false, ma 0! == false), se stiamo verificando la presenza di valore all'interno dell'array, dobbiamo verificare se non è uguale a (o maggiore di ) -1.


23

Il modo giusto di usare noninArray(x, arr) è affatto usarlo e usare invece arr.indexOf(x).

Il nome standard ufficiale è anche più chiaro sul fatto che il valore restituito è un indice, quindi se l'elemento passato è il primo si otterrà un 0(che è falso in Javascript).

(Si noti che nonarr.indexOf(x) è supportato in Internet Explorer fino a IE9 , quindi se è necessario supportare IE8 e versioni precedenti, questo non funzionerà e la funzione jQuery è un'alternativa migliore.)


1
Devo essere d'accordo Il nome di inArray è confuso. Sembra che dovrebbe restituire un valore booleano, ma fa esattamente lo stesso di indexOf
— Enrique Moreno Tent

Ogni volta che ho $.inArrayusato all'inizio del codice in cui devo andare a correggere un bug, gemo. Comunque, questa dovrebbe essere la risposta accettata.
— Aluan Haddad,

11

Oppure, se vuoi avere un po 'di fantasia, puoi usare gli operatori non bit per bit (~) e logici non (!) Per convertire il risultato della funzione inArray in un valore booleano.

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

4
L'uso di operatori bit per bit è generalmente proibito / disapprovato negli standard di codifica JavaScript comuni. Quindi, se stai usando una linter (jshint, eslint ecc.) È probabile che tu non riesca a farlo attraverso la revisione del codice. La soluzione funziona però.
— jhrr

8

Di solito lo uso

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

o

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

3
Ancora meglio ...if( $.inArray("test", myarray) > -1 )
— MistyDawn,

8

Il metodo jQuery inArray () viene utilizzato per cercare un valore in un array e restituire il suo indice non un valore booleano. E se il valore non è stato trovato, restituirà -1.

Quindi, per verificare se un valore è presente in un array, seguire la seguente procedura:

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

    alert("found");
}

Riferimento


7

La inArrayfunzione restituisce l'indice dell'oggetto fornito come primo argomento alla funzione nell'array fornita come secondo argomento della funzione.

Quando inArrayrestituisce 0indica che il primo argomento è stato trovato nella prima posizione dell'array fornito.

Per usare inArrayall'interno di un'istruzione if usare:

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

inArrayritorna -1quando il primo argomento passato alla funzione non viene trovato nell'array passato come secondo argomento.


5

invece di usare jQuery.inArray()puoi anche usare il includesmetodo per int array:

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

controlla la posta ufficiale qui


1
include non è supportato da IE - :: use indeOf
— anoldermark il

3

jQuery.inArray () restituisce l'indice dell'elemento nell'array o -1 se l'elemento non è stato trovato. Maggiori informazioni qui: jQuery.inArray ()


3

Restituirà l'indice dell'elemento nell'array. Se non viene trovato, otterrai-1


3

Se vogliamo verificare che un elemento sia all'interno di un insieme di elementi, possiamo fare ad esempio:

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');
    }
}

2
/^(one|two|tree)$/i.test(field) // field = Two; // true
/^(one|two|tree)$/i.test(field) // field = six; // false
/^(раз|два|три)$/ui.test(field) // field = Три; // true

Questo è utile per controllare le variabili dinamiche. Questo metodo è di facile lettura.


2

$.inArray()fa ESATTAMENTE LO STESSO COSA come myarray.indexOf()e restituisce l'indice dell'elemento di cui si sta verificando l'esistenza nell'array. È solo compatibile con le versioni precedenti di IE prima di IE9. La scelta migliore è probabilmente quella myarray.includes()che restituisce un valore vero / falso booleano. Vedi lo snippet di seguito per esempi di output di tutti e 3 i metodi.

// 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>


Va notato che $.inArraydovrebbe essere lo standard aureo se si ha accesso alla libreria jQuery. Altrimenti, .indexOfdovrebbe essere usato JavaScript con un polyfill per IE8. Stai lontano da quelle cose moderne come .includes().
— Alexander Dixon,


1

Per qualche motivo quando provi a cercare un elemento DOM jquery non funzionerà correttamente. Quindi riscrivere la funzione farebbe il trucco:

function isObjectInArray(array,obj){
    for(var i = 0; i < array.length; i++) {
        if($(obj).is(array[i])) {
            return i;
        }
    }
    return -1;
}

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>


0

Solo nessuno usa $invece di jQuery:

if ($.inArray(nearest.node.name, array)>=0){
   console.log("is in array");
}else{
   console.log("is not in array");
}

Sono solo curioso perché? C'è qualche problema di compatibilità non comune che questo provoca? Non ho mai avuto alcun tipo di problema usando $invece di jQuery.
— MistyDawn,

0

il modo più breve e semplice è.

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

if(arrayHere[any key want to search])   
   console.log("yes found in array");
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.