Verstehen Sie den Unterschied zwischen Object.freeze() und const in JavaScript

Verwandte Lernempfehlungen: Javascript-Video-Tutorial

Seit seiner Veröffentlichung hat ES6 einige neue Funktionen und Methoden in JavaScript eingeführt. Diese Funktionen können unseren Arbeitsablauf und unsere Produktivität als JavaScript-Entwickler besser verbessern. Zu diesen neuen Funktionen gehören die Methode Object.freeze() und const. Object.freeze() 方法和 const。

在少数开发者尤其是新手中，有人认为这两个功能的工作原理是一样的，但NO，它们不是。Object.freeze() 和 const 的工作原理不同。让我来告诉你怎么做！

概况

const 和 Object.freeze() 完全不同。

• const 的行为就像 let。唯一的区别是，它定义了无法重新分配的变量。const 声明的变量是块范围的，而不是函数范围的，就像用 var 声明的变量一样。
• Object.freeze() 将一个对象作为参数，并返回与不可变对象相同的对象。这意味着不能添加，删除或更改对象的任何属性。

示例

const

const user = 'Bolaji Ayodeji'user = 'Joe Nash'复制代码

这将引发 Uncaught TypeError，因为我们试图重新分配使用 const 关键字声明的变量 user。这无效。

最初，这将适用于 var 或 let ，但不适用于 const。

const的问题

当使用对象时，使用const仅防止重新分配，而不防止不变性。 （防止更改其属性的能力）

考虑下面的代码。我们已经使用 const 关键字声明了一个变量，并为其分配了一个名为 user 的对象。

const user = {  first_name: 'bolaji',  last_name: 'ayodeji',  email: 'hi@bolajiayodeji.com',  net_worth: 2000}

user.last_name = 'Samson';// 这行得通，user仍然可变！user.net_worth = 983265975975950;// 这也行得通，用户仍然可变且变得富有 :)!console.log(user);  // user被突变复制代码

尽管我们无法重新分配名为object的变量，但是我们仍然可以对对象本身进行突变。

const user = {  user_name: 'bolajiayodeji'}// won't work复制代码

我们绝对希望对象具有无法修改或删除的属性。const 无法做到这一点，这就是 Object.freeze() 拯救我们的地方。

看一下Object.freeze()

要禁用对对象的任何更改，我们需要 Object.freeze()。

const user = {  first_name: 'bolaji',  last_name: 'ayodeji',  email: 'hi@bolajiayodeji.com',  net_worth: 2000}Object.freeze(user);

user.last_name = 'Samson';// 这行不通，user仍然是一成不变的！user.net_worth = 983265975975950;// 这也行不通，user仍然是一成不变的，仍然无法使用 :(!console.log(user);  // user is immutated复制代码

具有嵌套属性的对象实际上并未冻结

嗯，Object.freeze() 有点浅显，你需要在嵌套对象上应用它来递归保护它们。

const user = {  first_name: 'bolaji',  last_name: 'ayodeji',  contact: {    email: 'hi@bolajiayodeji.com',    telephone: 08109445504,
  }
}Object.freeze(user);

user.last_name = 'Samson';// 这行不通，user仍然是一成不变的！user.contact.telephone = 07054394926;// 这将起作用，因为嵌套对象未冻结console.log(user);复制代码

因此，当 Object.freeze() 具有嵌套的属性时，它不会完全冻结它。

要完全冻结对象及其嵌套属性，你可以编写自己的库或使用已创建的库，例如Deepfreeze或immutable-js

总结

const 和 Object.freeze() 不同，const 防止重新分配，而 Object.freeze()

Unter einigen Entwicklern, insbesondere unter Neulingen, denken einige, dass diese beiden Funktionen gleich funktionieren, aber NEIN, das ist nicht der Fall. Object.freeze() und const funktionieren unterschiedlich. Ich zeige Ihnen wie!

Übersicht

const und Object.freeze() sind völlig unterschiedlich.

• const verhält sich wie let. Der einzige Unterschied besteht darin, dass es Variablen definiert, die nicht neu zugewiesen werden können. Mit const deklarierte Variablen sind blockbezogen und nicht funktionsbezogen, wie mit var deklarierte Variablen.
• Object.freeze() nimmt ein Objekt als Argument und gibt dasselbe Objekt wie das unveränderliche Objekt zurück. Das bedeutet, dass keine Eigenschaften des Objekts hinzugefügt, entfernt oder geändert werden können.

Beispiel

const

rrreeeDies wird auslösen Nicht abgefangener TypeError, weil wir versucht haben, die mit dem Schlüsselwort const deklarierte Variable user neu zuzuweisen. Das funktioniert nicht.

Zunächst funktioniert dies mit var oder let, aber nicht mit const.

Probleme mit const

🎜Bei der Verwendung von Objekten verhindert die Verwendung von const nur die Neuzuweisung, nicht die Unveränderlichkeit. (Möglichkeit, Änderungen an seinen Eigenschaften zu verhindern) 🎜🎜Beachten Sie den folgenden Code. Wir haben eine Variable mit dem Schlüsselwort const deklariert und ihr ein Objekt namens user zugewiesen. 🎜rrreee

🎜Obwohl wir die Variable namens Objekt nicht neu zuweisen können, können wir das Objekt selbst dennoch mutieren. 🎜rrreee

🎜Wir möchten unbedingt, dass das Objekt Eigenschaften hat, die nicht geändert oder gelöscht werden können. const kann dies nicht, und hier kommt uns Object.freeze() zu Hilfe. 🎜

Sehen Sie sich Object.freeze() an

🎜Um jegliche Änderungen am Objekt zu deaktivieren, benötigen wir Object.freeze(). 🎜rrreee

Objekte mit verschachtelten Eigenschaften werden nicht wirklich eingefroren

🎜Nun, Object.freeze() ist etwas oberflächlich, Sie müssen es auf verschachtelte Objekte anwenden, um sie rekursiv zu schützen. 🎜rrreee<figure><img class="lazyload" src="https://img.php.cn/upload/article/000/000/052/711d9e9172ba396448af5ff0dbd10e5e-4.png" data- style="max-width:90%" data- style="max-width:90%" alt="Verstehen Sie den Unterschied zwischen Object.freeze() und const in JavaScript" ></figure>🎜Wenn also <code>Object.freeze() eine verschachtelte Eigenschaft hat, wird diese nicht vollständig eingefroren. 🎜🎜Um ein Objekt und seine verschachtelten Eigenschaften vollständig einzufrieren, können Sie Ihre eigene Bibliothek schreiben oder eine bereits erstellte Bibliothek wie Deepfreeze oder immutable-js verwenden🎜

Zusammenfassung

🎜 const unterscheidet sich von Object.freeze() darin, dass const eine Neuzuweisung verhindert, während Object.freeze() Transsexuelle verhindert. 🎜🎜🎜Wenn Sie mehr über das Erlernen des Programmierens erfahren möchten, achten Sie bitte auf die Spalte „PHP-Schulung“! 🎜🎜🎜

Das obige ist der detaillierte Inhalt vonVerstehen Sie den Unterschied zwischen Object.freeze() und const in JavaScript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!