Überprüfen Sie, ob ein Array leer ist oder existiert

Question 1

Wenn die Seite zum ersten Mal geladen wird, muss ich prüfen, ob ein Bild vorhanden ist image_array und lade das letzte Bild.

Andernfalls deaktiviere ich die Vorschauschaltflächen, mache den Benutzer darauf aufmerksam, dass er die Schaltfläche „Neues Bild“ drücken soll, und erstelle ein leeres Array, um die Bilder zu platzieren.

Das Problem ist, dass image_array in dem else feuert die ganze zeit. Wenn ein Array vorhanden ist, wird es einfach überschrieben, aber die Warnung funktioniert nicht.

if(image_array.length > 0)
    $('#images').append('<img src="'+image_array[image_array.length-1]+'" class="images" id="1" />');
else{
    $('#prev_image').attr('disabled', 'true');
    $('#next_image').attr('disabled', 'true');
    alert('Please get new image');
    var image_array = [];
}

UPDATE Vor dem Laden von HTML habe ich so etwas:

<?php if(count($images) != 0): ?>
<script type="text/javascript">
    <?php echo "image_array = ".json_encode($images);?>
</script>
<?php endif; ?>

Question 2

if (typeof image_array !== 'undefined' && image_array.length > 0) {
    // the array is defined and has at least one element
}

Ihr Problem kann aufgrund einer Mischung aus impliziten globalen Variablen und variablem Heben auftreten. Stellen Sie sicher, dass Sie verwenden var immer wenn eine Variable deklariert wird:

<?php echo "var image_array = ".json_encode($images);?>
// add var  ^^^ here

Und stellen Sie dann sicher, dass Sie diese Variable später nie versehentlich erneut deklarieren:

else {
    ...
    image_array = []; // no var here
}

Question 3

Um zu prüfen, ob ein Array leer ist oder nicht

Eine moderne Art, ES5+:

if (Array.isArray(array) && array.length) {
    // array exists and is not empty
}

Ein Old-School-Weg:

typeof array != "undefined"
    && array != null
    && array.length != null
    && array.length > 0

Ein kompakter Weg:

if (typeof array != "undefined" && array != null && array.length != null && array.length > 0) {
    // array exists and is not empty
}

Ein CoffeeScript-Weg:

if array?.length > 0

Wieso den?

Fall undefiniert

Undefinierte Variable ist eine Variable, der Sie noch nichts zugewiesen haben.

let array = new Array();     // "array" !== "array"
typeof array == "undefined"; // => true

Fall Null

Im Allgemeinen ist null ein Zustand ohne Wert. Beispielsweise ist eine Variable null, wenn Sie einige Daten verpasst oder nicht abgerufen haben.

array = searchData();  // can't find anything
array == null;         // => true

Fall Kein Array

Javascript hat ein dynamisches Typsystem. Das bedeutet, dass wir nicht garantieren können, welchen Objekttyp eine Variable enthält. Es besteht die Möglichkeit, dass wir nicht mit einer Instanz von sprechen Array.

supposedToBeArray =  new SomeObject();
typeof supposedToBeArray.length;       // => "undefined"

array = new Array();
typeof array.length;                   // => "number"

Fall leeres Array

Da wir jetzt alle anderen Möglichkeiten getestet haben, sprechen wir von einer Instanz von Array. Um sicherzustellen, dass es nicht leer ist, fragen wir nach der Anzahl der Elemente, die es enthält, und stellen sicher, dass es mehr als null Elemente enthält.

firstArray = [];
firstArray.length > 0;  // => false

secondArray = [1,2,3];
secondArray.length > 0; // => true

Question 4

Wie wäre es mit (ECMA 5.1):

if(Array.isArray(image_array) && image_array.length){
  // array exists and is not empty
}

Question 5

Dies ist, was ich benutze. Die erste Bedingung deckt Wahrheit ab, die sowohl null als auch undefiniert hat. Die zweite Bedingung prüft auf ein leeres Array.

if(arrayName && arrayName.length > 0){
    //do something.
}

oder dank tsemers Kommentar habe ich eine zweite Version hinzugefügt

if(arrayName && arrayName.length)

Dann habe ich mit Scratchpad in Firefox einen Test für die zweite Bedingung gemacht:

var array1;
var array2 = [];
var array3 = ["one", "two", "three"];
var array4 = null;

console.log(array1);
console.log(array2);
console.log(array3);
console.log(array4);

if (array1 && array1.length) {
  console.log("array1! has a value!");
}

if (array2 && array2.length) {
  console.log("array2! has a value!");
}

if (array3 && array3.length) {
  console.log("array3! has a value!");
}

if (array4 && array4.length) {
  console.log("array4! has a value!");
}

was das auch beweist if(array2 && array2.length) und if(array2 && array2.length > 0) machen genau das gleiche

Question 6

optionale Verkettung

Da der optionale Verkettungsvorschlag Stufe 4 erreicht hat und breitere Unterstützung erhält, gibt es einen sehr eleganten Weg, dies zu tun

if(image_array?.length){

  // image_array is defined and has at least one element

}

Question 7

Du solltest benutzen:

  if (image_array !== undefined && image_array.length > 0)

Question 8

Wenn Sie testen möchten, ob die Image-Array-Variable definiert wurde, können Sie dies folgendermaßen tun

if(typeof image_array === 'undefined') {
    // it is not defined yet
} else if (image_array.length > 0) {
    // you have a greater than zero length array
}