Die Anleitung zu JavaScript Array

Was ist Array?
Array anmelden
Array Objekt
Die Methode des Array

1. Was ist Array?

In ECMAScript ist Array eine Kollektion der ununterbrochenen Stellen in die Speicherung um die Daten zu speichern. Jede Stelle der Speicherung wird ein Element genannt.

Unter sind das die Eigenschaften des Array:

Die Elemente werden ab die Zahl 0 (0, 1, 2,..) die Index markiert und Sie können nach seiner Index in Element zugreifen.
Array, auch so wie die Variable: Sie müssen vor der Verwendung es anmelden.
Sie können die Wert eines Element im Array aktualisieren oder ändern.

Warum wird Array zu brauchen:

Statt der Anmeldung eines Array mit N Elementen können Sie N Variable anmelden. Aber es hat die folgenden Nachteile:

Wenn N eine große Zahl ist, ist die manuelle Anmeldung von N Variable nicht machbar.
Wenn Sie N Variable anmelden, managet das Programm für Sie die Reihenfolge der Variable. Denn es gibt keine Definition der Index für die Variable.

2. Array anmelden

So wie die Variable sollen Sie vor der Verwendung Array anmelden.

Syntax

// Declaration
var myArray;

// Initialization  
myArray = [val1, val2, .., valN]  

// Or

var myArray = [val1,val2, .., valN]

array-example1.js

var myArray = [ 4, 8, 13, 6, 55, 41, 42, 99, 1 ];

console.log("Length of myArray: " + myArray.length); // 9 Elements
console.log("Element at index 0: " + myArray[0]); // 4
console.log("Element at index 1: " + myArray[1]); // 8
console.log("Element at index 4: " + myArray[4]); // 55

Sie können die neue Wert für ein Element des Array anweisen.

array-example2.js

var names = [ "Trump", "Putin", 100 ];

console.log("Length of array: " + names.length); // 3 Elements
console.log("Element at index 0: " + names[0]); // Trump
console.log("Element at index 1: " + names[1]); // Putin
console.log("Element at index 2: " + names[2]); // 100

// Assign new value to element at index 2:
names[2] = "Merkel";
console.log("Element at index 2: " + names[2]);

Mit der Verwendung der Schleife können Sie die Elementen des Array abwechselnd zugreifen:

array-loop-example.js

var fruits = ["Acerola", "Apple", "Banana", "Breadfruit", "Carambola" ];

for( var index = 0; index < fruits.length; index++) {
   console.log("Index: " + index+" Element value: " + fruits[index]);
}

Output:

Index: 0 Element value: Acerola
Index: 1 Element value: Apple
Index: 2 Element value: Banana
Index: 3 Element value: Breadfruit
Index: 4 Element value: Carambola

3. Array Objekt

Ein Array kann durch die Klasse Array auch erstellt werden

// Create an array has 4 elements
var myArray1 = new Array(4);

// Create an array with 3 elements:
var myArray2 = new Array("Acerola", "Apple", "Banana");

Zum Beispiel

array-object-example.js

// Create an array has 4 elements:
var salaries = new Array(4);

for(var i = 0; i < salaries.length; i++) {
   console.log(salaries[i]); // undefined
} 
for(var i = 0; i < salaries.length; i++) {
   // Assign new value to element:
   salaries[i] = 1000 + 20 * i;
}
console.log(salaries[2]); // 1040.

Output:

undefined
undefined
undefined
undefined
1040

4. Die Methode des Array

Ein Array ist ein Objekt. Es wird die Methode haben. Unter ist das die Liste seiner Methode:

concat()
every()
some()
filter()
forEach()
map()
indexOf()
join()
lastIndexOf()
pop()
push()
reduce()
reduceRight()
reverse()
shift()
slice()
toSource()
sort()
splice()
toString()
unshift()

concat()

Das Method concat() gibt ein neues Array zurück, davon werden die Element dieses Array mit der Elementen der Array (oder die Werte) in die Parameter gebindet (join)

// Example:
array.concat(arrayOrValue1, arrayOrValue2, ..., arrayOrValueN);

Die Parameter

arrayOrValueN: Ein Array oder eine Wert.

array-concat-example.js

var alpha = ["a", "b", "c"];
var numeric = [1, 2, 3];

var results = alpha.concat(numeric, "!");

console.log(alpha); // ["a", "b", "c"];
console.log(results); // [ 'a', 'b', 'c', 1, 2, 3, '!' ]

every()

Das Method gibt true zurück wenn alle Elemente in diesem Array eine angebotene Testsfunktion erfüllen..

array.every(callback[, thisObject]);

Die Parameter

callback − Eine Funktion zur Prüfung (test) jedes Element vom Array.
thisObject − Ein Objekt wird bei der Implementation der Funktion callback als this verwendet.

Zum Beispiel: Sie haben ein Array von Werte als die Alter der Mitarbeiter. Verwenden Sie die Methode every() um zu prüfen, ob die allen Elemente vom Array in dem Raum vom 18-60 liegt oder nicht

array-every-example.js

// Test if value between 18 and 60.
testAge = function(value, index, testArray)  {
     return value >= 18 && value <= 60;
}
var ages = [18, 22, 59];

// Or: var okAll = ages.every(testAge);
var okAll = ages.every(testAge, ages);
console.log("OK ALL? " + okAll);

some()

True zurückgeben wenn mindesten ein Element in diesem Array eine angebotene Testfunktion erfüllt.

array.some(callback[, thisObject]);

Die Parameter

callback − Eine Funktion zur Prüfung (test) jedes Element des Array.
thisObject − Ein Element wird bei der Implementation der Funktion callback als this verwendet.

array-some-example.js

// Test if value between 18 and 60.
testAge = function(value, index, testArray)  {
     return value >= 18 && value <= 60;
}
var ages = [15, 17, 22, 80];

// Or: var ok = ages.some(testAge);
var ok = ages.some(testAge, ages);
console.log("OK? " + ok); // true

filter()

Dieses Method erstellt ein neues Array, inklusiv der Elemente dieses Array und die Element bestehen die Prüfung (Test) eines Funktion.

array.filter(callback[, thisObject]);

Die Parameter:

callback − Eine Funktion zur Prüfung (test) jedes Element. Sie gibt true/false zurück.
thisObject − das Objekt wird bei der Implementation der Funktion callback als this verwendet.

zum Beispiel:

array-filter-example.js

// Test if value between 18 and 60.
// (callback function)
testAge = function(value, index, testArray)  {

     return value >= 18 && value <= 60;
}
var ages = [5, 6, 18, 22, 59, 15 ];

// Or: var validAges = ages.filter(testAge);
var validAges = ages.filter(testAge, ages);
console.log("Valid Ages: ");
console.log(validAges); // [ 18, 22, 59 ]

forEach()

Dieses Method wird eine Funktion für jedes Element des Array aufrufen

array.forEach(callback[, thisObject]);

Die Parameter

callback − Eine Funktion um etwas mit jedem Element zu machen.
thisObject − Ein Objekt wird bei der Implementation der Funktion callback als this verwendet.

array-forEach-example.js

// Check value between 18 and 60.
// (callback function)
showTestResult = function(value, index, testArray)  {
     if(value >= 18 && value <= 60) {
        console.log("Age " + value + " valid!");
     } else  {
       console.log("Sorry, Age " + value + " invalid!");
     }
}
var ages = [5, 6, 18, 22, 59, 15 ];

// Or: ages.filter(showTestResult);
ages.forEach(showTestResult, ages);

Output:

Sorry, Age 5 invalid!
Sorry, Age 6 invalid!
Age 18 valid!
Age 22 valid!
Age 59 valid!
Sorry, Age 15 invalid!

map()

Dieses Method gibt ein neues Array zurück, dessen Anzahl der Element so gleich wie die Anzahl der Array ist. Durch die Aufruf einer Funktion für jede Element des Array um die Wert für dem neuem Array entsprechenden Element zu rechnen.

array.map(callback[, thisObject]);

Die Parameter:

callback − Die Funktion wird erstellt um ein Element für neues Array aus dem Element eines momentanen Array zu erstellen.
thisObject − das Objekt wird bei der Implementation der Funktion callback als this verwendet.

Ein einfaches Beispiel: Angenommen, Sie haben ein Array von Elementen, die das Gehalt der Mitarbeiter bezeichnet. Sie möchten ein Array zur Enthaltung der persönlichen Einkommenssteuer für die Mitarbeiter rechnen. Der Regel ist:

Wenn das Gehalt > 1000 ist, ist die Steuer 30%.
Wenn das Gehalt > 500 ist, ist die Steuer 15%.
Umgekehrt ist die Steuer 0%.

array-map-example.js

var taxFunc = function(value, index, thisArray)  {
     if(value > 1000)  {
          return value * 30 / 100;
     }
     if( value > 500)  {
          return value * 15 / 100;
     }
     return 0;
}
var salaries = [1200, 1100, 300, 8000, 700, 200 ];
//
var taxes = salaries.map(taxFunc, salaries);
console.log(taxes); // [ 360, 330, 0, 2400, 105, 0 ]

Die Funktion Math.abs(x) gibt ein Zahl als die absolute Wert von x zurück. Das ist eine im Javascript eingebaute Funktion.

array-map-example2.js

var array1 = [-3, 5, -10];
//
var array2 = array1.map(Math.abs, array1);
console.log(array2); // [ 3, 5, 10 ]

indexOf()

Die erste Index (kleinste) eines Element im Array zurückgeben. Und die Wert dieses Element ist gleichwertig mit einer bestimmten Wert oder -1 zurückgeben wenn nicht gefunden

array.indexOf(searchValue [, fromIndex]);

Die Parameter:

searchValue −im Array die Wert zu suchen
fromIndex − die Index um zur Suche zu beginnen. Nach Default ist sie 0.

array-indexOf-example.js

//             0   1   2   3   4   5
var array1 = [10, 20, 30, 10, 40, 50];

var idx = array1.indexOf(10, 1);
console.log(idx); // 3

lastIndexOf()

Die letzte Index (die größte) eines Element im Array zurückgeben. Und die Wert dieses Element ist gleichwertig mit einer bestimmten Wert oder -1 zurückgeben wenn nicht gefunden.

array.lastIndexOf(searchElement[, toIndex]);

Die Parameter

searchValue − im Array die Wert zu suchen.
toIndex − Die Index werden vom 0 bis toIndex gesucht. Nach Default hat toIndex die Wert, die so gleich wie die Länge des Array.

array-lastIndexOf-example.js

//             0   1   2   3   4   5   6
var array1 = [10, 20, 30, 10, 40, 10, 50];

var idx = array1.lastIndexOf(10, 4);
console.log(idx); // 3

pop()

Das letzte Element aus einem Array entfernen und dieses Element zurückgeben

array.pop();

array-pop-example.js

var fruits = ["Apple", "Banana", "Papaya"];

console.log(fruits); // [ 'Apple', 'Banana', 'Papaya' ]

var last = fruits.pop();

console.log(last); // Papaya

console.log(fruits); // [ 'Apple', 'Banana' ]

push()

Dieses Methode fügt die neuen Elemente in das Ende des momentanen Array ein (append) und die Länge des Array nach dem Einfügen zurückgeben

array.push(value1, ..., valueN);

array-push-example.js

var fruits = ["Apple", "Banana", "Papaya"];
console.log(fruits); // [ 'Apple', 'Banana', 'Papaya' ]

var newLength = fruits.push("Apricots", "Avocado");
console.log(newLength); // 5

console.log(fruits); // [ 'Apple', 'Banana', 'Papaya', 'Apricots', 'Avocado' ]

reduce()

Dieses Method wird benutzt um auf einem Array zu rechnen und eine einzige Wert zurückzugeben.

array.reduce(callback [, initialValue]);

Die Parameter:

callback − Diese Funktion wird für jede Teil des Array (von links nach rechts) aufgeruft. Sie hat 2 Parameter (value, element) und gibt eine Wert zurück. Die zurückgegebene Wert wird in den Paramter value für die nächste Aufruf übertragen.
initialValue − Die Wert für den Parameter value in die erste Aufruf der Funktion callback.

array-reduce-example.js

var sum = function(a, b)  {
  return a + b;
}
var numbers = [1, 2, 4 ]; 
//
var total = numbers.reduce(sum, 0);
console.log(total); // 7

reduceRight()

Diese Methode wird benutzt um auf einem Array zu rechnen und eine einzige Wert zurückzugeben

array.reduceRight(callback [, initialValue]);

Die Paramter

callback − Diese Funktion wird für jede Teil des Array aufgeruft (vom links nach rechts). Sie hat 2 Parameter (value, element) und gibt eine Wert zurück. Die zurückgegebene Wert wird in den Parameter value für die nächste Aufruf übertragen.
initialValue − Die Wert für den Parameter value in die erste Aufruf der Funktion callback.

array-reductRight-example.js

var sum = function(a, b)  {
  return a + b;
}
var numbers = [1, 2, 4 ];
//
var total = numbers.reduce(sum, 0);
console.log(total); // 7

reverse()

Die Reihenfolge der Elemente eines Array umkehren – das erste Element zu dem letzten Element und das letzte Element zu dem ersten …

array-reverse-example.js

var numbers = [1, 2, 3, 4 ];
//
numbers.reverse( );
console.log(numbers); // [ 4, 3, 2, 1 ]

shift()

Dieses Method entfernt das erste Element aus dem Array und gibt dieses Element zurück.

array-shift-example.js

var fruits = ["Apple", "Banana", "Papaya"];
console.log(fruits); // [ 'Apple', 'Banana', 'Papaya' ]

var last = fruits.shift();
console.log(last); // Apple
console.log(fruits); // [ 'Banana', 'Papaya' ]

slice()

Dieses Method extrahiert eine Teil des Array und gibt ein neues Array zurück.

slice

array.slice( begin [,end] );

Die Parameter

begin - die Start-Index. Wenn die Wert negative ist, ist sie so gleich wie begin = length – begin (length ist die Länge des Array).
end - Die End-Index. Wenn die Wert negative ist, ist sie so gleich wie end = length - end (length ist die Länge des Array)

array-slice-example.js

var fruits = ['Apple', 'Banana', 'Papaya', 'Apricots', 'Avocado']

var subFruits = fruits.slice(1, 3);

console.log(fruits); // [ 'Apple', 'Banana', 'Papaya', 'Apricots', 'Avocado' ]
console.log(subFruits); // [ 'Banana', 'Papaya' ]

splice()

sort()

Die Anleitung zu JavaScript Array

1. Was ist Array?

2. Array anmelden

3. Array Objekt

4. Die Methode des Array

Anleitungen ECMAScript, Javascript

Anleitungen ECMAScript, Javascript

Neueste Artikel