Ich habe das in einem Plugin gesehen:

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

Wie funktioniert es?

Was macht extend() tun?

Mehrere Parameter

Die Dokumentation erklärt nicht genau, wie Extend funktioniert, also 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));

(Das console.log Funktion soll in Firebug funktionieren; Ersetzen Sie es 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 sehen, dass jQuery.extend():

• Beginnt mit dem vom ersten Parameter bereitgestellten Objekt.
• 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 das obige mit jedem nachfolgenden Parameter.
• 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 zum Überschreiben ist, “undefined” jedoch nicht. Vielleicht kannst du davon Gebrauch machen.

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()dann geht jQuery davon aus, dass die jQuery Objekt selbst ist der “erste” Parameter (dh der zu ändernde), und Ihr Objekt ist der “zweite” (dh der, der 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ügt den Inhalt eines Objekts mit einem anderen zusammen. Passieren wir zwei Objekte, zweite Objekteigenschaften werden zum ersten Objekt / ersten Parameter hinzugefügt

Ex: $.extend(object1, object2);

Jetzt Objekt1 enthält Eigenschaften von Objekt2

Wenn wir wollen zwei Objekte zusammenführendann müssen wir im ersten Parameter ein leeres Objekt übergeben

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

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

Aus der jQuery-Dokumentation

Verschmelzen Sie den Inhalt von zwei oder mehr Objekten mit dem ersten Objekt.

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

Wie funktioniert extend() in jQuery? [Resolved]

jQuery hat Deep Copy und Light Copy. Der erste boolesche Wert entscheidet darüber, wahr für tief und falsch für leicht.

Zum Beispiel:

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

  das Ergebnis wird sein: {‘a’: {‘a2’: 2}} Da dies eine leichte Kopie ist, vergleichen Sie 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 Objekt oder Array. Die Flussüberschreibung ist b->a, c ->a (b überschreibt a, c überschreibt a …). Diese Funktion gibt a zurück und a ändert auch den Wert.

Fortgeschrittene Beispiele:

• jQuery.extend({‘number_param’: 1})

  Falls Sie nur einen Parameter übergeben. jQuery erweitert sich selbst. console.log(jQuery[‘number_param’]) gibt 1 aus.

  

• jQuery.extend(1, {‘number_param’: ‘2’}); Dieses Beispiel ist nicht das Anhängen von jQuery selbst. 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 Auftragszusammenführung wird sein. b -> a , c -> a, d -> a, e -> a, f -> a (b überschreibt a, c überschreibt a …) . Und die Ergebnisrückgabe 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 Anzahl der an diese Funktion übergebenen Parameter ist 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 extend nützlich sein.

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

};

Wenn wir es jetzt verlängern wollen,
$.extend(true, {"color":"red"}, carObjectTemplate, {"model": 'amaze'});
es wird uns Ausgabe geben, carObjectTemplate erweitern und hinzufügen

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

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

Genau das tut es

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

Mehr bei jQuery.extend()