"Objekt unterstützt keine Eigenschaft oder Methode 'find'" im IE

77

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>

        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

    <script>

        $(document).ready(function () {


            var data = [{
                "Id": "SWE",
                "Country": "Sweden",
                "Population": 9592552
            }, {
                "Id": "NOR",
                "Country": "Norway",
                "Population": 5084190
            }];


            function display(e) {
                alert("E" + e);
                var countryData = data.find(function (element, index, array) {
                    return element.Id === e;
                });
                alert(countryData.Population);
            }
            display('SWE');


        });


    </script>
</head>
</html>

Der oben angegebene Code funktioniert ordnungsgemäß in Firefox und Chrome, aber im Internet Explorer wird eine Fehlermeldung angezeigt. Fehlermeldung:

Objekt unterstützt keine Eigenschaft oder Methode 'find'

javascript c# visual-studio internet-explorer

— GOPAL YADAV
quelle

Mit welcher Version (en) von IE testen Sie? Befindet es sich auch im Standardmodus, Kompatibilitätsmodus oder Mackenmodus?

— Simba

Hallo @ Simba, ich benutze IE Version 11.0.9660.18321

— GOPAL YADAV

caniuse.com ist sehr hilfreich, um zu überprüfen, welche Browser welche Funktionen unterstützen .

— Rachel Gallen

developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…

— Christophe Roussy

49

Hier ist eine Abhilfe. Sie können Filter anstelle von Suchen verwenden. Der Filter gibt jedoch ein Array übereinstimmender Objekte zurück. findGibt nur die erste Übereinstimmung innerhalb eines Arrays zurück. Warum also nicht den folgenden Filter verwenden?

data.filter(function (x) {
         return x.Id === e
    })[0];

— Mahib
quelle

3

Dieses Problem ist kürzlich bei einem Projekt aufgetreten, und es bestand allgemeiner Konsens darin, @ babel / polyfill zu verwenden. Ging diese Route und entdeckte, dass die Polyfüllung tatsächlich ein paar seltsame Fehler verursachte, also mussten wir sie ziehen. Diese zielgerichtete Lösung löste das Problem jedoch ohne Nebenwirkungen. Einfach, sauber, direkt auf den Punkt. Vielen Dank!

— David Vasquez

4

Einfachste, sauberste und gleichwertige Problemumgehung für diejenigen, die IE11-kompatibel bleiben müssen, danke!

— Mark Seagoe

1

Der Hauptunterschied zwischen den Funktionen filter () und find () besteht darin, dass filter () alle Arrays und find () nur für das erste Auftreten durchläuft. Diese Problemumgehung kann zu Leistungsproblemen führen.

— Filip Kováč

43

Wie bereits erwähnt array.find()wird im IE nicht unterstützt.

Sie können jedoch hier über eine Polyfüllung lesen:

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/find#Polyfill

Diese Methode wurde der ECMAScript 2015-Spezifikation hinzugefügt und ist möglicherweise noch nicht in allen JavaScript-Implementierungen verfügbar. Sie können Array.prototype.find jedoch mit dem folgenden Snippet polyfill füllen:

Code:

// https://tc39.github.io/ecma262/#sec-array.prototype.find
if (!Array.prototype.find) {
  Object.defineProperty(Array.prototype, 'find', {
    value: function(predicate) {
     // 1. Let O be ? ToObject(this value).
      if (this == null) {
        throw new TypeError('"this" is null or not defined');
      }

      var o = Object(this);

      // 2. Let len be ? ToLength(? Get(O, "length")).
      var len = o.length >>> 0;

      // 3. If IsCallable(predicate) is false, throw a TypeError exception.
      if (typeof predicate !== 'function') {
        throw new TypeError('predicate must be a function');
      }

      // 4. If thisArg was supplied, let T be thisArg; else let T be undefined.
      var thisArg = arguments[1];

      // 5. Let k be 0.
      var k = 0;

      // 6. Repeat, while k < len
      while (k < len) {
        // a. Let Pk be ! ToString(k).
        // b. Let kValue be ? Get(O, Pk).
        // c. Let testResult be ToBoolean(? Call(predicate, T, « kValue, k, O »)).
        // d. If testResult is true, return kValue.
        var kValue = o[k];
        if (predicate.call(thisArg, kValue, k, o)) {
          return kValue;
        }
        // e. Increase k by 1.
        k++;
      }

      // 7. Return undefined.
      return undefined;
    }
  });
}

— Ogglas
quelle

40

Sie verwenden die JavaScript- array.find()Methode. Beachten Sie, dass dies Standard-JS ist und nichts mit jQuery zu tun hat. Tatsächlich verwendet Ihr gesamter Code in der Frage jQuery überhaupt nicht.

Die Dokumentation dazu finden Sie array.find()hier: https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/find

Wenn Sie zum Ende dieser Seite scrollen, werden Sie feststellen, dass sie Informationen zur Browserunterstützung enthält, und Sie werden feststellen, dass der IE diese Methode nicht unterstützt.

Ironischerweise können Sie dies am besten umgehen, indem Sie jQuery verwenden, das über ähnliche Funktionen verfügt, die in allen Browsern unterstützt werden.

— Simba
quelle

Eine zweite Alternative ist das Rollen Ihrer eigenen for-Schleife, wenn Sie aus irgendeinem Grund jQuery nicht verwenden dürfen

— Stephan

22

Oder tun Sie es einfacharray.filter()[0]

— Rok Burgar

4

lol'd bei "Ironischerweise wäre Ihr bester Weg, dies zu umgehen, jQuery zu verwenden" :)

— Ivan Durst

33

Array.prototype.find wird in keiner IE-Version unterstützt

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/find

— Carl Markham
quelle

9

Und die Seite bietet eine nützliche

— Polyfüllung

1

Das Polyfill funktioniert einfach hervorragend, es prüft, ob der prototype.find undefiniert ist, und definiert dann die Eigenschaft für den Array.prototype: Object.defineProperty (Array.prototype, 'find', {Thanks!

— Leo

4

Ich habe das gleiche Problem durch Hinzufügen von Polyfill gelöst :

<script src="https://cdn.polyfill.io/v3/polyfill.min.js?features=default,Array.prototype.includes,Array.prototype.find"></script>

Eine Polyfüllung ist ein Code (normalerweise JavaScript im Web), der verwendet wird, um moderne Funktionen in älteren Browsern bereitzustellen, die ihn nicht nativ unterstützen.

Hoffe jemand findet das hilfreich.

— Rahul Mahadik
quelle

1

funktioniert perfekt für mich, vielen Dank !!!

— javascript110899

2

Nur um die Suchmethode des Unterstrichs zu erwähnen , funktioniert sie im IE problemlos.

— Elnoor
quelle

-7

Die Array.findMethodenunterstützung für die Browser von Microsoft begann mit Edge .

In der W3Schools-Kompatibilitätstabelle wird angegeben , dass die Unterstützung ab Version 12 gestartet wurde, während in der Kompatibilitätstabelle "Kann ich verwenden" angegeben ist , dass die Unterstützung zwischen Version 12 und 14 unbekannt war und ab Version 15 offiziell unterstützt wird.

— suyesh
quelle

14

IE12 existiert nicht. Der Browser, den Sie mit dem blauen "e" -Logo betrachten, heißt jetzt Edge und unterscheidet sich erheblich vom Vorgänger-IE.

— Simba