Türchen 20: Javascript Array-Lifehacks

Array-Funktionen in den verschiedensten Programmiersprachen kennt jeder Entwickler. Uns fällt aber immer wieder beim Code-Review auf, dass wir sie noch viel zu selten nutzen. Dabei können Array-Funktionen den Code um einiges verschlanken und die meisten forEach-Schleifen überflüssig machen!

In diesem Türchen mehrere Array-Lifehacks mit der „Normalen / Langen Methode“ und dem kurzen Einzeiler, wenn man eine Array-Funktion verwendet.

Array.some()

Lifehack Nummer 1: Die Array.some() Funktion. Die Frage, die wir uns in dem Beispiel stellen ist: Sind in dem Array gerade Zahlen vorhanden?

let data = [3, 5, 7, 8];

// ==> Normale / Lange Methode
let containsEven;
data.forEach(elem => {
  if (elem % 2 === 0) {
    containsEven = true;
  }
});

// ==> Kurzer Einzeiler mit Array.some() Methode
let containsEven = data.some(elem => elem % 2 === 0);

Array.every()

Als zweites haben wir die Array.every() Funktion. In diesem Beispiel lautet unsere Frage: Sind alle Zahlen im Array kleiner 100?

let data = [0, 22, 43, 68, 83, 99];

// ==> Normale / Lange Methode
let allSmallerHundred = true;
data.forEach(val => {
  if (val > 100) {
    allSmallerHundred = false;
  }
});

// ==> Kurzer Einzeiler mit Array.every() Methode
allSmallerHundred = data.every(val => val < 100);

Array.map()

An dritter Stelle kommt die Array.map() Funktion. Diesmal haben wir keine Frage, sondern eine direkte Aufgabe: Einträge kleiner 0 sollen auf 0 gesetzt werden.

// Daten:
let data = [-1, 0, 5];
let newData = [];

// ==> Normale / Lange Methode
data.forEach(val => {
  if (val < 0) {
    newData.push(0);
  } else {
    newData.push(val);
  }
});

// ==> Kurzer Einzeiler mit Array.map() Methode
let newData = data.map(val => val < 0 ? 0 : val);

// Ergebnis bei beiden Varianten:
// newData = [0, 0, 5];

Array.findIndex()

In diesem Beispiel nutzen wir die Array.findIndex() Funktion und haben erneut eine klar definierte Aufgabe: Der Index von dem Wert der Variable „search“ soll in dem Array gefunden werden.

let data = ["A", -5, {x: 8}];
let search = -5;

// ==> Normale / Lange Methode
let foundIndex;
for (let index in array) {
  if (array[index] === search) {
    foundIndex = index;
    break;
  }
}

// ==> Kurzer Einzeiler mit Array.findIndex() Methode
let foundIndex = data.findIndex(val => val === search);

Array.filter()

Zu guter Letzt einmal die Array.filter() Funktion. Unsere letzte Aufgabe ist: Alle Objekte sollen herausgefiltert werden.

let data = ["A", -5, {x: 8}];

// ==> Normale / Lange Methode
let newData = [];
data.forEach(val => {
  if (typeof val !== 'object') {
    newData.push(val);
  }
});

// ==> Kurzer Einzeiler mit Array.filter() Methode
let newData = data.filter(val => typeof val !== 'object');

Kanntet ihr schon alle? Und vor allem: Nutzt ihr sie regelmäßig? Oder werden hier und da doch nochmal die forEach-Schleifen bemüht? Uns würde es voll interessieren, wie das bei euch aussieht!

Kommentar verfassen

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert

crafted by code-x 💚
Nach oben scrollen