Vertiefte fortgeschrittene JavaScript-Programmierung von Objekten und Arrays (Stack-Methoden, Warteschlangenmethoden, Neuordnungsmethoden, Iterationsmethoden)_Javascript-Kenntnisse

Vererbung ist eines der am meisten diskutierten Konzepte in OO-Sprachen. Viele OO-Sprachen unterstützen zwei Arten der Vererbung: Schnittstellenvererbung und Implementierungsvererbung. Die Schnittstellenvererbung erbt nur Methodensignaturen, während die Implementierungsvererbung die tatsächlichen Methoden erbt. Wie bereits erwähnt, ist eine Schnittstellenvererbung in ECMAScript nicht möglich, da Funktionen keine Signaturen haben. ECMAScript unterstützt nur die Implementierungsvererbung, und seine Implementierungsvererbung basiert hauptsächlich auf der Prototypenkette.

1. Verwenden Sie Objektliterale, um Objekte zu definieren

var person={};

Beim Erstellen eines Objekts auf diese Weise wird der Objektkonstruktor nicht wirklich aufgerufen.

Entwickler bevorzugen die Syntax von Objektliteralen.

2. Wenn eine große Anzahl optionaler Parameter übergeben werden muss, werden im Allgemeinen Objektliterale verwendet, um mehrere optionale Parameter zu kapseln.

3. Der Unterschied zwischen Punktnotation und eckiger Klammernotation von Objektattributen

(1) Funktionell: Es gibt keinen Unterschied zwischen den beiden

(2) Der Vorteil von eckigen Klammern besteht jedoch darin, dass auf Attribute über Variablen zugegriffen werden kann

Zum Beispiel:

  var person={
  name:"Nic"
}

Punktnotation: person.name

Notation in eckigen Klammern: var prop="name";
person[prop]

(3) Ein weiterer Vorteil ist:

Wenn der Attributname Zeichen oder Schlüsselwörter enthält, die zu Grammatikfehlern oder reservierten Wörtern führen, ist es nicht falsch, eckige Klammern zu verwenden

Zum Beispiel: person["Vorname"]="OK";

(4) Generell wird die Verwendung der Punktschreibweise
empfohlen

4. Probleme beim Erstellen von Arrays

var farben=[1,2,] //Tu das nicht. Dadurch wird ein Array mit 2 oder 3 Elementen
erstellt var opy=[,,,,,] //Tu das nicht. Dadurch wird ein Array mit 5 oder 6 Elementen

Das liegt daran, dass IE8 und frühere Versionen Fehler bei der Implementierung von Array-Literalen aufweisen

Beim Erstellen eines Arrays mit Literalen wird der Array-Konstruktor nicht aufgerufen

5. Wenn der Index zum Festlegen eines bestimmten Werts die vorhandene Anzahl von Elementen im Array überschreitet.

Zum Beispiel: var color=[1,2,3]

Farbe[3], das Array wird automatisch auf die Länge des Indexwerts plus 1 erhöht

Derzeit ist der Wert von Farbe[3] undefiniert

6. Die Länge des Arrays ist nicht nur schreibgeschützt. Durch Festlegen der Längeneigenschaft können Sie am Ende des Arrays kontinuierlich neue Elemente hinzufügen.

7. Konvertieren Sie das Array in einen String toString() join()

array.toString()  //返回以逗号分隔的字符串
array.valueOf()  //返回的还是数组
array.join(",")  //也可以

8. Array-Stack-Methode push() pop()

Der Stapel ist eine Datenstruktur, das heißt, das zuletzt hinzugefügte Element ist das früheste, das entfernt wird (zuletzt rein, zuerst raus). Das Einlegen und Entfernen von Gegenständen aus dem Stapel erfolgt nur an einer Stelle – der Oberseite des Stapels.
ECMAScript stellt die Methoden push() und pop() zur Implementierung dieser Art von Stapel bereit.

push()-Methode fügt ein oder mehrere Elemente am Ende des Arrays hinzu und gibt die neue Länge zurück.

Die Methode pop() wird verwendet, um das letzte Element des Arrays zu entfernen und zurückzugeben.

Beispiel:

var arr=[];
var count=arr.push('a','b');  //count=2
arr.push('c');
var item=arr.pop();  //移除最后一项 c item=c 并且改变数组长度

9. Warteschlangenmethode shift() unshift()

Die Zugriffsregel für Warteschlangendaten lautet „Wer zuerst rein, mahlt zuerst“
ECMAScript stellt Shift() zur Verfügung, um dies zu implementieren.
Die Methode „shift()“ wird verwendet, um das erste Element aus dem Array zu entfernen und den Wert des ersten Elements zurückzugeben.
Die Methode unshift() fügt ein oder mehrere Elemente am Anfang des Arrays hinzu und gibt die neue Länge zurück.

10. Neuordnungsmethode sort() reverse()

ECMAScript stellt sort() und reverse() für die Implementierung bereit.

sort() ruft die tostring()-Methode jedes Array-Elements auf und vergleicht die resultierenden Zeichenfolgen zum Sortieren.

11. Array-Verkettung concat()

Die Methode concat() wird verwendet, um zwei oder mehr Arrays zu verketten.

Diese Methode ändert nicht das vorhandene Array, sondern gibt nur eine Kopie des verbundenen Arrays zurück.

12. Die Methode „slice()“ gibt ausgewählte Elemente aus einem vorhandenen Array zurück.

13. Positionsmethoden: indexOf() und lastIndexOf()

14. Iterationsmethode

ECMAScript5 definiert die folgenden fünf Methoden, die alle drei Parameter empfangen: den Wert des Array-Elements, die Position des Elements im Array und das Array-Paar selbst      

every(),filter(),forEach(),map(),some()

Beispiel:

var num=[1,2,3,4];
var res=num.every(function(item,index,array){
  return (item>2)
})  //false  必须每一项都大于2，才返回true
var res=num.some(function(item,index,array){
  return (item>2)
})  //true 只要有一个大于2，就返回true
var res=num.filter(function(item,index,array){
  return (item>2)
})  //[3,4]   
var res=num.forEach(function(item,index,array){
  return (item>2)
})  //[1,4,9,16]  

Iterationsmethode im Javascript-Array-Objekt

/* javascript 数组对象中的迭代方法 
 * ECMAScript5为数组定义了5个迭代方法。每个方法都接受两个参数，第一个是进行迭代的函数，第二个是该函数的作用域对象【可选】。 


 * 进行迭代的函数接受三个参数，第一个是数组中要进行迭代的元素的值，第二个是数组候总要进行迭代的元素的位置，第三个是迭代数组本身。 


* 1. every()  对数组中的每一项运行给定的函数，如果该函数对每一项都返回true，则返回true 
 * 2. filter() 对数组中的每一项运行给定的函数，返回该函数返回true的项组成的数组。 
 * 3. forEach() 对数组中的每一项运行给定的函数，这个方法没有返回值 
 * 4. map()   对数组中的每一项运行给定的函数，返回每次函数调用的结果组成的数组 
 * 5. some()  对数组中的每一项运行给定的函数，如果该函数对任意一项返回true，则返回true 
 * 
 * 这些迭代方法支持的浏览器有，IE9+，Firefox2+，Safari3+，Opera 9.5+，chrome 
 */ 
var num = [1,2,3,4,5,6,7,8,9]; 
var everyResult = num.every(function(item, index, array) { 
  if(item > 2) { 
    return true; 
  } 
}); 
alert(everyResult); 
var someResult = num.some(function(item) { 
  if(item > 2) { 
    return true; 
  } 
}); 
alert(someResult); 
var filterResult = num.filter(function(item) { 
  if(item > 2) { 
    return true; 
  } 
}); 
alert(filterResult); 
var mapResult = num.map(function(item) { 
  if(item > 2) { 
    return true; 
  } 
}); 
alert(mapResult); 
var forEachResult = num.forEach(function(item) { 
  if(item > 2) { 
    return true; 
  } 
}); 
alert(forEachResult);