Heim > Web-Frontend > js-Tutorial > Hauptteil

Der Unterschied zwischen const und Object.freeze() in Javascript

青灯夜游
Freigeben: 2020-11-23 17:40:03
nach vorne
3175 Leute haben es durchsucht

Der Unterschied zwischen const und Object.freeze() in Javascript

In diesem Artikel werden einige Methoden zur Verwendung von const und Object.freeze() zum Definieren von Konstanten und Konfigurationswerten in JS sowie die Unterschiede vorgestellt zwischen ihnen. constObject.freeze()在 JS中定义常量和配置值一些做法,以及它们之间的区别。

当我们在 JS 应用程序中定义常量和配置值时。它们应具有以下特点:

  • 跨应用程序可访问
  • 量的值是不可变的
  • 变量的引用应该是不可变的

接下来,我们来一个个看下上面三个特征。

使用 let

我们使用 let 来定义变量。

let APP_NAME = "前端小智@大迁世界"

function getApplicationName() {
   APP_NAME = "他是谁?"
   return APP_NAME
}

getApplicationName() // "他是谁?"
Nach dem Login kopieren

在上面的示例中,函数getApplicationName()更改了APP_NAME的值。 我们要如何防止全局变量被更改?

使用 const

我们可以使用 const 来定义,这样全局变量就不会被更改到?

const  APP_NAME = "前端小智@大迁世界"

function getApplicationName() {
   APP_NAME = "他是谁?"
   return APP_NAME // 这里会抛出 TypeError 错误
}
Nach dem Login kopieren

试图更改使用const定义的变量的值,会导致此错误:

“TypeError: Assignment to constant variable.”

const 能防止变量值被更改吗?,看下面操作:

const fruites = ['葡萄', '哈密瓜']
fruites.push('香蕉')

console.log(fruites ) //  ["葡萄", "哈密瓜", "香蕉"]
Nach dem Login kopieren
const constants = {
  APP_NAME: "前端小智@大迁世界"
}
constants.APP_NAME = "他是谁?"
console.log(constants.APP_NAME) // 他是谁?
Nach dem Login kopieren

从上面的两个例子中可以看出,即使使用const,也可以改变数组或对象的值。

const 不是使用变量的值不可变,而是变量的引用地址来可变。

现在我们知道,在数组和对象的情况下,我们不能改变引用,但可以改变值。如何防止数组和对象的值被改变?

使用 Object.freeze()

这是Object.freeze()起作用的地方,Object.freeze 忽略对象和数组的值更改。

let constants = Object.freeze({
  APP_NAME: "前端小智@大迁世界"
})
constants.APP_NAME = "他是谁?"
console.log(constants.APP_NAME) // "前端小智@大迁世界"
Nach dem Login kopieren

可以从示例中看到,如果更改值,它不会抛出任何错误,也不会影响对象状态。

Object.freeze() 可以防止更改对象的值,但不能阻止引用的更改:

let constants = Object.freeze({
  APP_NAME: "前端小智@大迁世界"
})
constants = {
   APP_NAME : "Unknown App"
}
console.log(constants.APP_NAME); // "Unknown App"
Nach dem Login kopieren

小结一下:

  1. const不允许改变对象或数组的引用,但可以改变其值。
  2. Object.freeze() 忽略对象或数组的值更改

把它们组合在一起将防止更改对象或数组的引用和值

一起使用 const 和 Object.freeze()

const constants = Object.freeze({
  APP_NAME : "Coding N Concepts"
});

constants.APP_NAME = "Unknown App"; // 这被忽略

constants = { 
  APP_NAME : "Unknown App" 
}; // 这将抛出TypeError
Nach dem Login kopieren

上面的示例表明,将constObject.freeze()

Wenn wir Konstanten und Konfigurationswerte in JS-Anwendungen definieren. Sie sollten die folgenden Eigenschaften aufweisen:
  • Applikationsübergreifend zugänglich
  • Der Wert der Variablen sollte unveränderlich sein
  • Der Verweis auf die Variable sollte unveränderlich sein

Als nächstes schauen wir uns die oben genannten drei Funktionen einzeln an.

Verwenden Sie let

Wir verwenden let, um Variablen zu definieren.

rrreee

Im obigen Beispiel ändert die Funktion getApplicationName() den Wert von APP_NAME. Wie verhindern wir, dass globale Variablen geändert werden?

Verwenden Sie const

Können wir const verwenden, um zu definieren, dass globale Variablen nicht geändert werden?

rrreeeDer Versuch, den Wert einer mit const definierten Variablen zu ändern, führt zu diesem Fehler:

"TypeError: Assignment to Constant Variable."🎜🎜const kann dies verhindern der Variablenwert Wurde er geändert? , siehe die folgende Operation: 🎜rrreeerrreee🎜Wie Sie an den beiden obigen Beispielen sehen können, können Sie auch mit const den Wert eines Arrays oder Objekts ändern. 🎜🎜const verwendet nicht den Wert der Variablen, um unveränderlich zu sein, sondern die Referenzadresse der Variablen, um sie variabel zu machen. 🎜🎜Jetzt wissen wir, dass wir bei Arrays und Objekten die Referenz nicht ändern können, aber wir können den Wert ändern. Wie kann verhindert werden, dass die Werte von Arrays und Objekten geändert werden? 🎜

Verwenden Sie Object.freeze()

🎜Hier kommt Object.freeze() ins Spiel, Object.freeze ignoriert die Werte von Objekten und Arrays Ändern. 🎜rrreee🎜 Wie Sie dem Beispiel entnehmen können, wird beim Ändern des Werts kein Fehler ausgegeben und der Objektstatus wird nicht beeinträchtigt. 🎜🎜Object.freeze() kann verhindern, dass der Wert des Objekts geändert wird, aber es kann nicht die Änderung der Referenz verhindern: 🎜rrreee🎜Zusammenfassend: 🎜
  1. const nicht Es ist erlaubt, die Referenz eines Objekts oder Arrays zu ändern, nicht jedoch seinen Wert.
  2. Object.freeze() Wertänderungen eines Objekts oder Arrays ignorieren
🎜Gruppieren Sie sie zusammen, um Änderungen an der Referenz und dem Wert eines Objekts zu verhindern oder Array 🎜

Verwendung von const und Object.freeze()

rrreee🎜Das obige Beispiel zeigt, dass die Verwendung von const mit Object.freeze() nützlich ist, wenn Das Definieren von Konstanten und Konfigurationen in JS ist sehr nützlich. 🎜🎜🎜Originaladresse: https://codingnconcepts.com/javascript/const-vs-object-freeze/🎜🎜Autor: Ashish Lahoti🎜🎜Übersetzungsadresse: https://segmentfault.com/a/1190000038140180🎜🎜🎜Mehr Für mehr Programmierwissen besuchen Sie bitte: 🎜Programming Learning Website🎜! ! 🎜

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

Verwandte Etiketten:
Quelle:segmentfault.com
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
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage