Ich habe das in einem Plugin gesehen:

var options = $.extend(defaults, options); 

Wie funktioniert es?

Was macht extend()das

Mehrere Parameter

Die Dokumentation erklärt nicht genau, wie Extend funktioniert, daher habe ich einen kleinen Test durchgeführt:

var a = {foo: 1, bar: 1};
var b = {foo: 2, baz: 2};
var c = {foo: 3};
var r = jQuery.extend(a,b,c);
console.log("A: Foo=" + a.foo + " Bar=" + a.bar + " Baz=" + a.baz);
console.log("B: Foo=" + b.foo + " Bar=" + b.bar + " Baz=" + b.baz);
console.log("C: Foo=" + c.foo + " Bar=" + c.bar + " Baz=" + c.baz);
console.log("R: Foo=" + r.foo + " Bar=" + r.bar + " Baz=" + r.baz);
console.log("A === R?: " + (a === r));

(Die console.logFunktion soll in Firebug funktionieren. Ersetzen Sie sie durch alert () oder eine andere Ausgabefunktion, wenn Sie möchten.)

Die Ergebnisse sind:

A: Foo=3 Bar=1 Baz=2
B: Foo=2 Bar=undefined Baz=2
C: Foo=3 Bar=undefined Baz=undefined
R: Foo=3 Bar=1 Baz=2
A === R?: true

Daran können wir erkennen, dass jQuery.extend ():

• Beginnt mit dem Objekt, das vom ersten Parameter bereitgestellt wird.
• Fügt eine beliebige Eigenschaft im zweiten Parameter hinzu. Wenn die Eigenschaft bereits im ersten Parameter vorhanden ist, wird sie überschrieben. Das Objekt für den zweiten Parameter bleibt unverändert.
• Wiederholt den obigen Vorgang mit allen nachfolgenden Parametern.
• Gibt den ersten Parameter zurück.

Dies ist nützlich, um Benutzer- und Standardoptionsobjekte miteinander zu kombinieren, um einen vollständigen Satz von Optionen zu erhalten:

function foo(userOptions) {
  var defaultOptions = {
    foo: 2,
    bar: 2
  };
  var someOtherDefaultOptions = {
    baz: 3
  };

  var allOptions = jQuery.extend(
    defaultOptions,
    someOtherDefaultOptions,
    userOptions
  );
  doSomething(allOptions);
}

foo({foo:1, baz:1});

Beachten Sie, dass "null" ein gültiger Wert für das Überschreiben ist, "undefiniert" jedoch nicht. Möglicherweise können Sie dies nutzen.

var a = {foo: "a", bar: "a"};
var b = {foo: null, bar: undefined};
jQuery.extend(a,b);
console.log("A: Foo=" + a.foo + " Bar=" + a.bar);

Ergebnisse in:

A: Foo=null Bar=a

Einzelner Parameter

Wenn Sie nur ein Objekt an übergeben jQuery.extend(), geht jQuery davon aus, dass das jQueryObjekt selbst der "erste" Parameter ist (dh das zu ändernde) und Ihr Objekt das "zweite" (dh dasjenige, das dem ersten hinzugefügt werden soll). . So:

console.log( "Before: " + jQuery.foo );
jQuery.extend({foo:1});
console.log( "After: " + jQuery.foo );

Ergebnisse in:

Before: undefined
After: 1

Es führt den Inhalt eines Objekts mit einem anderen zusammen . Wenn wir zwei Objekte übergeben, werden dem ersten Objekt / ersten Parameter zweite Objekteigenschaften hinzugefügt

Ex: $.extend(object1, object2);

Jetzt enthält Objekt1 Eigenschaften von Objekt2

Wenn wir zwei Objekte zusammenführen möchten, müssen wir im ersten Parameter ein leeres Objekt übergeben

Ex: var newObject = $.extend({}, object1, object2);

Jetzt enthält newObject beide Eigenschaften von Objekt1 und Objekt2 .

Aus der jQuery-Dokumentation

Führen Sie den Inhalt von zwei oder mehr Objekten zum ersten Objekt zusammen.

In einem Plugin-Kontext: Wenn der Benutzer die optionalen Parameter für die Funktion nicht festlegt, wird stattdessen ein Standardwert verwendet.

Wie funktioniert extens () in jQuery? [Aufgelöst]

jQuery hat Deep Copy und Light Copy. Der erste Boolesche entscheidet, wahr für tief und falsch für Licht.

Beispielsweise:

• jQuery.extend (false, {'a': {'a1': 1}}, {'a': {'a2': 2}})

  Das Ergebnis ist: {'a': {'a2': 2}}, da dies eine leichte Kopie ist, vergleiche einfach Level 1.

  

• jQuery.extend (true, {'a': {'a1': 1}}, {'a': {'a2': 2}})

  Das Ergebnis ist: {'a': {'a1': 1, 'a2': 2}} Dies ist eine tiefe Kopie mit vielen Objektebenen (genau wie die Ebene des Arrays).

  

• jQuery.extend (a, b, c) mit a, b, c ist ein Objekt oder Array. Die Flussüberschreibung ist b-> a, c -> a (b Überschreibung a, c Überschreibung a ...). Diese Funktion gibt a zurück und ändert auch den Wert.

Erweiterte Beispiele:

• jQuery.extend ({'number_param': 1})

  Falls Sie nur einen Parameter übergeben. jQuery wird sich selbst erweitern. console.log (jQuery ['number_param']) gibt 1 aus.

  

• jQuery.extend (1, {'number_param': '2'}); In diesem Beispiel wird jQuery selbst nicht angehängt. Der erste Parameter muss boolesch sein. In diesem Fall wird {'number_param': '2'} zurückgegeben und jQuery wird nicht aktualisiert.

  

• jQuery.extend (a, b, c, d, e, f); Die Zusammenführung der Bestellung erfolgt. b -> a, c -> a, d -> a, e -> a, f -> a (b überschreiben a, c überschreiben a ...). Und die Ergebnisrendite wird a sein.

  mit a = {'p': 1}. jQuery.extend (a, {'p': 2}, {'p': 3}, {'p': 4}, {'p': 5}) gibt a zurück und a = {'p': 6}. Die an diese Funktion übergebenen Zahlenparameter sind unbegrenzt.

  

Der Zweck besteht darin, ein vorhandenes Objekt zu erweitern. Wenn wir beispielsweise ein Vorlagenobjekt haben und dieses erweitern möchten, indem wir weitere Eigenschaften hinzufügen oder vorhandene Eigenschaften überschreiben, kann jquery extension nützlich sein.

var carObjectTemplate = {
"make": "honda",
"model":"city",
"mileage":"20",
"variant":"petrol"

};

Wenn wir es jetzt erweitern möchten $.extend(true, {"color":"red"}, carObjectTemplate, {"model": 'amaze'}); , erhalten wir die Ausgabe, erweitern carObjectTemplate und fügen hinzu

{"color":"red"} property and overriding "model" property from "city" to "amaze"

Der erste boolesche Parameter true / false gibt an, ob eine tiefe oder flache Kopie benötigt wird

Es macht genau das

Beschreibung : Füge den Inhalt von zwei oder mehr Objekten zum ersten Objekt zusammen.

Mehr unter jQuery.extend ()