Heim >Web-Frontend >js-Tutorial >Einführung in die Javascript-Array-Grundlagen_Grundkenntnisse
Javascript ist eine magische Sprache und ihre Arrays sind gleichermaßen einzigartig. Wir beseitigen die Schlacken, extrahieren das Wesentliche und fassen die häufig verwendeten Best Practices zusammen. Sollten Fehler vorliegen, weisen Sie diese bitte darauf hin.
Javascript-Array ist ein Array-ähnliches Objekt, das die Eigenschaften eines Objekts aufweist. Wenn es sich bei den Eigenschaftsnamen um kleine, zusammenhängende Ganzzahlen handelt, sollte ein Array verwendet werden; andernfalls sollte ein Objekt verwendet werden.
Array-Quelle
Alle Arrays werden aus Array erstellt. Testen wir die Konstruktoreigenschaft.
var arr = []; arr.constructor === Array; // true arr.constructor === Array.prototype.constructor; // true
Array erstellen
//数组字面量方式 var arr1 = [1, 2, 3]; // [1,2,3] //构造函数方式 var arr2 = new Array(); // [] 空数组 var arr3 = new Array('9'); // ["9"] 一个字符串元素 var arr4 = new Array(9); // [] 数组长度length为9 var arr5 = new Array([9]); // [[9]] 相当于二维数组 var arr6 = new Array(1, 2, 3); // [1, 2, 3] var arr7 = new Array(1, function f(){}, {o : 6}, null,undefined,true); // 数组可以存储任意混合数据类型
Aufgrund der Funktionsweise von arr4 gibt der Konstruktor ein leeres Array mit festgelegtem Längenattribut zurück, wenn nur ein numerischer Parameter an den Array-Konstruktor übergeben wird. Daher wird empfohlen, die Array-Literal-Methode zu verwenden, die kurz und prägnant ist.
Erkennen Sie, ob das Objekt ein Array ist
var arr1 = [1, 2, 3]; typeof(arr1); // object
Es ist bekannt, dass typeof Typen nicht richtig erkennt.
arr1 instanceof Array; //true
Die Instanz der Methode hat innerhalb einer Webseite kein Problem. Sobald andere Webseiten verschachtelt sind, gibt es zwei globale Bereiche, und es wird Probleme bei der Erkennung geben, wenn sie sich gegenseitig aufrufen.
Array.isArray(arr1); // true
Array.isArray() ist eine neue Methode in ECMAScript5 und weist keine Mängel auf. Das einzige Problem besteht darin, dass der IE8-Browser dies nicht unterstützt und der IE9-Browser es im strikten Modus nicht unterstützt.
Object.prototype.toString.apply(arr1).slice(8, -1); // Array
Der letzte Weg ist der beste Weg, den Typ zu erkennen.
Array-Länge
Die Länge des Arrays ist auch sein Attribut. Eine Vergrößerung der Länge führt nicht zu einem Fehler außerhalb der Grenzen.
Der Längenwert entspricht dem größten ganzzahligen Attributnamen des Arrays plus 1.
var arr1 = []; arr1[9] = 1; // 长度为10,只包含一个元素的数组
Legen Sie einen kleinen Wert fest, um Attribute zu löschen, deren Namen größer oder gleich der Länge sind.
Wenn der Längenwert auf 0 gesetzt ist, entspricht dies dem Löschen des Arrays.
var arr2 = [1, 2, 3, 4, 5]; arr2.length = 3; // [1, 2, 3] arr2.length = 0; // []
Array-Traversierung
Um ein Array zu durchlaufen, verwenden Sie keine for in-Schleife zum Durchlaufen des Arrays, da for in alle Eigenschaften in der Prototypenkette durchläuft, wir aber nicht so viele benötigen. Es wird empfohlen, eine for-Schleife zu verwenden.
var arr1 = [1, 2, 3]; arr1.test = 9; //for in 方式 for(var prop in arr1){ cosole.log(prop, arr1[prop]); } // 输出如下 // 0 1 // 1 2 // 2 3 // test 9 //for循环方式 for(var i = 0, len = arr1.length; i < len; i++){ console.log(arr1[i]); } //输出如下 // 1 // 2 // 3
Wir sehen, dass die for-in-Methode einen zusätzlichen Testwert hat, der mit der hasOwnProperty-Funktion eliminiert werden kann, aber das ist viel langsamer als die for-Schleifenmethode.
Das Zwischenspeichern der Array-Länge ist ein notwendiger Schritt, und bei jedem Zugriff entsteht ein Leistungsaufwand (die neuesten Browser haben diesen Aspekt optimiert).
Zusammenfassung
Eine kurze Einführung in die Grundkenntnisse von Array. An dieser Stelle erhalten Sie ein umfassenderes Verständnis von Array. Im nächsten Artikel wird die Array-Methode vorgestellt.
Obwohl es viele Aspekte von Javascript gibt, die nicht leicht zu verstehen sind, habe ich mich im Laufe einer langen Studienzeit langsam in Javascript verliebt (weil es jetzt keine Mädchen mehr gibt, die ich lieben könnte).