La différence entre const et Object.freeze() en javascript

Cet article présente quelques pratiques d'utilisation de const et Object.freeze() pour définir des constantes et des valeurs de configuration dans JS, ainsi que les différences entre elles.

Lorsque nous définissons des constantes et des valeurs de configuration dans les applications JS. Ils doivent avoir les caractéristiques suivantes :

• Accessibles dans toutes les applications
• La valeur de la variable doit être immuable
• Les références à la variable doivent être immuables

Ensuite, examinons les trois fonctionnalités ci-dessus une par une.

Utiliser let

Nous utilisons let pour définir des variables.

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

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

getApplicationName() // "他是谁？"

Dans l'exemple ci-dessus, la fonction getApplicationName() change la valeur de APP_NAME. Comment empêcher la modification des variables globales ?

Utiliser const

Pouvons-nous utiliser const pour définir afin que la variable globale ne soit pas modifiée ?

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

function getApplicationName() {
   APP_NAME = "他是谁？"
   return APP_NAME // 这里会抛出 TypeError 错误
}

tenter de modifier la valeur d'une variable définie à l'aide de const entraînera cette erreur :

"TypeError : Assignment to constant variable." peut empêcher La valeur de la variable a-t-elle été modifiée ? , voir l'opération suivante :

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

console.log(fruites ) //  ["葡萄", "哈密瓜", "香蕉"]

const constants = {
  APP_NAME: "前端小智@大迁世界"
}
constants.APP_NAME = "他是谁?"
console.log(constants.APP_NAME) // 他是谁?

Comme le montrent les deux exemples ci-dessus, même si vous utilisez const, vous pouvez également modifier la valeur d'un tableau ou d'un objet.

const n'utilise pas la valeur de la variable pour être immuable, mais l'adresse de référence de la variable pour la rendre variable. const

Maintenant, nous savons que dans le cas de tableaux et d'objets, nous ne pouvons pas changer la référence mais nous pouvons changer la valeur. Comment empêcher la modification des valeurs des tableaux et des objets ?

Utilisez Object.freeze()

C'est là que

entre en jeu

Ignorer les changements de valeur pour les objets et les tableaux.

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

Object.freeze()Comme vous pouvez le voir dans l'exemple, si vous modifiez la valeur, cela ne générera aucune erreur et n'affectera pas l'état de l'objet. ，Object.freeze

peut empêcher la modification de la valeur de l'objet, mais pas le changement de la référence :

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

Pour résumer : Object.freeze()

ne permet pas de changer l'objet ou la référence A à un tableau, mais sa valeur peut être modifiée.

1. const Ignorer les modifications de valeur d'un objet ou d'un tableau
2. Object.freeze()Les regrouper ensemble empêchera les modifications de la référence et de la valeur d'un objet ou d'un tableau

Utiliser const et Object.freeze()

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

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

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

L'exemple ci-dessus montre que l'utilisation de

et

ensemble est très utile pour définir des constantes et des configurations dans JS.

constObject.freeze()Adresse originale : https://codingnconcepts.com/javascript/const-vs-object-freeze/

Auteur : Ashish Lahoti

Adresse de traduction : https ://segmentfault.com/a/1190000038140180

Pour plus de connaissances liées à la programmation, veuillez visiter :

Site Web d'apprentissage en programmation

 ! !

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!