Heim Web-Frontend js-Tutorial Der Unterschied zwischen flacher und tiefer Kopie in JavaScript

Der Unterschied zwischen flacher und tiefer Kopie in JavaScript

Jun 23, 2017 am 10:44 AM
javascript js 拷贝

Bevor Sie verstehen, was flache Kopie und tiefe Kopie sind, müssen Sie zunächst die Speichereigenschaften von Werttypen und Referenztypen in JavaScript verstehen.

1. Es gibt zwei Arten von Werttypen:
Grundlegende Datentypen: Zeichenfolge, Zahl, Boolescher Wert, Undefiniert, Null
Zusammengesetzte Datentypen: Array, Objekt, Funktion, Datum, RegExp. .

2. Zuweisung
```2.1 Beispiel für die grundlegende Datentypzuweisung

   var num = 123;
   var num2 = num;
Nach dem Login kopieren

"
* Die Speichereigenschaften der Werttypzuweisung, alle Daten in die Variable Erstellen Sie eine Kopie und speichern Sie sie in der neuen Variablen.
* `var num = 123` bedeutet, dass die in der Variablen gespeicherte Zahl 123 ist.
* Kopieren Sie dann die Daten, dh kopieren Sie 123. Dann im Speicher Es gibt 2 Datenstücke
* Weisen Sie die kopierten Daten „num2“ zu. Änderungen am Variablenwert von num2 haben keinen Einfluss auf den Variablenwert von num
* Sein Merkmal ist, dass es **zwei gibt Kopien von Daten** im Speicher.


"2.2 Beispiel für die Zuweisung zusammengesetzter Datentypen

var o = { name: '张三' };
var obj = o;
Nach dem Login kopieren

"
* Die Zuweisung besteht darin, die in gespeicherten Daten zu kopieren Variable o und weisen Sie dann die Daten zu Geben Sie obj
* Das Merkmal ist, dass sich nur eine Kopie der Daten im Speicher befindet und die Namensattributwerte von Objekt o und Objekt obj auf dieselbe Adresse verweisen
* Problem: Das Ändern des Namensattributs im Objekt obj wirkt sich auf den Wert aus, der dem Namensattribut entspricht.

Dann stellt sich die Frage, wie ein zusammengesetzter Datentyp einem anderen Objekt einen Wert zuweisen kann Beeinflusst es seinen eigenen Wert, wenn ein anderes Objekt den Wert ändert? 🎜>Lassen Sie mich über mein Verständnis von Deep Copy und Shallow Copy sprechen:

# Deep Copy und Shallow Copy

1 , was ist flache Kopie?
Flache Kopie: *Kopiert nur die Attribute des aktuellen Objekts.
Kopierte Objektattribute
Deep Copy: * Alle Referenzstrukturen der Daten des aktuellen Objekts werden kopiert und die Daten sind unabhängig im Speicher. Änderungen wirken sich nicht auf die kopierten Objekteigenschaften aus


2 Implementieren Sie Deep Copy-Code Kapselung



Testbeispiel:

var deepCopy = function () {
   // 1, 创建一个对象
   var temp = {};
   // 2, 拷贝属性, 判断如果是引用类型需要深拷贝
   for ( var k in this ) {
      if ( typeof this[ k ] === 'object' ) {
         temp[ k ] = this[ k ].deepCopy();
      } else {
         temp[ k ] = this[ k ];
      }
      // temp[ k ] = this[ k ];
   }
   // 3, 返回对象
   return temp;
};
Nach dem Login kopieren
Oben wird beschrieben, wie Deep Copy implementiert wird


Das obige ist der detaillierte Inhalt vonDer Unterschied zwischen flacher und tiefer Kopie in JavaScript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Heiße Artikel -Tags

Notepad++7.3.1

Notepad++7.3.1

Einfach zu bedienender und kostenloser Code-Editor

SublimeText3 chinesische Version

SublimeText3 chinesische Version

Chinesische Version, sehr einfach zu bedienen

Senden Sie Studio 13.0.1

Senden Sie Studio 13.0.1

Leistungsstarke integrierte PHP-Entwicklungsumgebung

Dreamweaver CS6

Dreamweaver CS6

Visuelle Webentwicklungstools

SublimeText3 Mac-Version

SublimeText3 Mac-Version

Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

So implementieren Sie ein Online-Spracherkennungssystem mit WebSocket und JavaScript So implementieren Sie ein Online-Spracherkennungssystem mit WebSocket und JavaScript Dec 17, 2023 pm 02:54 PM

So implementieren Sie ein Online-Spracherkennungssystem mit WebSocket und JavaScript

Wesentliche Tools für die Aktienanalyse: Lernen Sie die Schritte zum Zeichnen von Kerzendiagrammen mit PHP und JS Wesentliche Tools für die Aktienanalyse: Lernen Sie die Schritte zum Zeichnen von Kerzendiagrammen mit PHP und JS Dec 17, 2023 pm 06:55 PM

Wesentliche Tools für die Aktienanalyse: Lernen Sie die Schritte zum Zeichnen von Kerzendiagrammen mit PHP und JS

Empfohlen: Ausgezeichnetes JS-Open-Source-Projekt zur Gesichtserkennung und -erkennung Empfohlen: Ausgezeichnetes JS-Open-Source-Projekt zur Gesichtserkennung und -erkennung Apr 03, 2024 am 11:55 AM

Empfohlen: Ausgezeichnetes JS-Open-Source-Projekt zur Gesichtserkennung und -erkennung

WebSocket und JavaScript: Schlüsseltechnologien zur Implementierung von Echtzeitüberwachungssystemen WebSocket und JavaScript: Schlüsseltechnologien zur Implementierung von Echtzeitüberwachungssystemen Dec 17, 2023 pm 05:30 PM

WebSocket und JavaScript: Schlüsseltechnologien zur Implementierung von Echtzeitüberwachungssystemen

PHP- und JS-Entwicklungstipps: Beherrschen Sie die Methode zum Zeichnen von Aktienkerzendiagrammen PHP- und JS-Entwicklungstipps: Beherrschen Sie die Methode zum Zeichnen von Aktienkerzendiagrammen Dec 18, 2023 pm 03:39 PM

PHP- und JS-Entwicklungstipps: Beherrschen Sie die Methode zum Zeichnen von Aktienkerzendiagrammen

Verwendung von JavaScript und WebSocket zur Implementierung eines Echtzeit-Online-Bestellsystems Verwendung von JavaScript und WebSocket zur Implementierung eines Echtzeit-Online-Bestellsystems Dec 17, 2023 pm 12:09 PM

Verwendung von JavaScript und WebSocket zur Implementierung eines Echtzeit-Online-Bestellsystems

Einfaches JavaScript-Tutorial: So erhalten Sie den HTTP-Statuscode Einfaches JavaScript-Tutorial: So erhalten Sie den HTTP-Statuscode Jan 05, 2024 pm 06:08 PM

Einfaches JavaScript-Tutorial: So erhalten Sie den HTTP-Statuscode

JavaScript und WebSocket: Aufbau eines effizienten Echtzeit-Wettervorhersagesystems JavaScript und WebSocket: Aufbau eines effizienten Echtzeit-Wettervorhersagesystems Dec 17, 2023 pm 05:13 PM

JavaScript und WebSocket: Aufbau eines effizienten Echtzeit-Wettervorhersagesystems

See all articles