Différence entre congeler et sceller

Je viens d'entendre parler des méthodes JavaScript freezeet seal, qui peuvent être utilisées pour rendre tout objet immuable.

Voici un petit exemple comment l'utiliser:

var o1 = {}, o2 = {};
Object.freeze(o2);

o1["a"] = "worked";
o2["a"] = "worked";

alert(o1["a"]);   //prints "worked"
alert(o2["a"]);   //prints "undefined"

Quelle est la différence entre freezeet seal? Peuvent-ils augmenter les performances?

Object.seal

• Il empêche l'ajout et / ou la suppression de propriétés de l'objet scellé; l'utilisation deleteretournera false
• Cela rend toutes les propriétés existantes non configurables : elles ne peuvent pas être converties de `` descripteurs de données '' en `` descripteurs d'accesseurs '' (et vice versa), et aucun attribut de descripteurs d'accesseurs ne peut être modifié du tout (alors que les descripteurs de données peuvent changer leur writableattribut, et leur valueattribut si writeableest vrai).
• Peut lancer un TypeErrorlors d' une tentative de modification de la valeur de l'objet scellé lui-même (le plus souvent en mode strict )

Object.freeze

• Exactement ce que Object.sealfait, plus:
• Il empêche la modification des propriétés existantes

Aucun des deux n'affecte les objets «profonds» / petits-enfants. Par exemple, si objest gelé, obj.elne peut pas être réaffecté, mais la valeur de obj.elpourrait être modifiée, par exemple obj.el.idpeut être modifiée.

Performance:

Le scellement ou le gel d'un objet peut affecter sa vitesse d'énumération, selon le navigateur:

• Firefox: les performances d'énumération ne sont pas impactées
• IE: l'impact sur les performances d'énumération est négligeable
• Chrome: les performances d'énumération sont plus rapides avec des objets scellés ou gelés
• Safari: les objets scellés ou gelés dénombrent 92% plus lentement (à partir de 2014)

Tests: objets scellés , objets congelés .

J'ai écrit un projet de test qui compare ces 3 méthodes:

• Object.freeze()
• Object.seal()
• Object.preventExtensions()

Mes tests unitaires couvrent les cas CRUD:

• [C] ajouter une nouvelle propriété
• [R] read existait une propriété
• [U] modifier la propriété existante
• [D] supprimer une propriété existante

Résultat:

Vous pouvez toujours les rechercher dans MDN. En bref:

• Figer : rend l'objet immuable, ce qui signifie qu'aucune modification de la propriété définie n'est autorisée, sauf s'il s'agit d'objets.
• Sceau : empêche l'ajout de propriétés, mais les propriétés définies peuvent encore être modifiées.

Object.freeze()crée un objet figé, ce qui signifie qu'il prend un objet existant et l'appelle essentiellement Object.seal(), mais il marque également toutes les propriétés de l '«accesseur de données» comme writable:false, de sorte que leurs valeurs ne peuvent pas être modifiées. - Kyle Simpson, vous ne connaissez pas JS - Prototypes ceci et objet

Je regardais les différences entre Freeze et Seal dans ECMAScript 5 et j'ai créé un script pour clarifier les différences. Frozen crée un objet immuable comprenant des données et une structure. Seal empêche les modifications des interfaces nommées - pas d'ajouts, ni de suppressions - mais vous pouvez muter l'objet et redéfinir la signification de son interface.

function run()
{
    var myObject = function() 
    { 
        this.test = "testing"; 
    }

    //***************************SETUP****************************

    var frozenObj = new myObject();
    var sealedObj = new myObject();

    var allFrozen = Object.freeze(frozenObj);
    var allSealed = Object.seal(sealedObj);
    alert("frozenObj of myObject type now frozen - Property test= " + frozenObj.test);
    alert("sealedObj of myObject type now frozen - Property test= " + sealedObj.test);

    //***************************FROZEN****************************

    frozenObj.addedProperty = "added Property"; //ignores add
    alert("Frozen addedProperty= " + frozenObj.addedProperty);
    delete frozenObj.test; //ignores delete
    alert("Frozen so deleted property still exists= " + frozenObj.test);
    frozenObj.test = "Howdy"; //ignores update
    alert("Frozen ignores update to value= " + frozenObj.test);
    frozenObj.test = function() { return "function"; } //ignores
    alert("Frozen so ignores redefinition of value= " + frozenObj.test);

    alert("Is frozen " + Object.isFrozen(frozenObj));
    alert("Is sealed " + Object.isSealed(frozenObj));
    alert("Is extensible " + Object.isExtensible(frozenObj));

    alert("Cannot unfreeze");
    alert("result of freeze same as the original object: " + (frozenObj === allFrozen).toString());

    alert("Date.now = " + Date.now());

    //***************************SEALED****************************

    sealedObj.addedProperty = "added Property"; //ignores add
    alert("Sealed addedProperty= " + sealedObj.addedProperty);
    sealedObj.test = "Howdy"; //allows update
    alert("Sealed allows update to value unlike frozen= " + sealedObj.test);
    sealedObj.test = function() { return "function"; } //allows
    alert("Sealed allows redefinition of value unlike frozen= " + sealedObj.test);
    delete sealedObj.test; //ignores delete
    alert("Sealed so deleted property still exists= " + sealedObj.test);
    alert("Is frozen " + Object.isFrozen(sealedObj));
    alert("Is sealed " + Object.isSealed(sealedObj));
    alert("Is extensible " + Object.isExtensible(sealedObj));

    alert("Cannot unseal");
    alert("result of seal same as the original object: " + (sealedObj === allSealed).toString());

    alert("Date.now = " + Date.now());
}

Je sais que je suis peut-être un peu en retard mais

• Similitude: les deux sont utilisés pour créer des objets non extensibles .
• Différence: dans Freeze , les attributs configurables, énumérables et inscriptibles de l'objet sont définis sur false. où, comme dans l' attribut inscriptible scellé, est défini sur trueet le reste des attributs est faux.

Vous pouvez maintenant forcer une propriété d'objet unique à être gelée au lieu de geler l'objet entier. Vous pouvez y parvenir Object.definePropertyavec writable: falsecomme paramètre.

var obj = {
    "first": 1,
    "second": 2,
    "third": 3
};
Object.defineProperty(obj, "first", {
    writable: false,
    value: 99
});

Dans cet exemple, a obj.firstmaintenant sa valeur verrouillée à 99.

J'ai créé un tableau simple pour comparer les fonctions ci-dessous et expliquer la différence entre ces fonctions.

• Object.freeze ()
• Object.seal ()
• Object.preventExtensions ()