Möglichkeiten zum Erweitern des Array-Objekts in Javascript

ES6

class SubArray extends Array {
    constructor(...args) { 
        super(...args); 
    }
    last() {
        return this[this.length - 1];
    }
}
var sub = new SubArray(1, 2, 3);
sub // [1, 2, 3]
sub instanceof SubArray; // true
sub instanceof Array; // true

Verwenden von __proto__

(alte Antwort, nicht empfohlen, kann zu Leistungsproblemen führen )

function SubArray() {
  var arr = [ ];
  arr.Push.apply(arr, arguments);
  arr.__proto__ = SubArray.prototype;
  return arr;
}
SubArray.prototype = new Array;

Jetzt können Sie Ihre Methoden zu SubArray hinzufügen.

SubArray.prototype.last = function() {
  return this[this.length - 1];
};

Initialisieren Sie wie bei normalen Arrays

var sub = new SubArray(1, 2, 3);

Verhält sich wie normale Arrays

sub instanceof SubArray; // true
sub instanceof Array; // true

Vor einiger Zeit las ich das Buch Javascript Ninja von John Resig , dem Ersteller von jQuery . Er schlug vor, Array-ähnliche Methoden mit einem einfachen JS-Objekt nachzuahmen. Grundsätzlich ist nur length erforderlich. 

var obj = {
    length: 0, //only length is required to mimic an Array
    add: function(elem){
        Array.prototype.Push.call(this, elem);
    },
    filter: function(callback) {
        return Array.prototype.filter.call(this, callback); //or provide your own implemetation
    }
};

obj.add('a');
obj.add('b');
console.log(obj.length); //2
console.log(obj[0], obj[1]); //'a', 'b'

Ich meine nicht, dass es gut oder schlecht ist. Es ist eine originelle Art, Array-Operationen auszuführen. Der Vorteil ist, dass Sie den Array prototype..__ nicht erweitern. Denken Sie daran, dass obj eine einfache object ist, es ist keine Array. Deshalb gibt obj instanceof Arrayfalse zurück. Stellen Sie sich obj als Fassade vor.

Wenn dieser Code für Sie von Interesse ist, lesen Sie den Auszug Listing 4.10 Array-ähnliche Methoden simulieren.

In Ihrem dritten Beispiel erstellen Sie nur eine neue Eigenschaft mit dem Namen prototype für das Objekt Array3. Wenn Sie new Array3 tun, der new Array3() sein soll, instantiieren Sie dieses Objekt in der Variablen list3. Daher funktioniert die Add-Methode nicht, da this, das betreffende Objekt, keine gültige Methode Push hat. Ich hoffe du verstehst.

Edit: Check out JavaScript-Kontext verstehen , um mehr über this zu erfahren.

Versuchen Sie, etwas komplizierter zu machen, als nur einen Alias ​​für "Push" mit dem Namen "Hinzufügen" hinzuzufügen?

Wenn nicht, wäre es wahrscheinlich am besten, dies zu vermeiden. Ich schlage vor, dass dies eine schlechte Idee ist, weil Array ein eingebauter Javascript-Typ ist, wenn Sie ihn modifizieren, werden alle Scripts-Array-Typen mit Ihrer neuen Methode "Hinzufügen" versehen. Das Potenzial für Namenskollisionen mit anderen Drittanbietern ist hoch und könnte dazu führen, dass das Skript eines Drittanbieters seine Methode zugunsten Ihres Skripts verliert.

Meine allgemeine Regel ist, eine Hilfsfunktion für die Arbeit mit den Arrays zu erstellen, falls diese nicht bereits vorhanden ist, und Array nur dann zu erweitern, wenn es extrem notwendig ist.

var SubArray = function() {                                           
    var arrInst = new Array(...arguments); // spread arguments object
    /* Object.getPrototypeOf(arrInst) === Array.prototype */
    Object.setPrototypeOf(arrInst, SubArray.prototype);     //redirectionA
    return arrInst; // now instanceof SubArray
};

SubArray.prototype = {
    // SubArray.prototype.constructor = SubArray;
    constructor: SubArray,

    // methods avilable for all instances of SubArray
    add: function(element){return this.Push(element);},
    ...
};

Object.setPrototypeOf(SubArray.prototype, Array.prototype); //redirectionB

var subArr = new SubArray(1, 2);
subArr.add(3); subArr[2]; // 3

Die Antwort ist eine kompakte Problemumgehung, die in allen unterstützten Browsern wie beabsichtigt funktioniert.

Sie können das Array-Objekt NICHT in JavaScript erweitern. 

Stattdessen können Sie ein Objekt definieren, das eine Liste von Funktionen enthält, die für das Array ausgeführt werden, diese Funktionen in diese Array-Instanz einfügen und diese neue Array-Instanz zurückgeben. Was Sie nicht tun sollten, ist Array.prototype so zu ändern, dass Ihre benutzerdefinierten Funktionen in die Liste aufgenommen werden. 

Beispiel:

function MyArray() {
  var tmp_array = Object.create(Array.prototype);
  tmp_array = (Array.apply(tmp_array, arguments) || tmp_array);
  //Now extend tmp_array
  for( var meth in MyArray.prototype )
    if(MyArray.prototype.hasOwnProperty(meth))
      tmp_array[meth] = MyArray.prototype[meth];
  return (tmp_array);
}
//Now define the prototype chain.
MyArray.prototype = {
  customFunction: function() { return "blah blah"; },
  customMetaData: "Blah Blah",
}

Nur ein Beispielcode, Sie können ihn ändern und verwenden, wie Sie möchten. Das zugrunde liegende Konzept, das ich Ihnen empfehlen möchte, bleibt jedoch gleich. 

Sie können diesen Weg auch in ES6 verwenden:

Object.assign(Array.prototype, {
    unique() {
      return this.filter((value, index, array) => {
        return array.indexOf(value) === index;
      });
    }
});

Ergebnis:

let x = [0,1,2,3,2,3];
let y = x.unique();
console.log(y); // => [0,1,2,3]