Wie finde ich das erste Element eines Arrays, das einer booleschen Bedingung in JavaScript entspricht?

Ich frage mich, ob es eine bekannte, integrierte / elegante Möglichkeit gibt, das erste Element eines JS-Arrays zu finden, das einer bestimmten Bedingung entspricht. AC # -Äquivalent wäre List.Find .

Bisher habe ich eine Kombination mit zwei Funktionen wie diese verwendet:

// Returns the first element of an array that satisfies given predicate
Array.prototype.findFirst = function (predicateCallback) {
    if (typeof predicateCallback !== 'function') {
        return undefined;
    }

    for (var i = 0; i < arr.length; i++) {
        if (i in this && predicateCallback(this[i])) return this[i];
    }

    return undefined;
};

// Check if element is not undefined && not null
isNotNullNorUndefined = function (o) {
    return (typeof (o) !== 'undefined' && o !== null);
};

Und dann kann ich verwenden:

var result = someArray.findFirst(isNotNullNorUndefined);

Aber da es in ECMAScript so viele Array-Methoden im funktionalen Stil gibt, gibt es vielleicht schon so etwas? Ich stelle mir vor, dass viele Leute ständig solche Dinge implementieren müssen ...

Seit ES6 gibt es die native findMethode für Arrays. Dadurch wird die Aufzählung des Arrays beendet, sobald die erste Übereinstimmung gefunden wurde, und der Wert wird zurückgegeben.

const result = someArray.find(isNotNullNorUndefined);

Alte Antwort:

Ich muss eine Antwort posten, um diese filterVorschläge zu stoppen :-)

Da es in ECMAScript so viele Array-Methoden im funktionalen Stil gibt, gibt es vielleicht schon so etwas?

Sie können die someArray-Methode verwenden , um das Array zu iterieren, bis eine Bedingung erfüllt ist (und dann anzuhalten). Leider wird nur zurückgegeben, ob die Bedingung einmal erfüllt wurde, nicht von welchem ​​Element (oder an welchem ​​Index) sie erfüllt wurde. Also müssen wir es ein wenig ändern:

function find(arr, test, ctx) {
    var result = null;
    arr.some(function(el, i) {
        return test.call(ctx, el, i, arr) ? ((result = el), true) : false;
    });
    return result;
}

var result = find(someArray, isNotNullNorUndefined);

Ab ECMAScript 6 können Sie Array.prototype.finddies verwenden. Dies ist in Firefox (25.0), Chrome (45.0), Edge (12) und Safari (7.1) implementiert und funktioniert, jedoch nicht in Internet Explorer oder einer Reihe anderer alter oder ungewöhnlicher Plattformen .

Der folgende Ausdruck wird beispielsweise als ausgewertet 106.

[100,101,102,103,104,105,106,107,108,109].find(function (el) {
    return el > 105;
});

Wenn Sie dies jetzt verwenden möchten, aber Unterstützung für IE oder andere nicht unterstützende Browser benötigen, können Sie einen Shim verwenden. Ich empfehle die es6-shim . MDN bietet auch eine Unterlegscheibe an, wenn Sie aus irgendeinem Grund nicht die gesamte es6-Unterlegscheibe in Ihr Projekt einfügen möchten. Für maximale Kompatibilität möchten Sie das es6-shim, da es im Gegensatz zur MDN-Version fehlerhafte native Implementierungen erkennt findund überschreibt (siehe den Kommentar, der mit "Umgehen von Fehlern in Array # find und Array # findIndex" beginnt, und die unmittelbar darauf folgenden Zeilen). .

Was ist mit der Verwendung von Filter und dem Abrufen des ersten Index aus dem resultierenden Array?

var result = someArray.filter(isNotNullNorUndefined)[0];

Inzwischen sollte klar sein, dass JavaScript keine solche Lösung von Haus aus bietet. Hier sind die beiden nächsten Ableitungen, die nützlichsten zuerst:

1. Array.prototype.some(fn)bietet das gewünschte Verhalten beim Stoppen, wenn eine Bedingung erfüllt ist, gibt jedoch nur zurück, ob ein Element vorhanden ist; Es ist nicht schwer, einige Tricks anzuwenden, wie die Lösung, die Bergis Antwort bietet .

2. Array.prototype.filter(fn)[0]Dies ist ein großartiger Einzeiler, der jedoch am wenigsten effizient ist, da Sie N - 1Elemente wegwerfen , um das zu erhalten, was Sie benötigen.

Herkömmliche Suchmethoden in JavaScript zeichnen sich dadurch aus, dass der Index des gefundenen Elements anstelle des Elements selbst oder -1 zurückgegeben wird. Dadurch wird vermieden, dass ein Rückgabewert aus der Domäne aller möglichen Typen ausgewählt werden muss. Ein Index kann nur eine Zahl sein und negative Werte sind ungültig.

Beide oben genannten Lösungen unterstützen auch keine Offset-Suche, daher habe ich beschlossen, Folgendes zu schreiben:

(function(ns) {
  ns.search = function(array, callback, offset) {
    var size = array.length;

    offset = offset || 0;
    if (offset >= size || offset <= -size) {
      return -1;
    } else if (offset < 0) {
      offset = size - offset;
    }

    while (offset < size) {
      if (callback(array[offset], offset, array)) {
        return offset;
      }
      ++offset;
    }
    return -1;
  };
}(this));

search([1, 2, NaN, 4], Number.isNaN); // 2
search([1, 2, 3, 4], Number.isNaN); // -1
search([1, NaN, 3, NaN], Number.isNaN, 2); // 3

Zusammenfassung:

• Um das erste Element in einem Array zu finden, das einer booleschen Bedingung entspricht, können wir das verwenden ES6 find()
• find()befindet sich auf, Array.prototypeso dass es auf jedem Array verwendet werden kann.
• find()nimmt einen Rückruf entgegen, bei dem eine booleanBedingung getestet wird. Die Funktion gibt den Wert zurück (nicht den Index!)

Beispiel:

const array = [4, 33, 8, 56, 23];

const found = array.find((element) => {
  return element > 50;
});

console.log(found);   //  56

Wenn Sie verwenden underscore.js, können Sie seine findund indexOfFunktionen verwenden, um genau das zu erhalten, was Sie wollen:

var index = _.indexOf(your_array, _.find(your_array, function (d) {
    return d === true;
}));

Dokumentation:

• http://underscorejs.org/#find
• http://underscorejs.org/#indexOf

Ab ES 2015 ist Array.prototype.find()genau diese Funktionalität vorgesehen.

Für Browser, die diese Funktion nicht unterstützen, hat das Mozilla Developer Network eine Polyfüllung bereitgestellt (unten eingefügt):

if (!Array.prototype.find) {
  Array.prototype.find = function(predicate) {
    if (this === null) {
      throw new TypeError('Array.prototype.find called on null or undefined');
    }
    if (typeof predicate !== 'function') {
      throw new TypeError('predicate must be a function');
    }
    var list = Object(this);
    var length = list.length >>> 0;
    var thisArg = arguments[1];
    var value;

    for (var i = 0; i < length; i++) {
      value = list[i];
      if (predicate.call(thisArg, value, i, list)) {
        return value;
      }
    }
    return undefined;
  };
}

Array.prototype.find () macht genau das, weitere Informationen: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/find

foundElement = myArray[myArray.findIndex(element => //condition here)];

Ich habe mich von mehreren Quellen im Internet inspirieren lassen, um die unten stehende Lösung zu finden. Wollte sowohl einige Standardwerte berücksichtigen als auch eine Möglichkeit bieten, jeden Eintrag für einen generischen Ansatz zu vergleichen, den dies löst.

Verwendung: (Wert "Sekunde" angeben)

var defaultItemValue = { id: -1, name: "Undefined" };
var containers: Container[] = [{ id: 1, name: "First" }, { id: 2, name: "Second" }];
GetContainer(2).name;

Implementierung:

class Container {
    id: number;
    name: string;
}

public GetContainer(containerId: number): Container {
  var comparator = (item: Container): boolean => {
      return item.id == containerId;
    };
    return this.Get<Container>(this.containers, comparator, this.defaultItemValue);
  }

private Get<T>(array: T[], comparator: (item: T) => boolean, defaultValue: T): T {
  var found: T = null;
  array.some(function(element, index) {
    if (comparator(element)) {
      found = element;
      return true;
    }
  });

  if (!found) {
    found = defaultValue;
  }

  return found;
}

In Javascript ist keine Funktion integriert, um diese Suche durchzuführen.

Wenn Sie jQuery verwenden, können Sie a jQuery.inArray(element,array).

Eine weniger elegante Methode, mit der throwalle richtigen Fehlermeldungen (basierend auf Array.prototype.filter) angezeigt werden, die jedoch beim ersten Ergebnis nicht mehr wiederholt werden, ist

function findFirst(arr, test, context) {
    var Result = function (v, i) {this.value = v; this.index = i;};
    try {
        Array.prototype.filter.call(arr, function (v, i, a) {
            if (test(v, i, a)) throw new Result(v, i);
        }, context);
    } catch (e) {
        if (e instanceof Result) return e;
        throw e;
    }
}

Dann sind Beispiele

findFirst([-2, -1, 0, 1, 2, 3], function (e) {return e > 1 && e % 2;});
// Result {value: 3, index: 5}
findFirst([0, 1, 2, 3], 0);               // bad function param
// TypeError: number is not a function
findFirst(0, function () {return true;}); // bad arr param
// undefined
findFirst([1], function (e) {return 0;}); // no match
// undefined

Es funktioniert, indem es filtermit using endet throw.