ऑब्जेक्ट.फ्रीज () बनाम कॉन्स्ट


136

Object.freeze()constES6 में उपयोग करने की ओर बढ़ने के लिए एक संक्रमणकालीन सुविधा विधि की तरह लगता है ।

क्या ऐसे मामले हैं जहां दोनों कोड में अपना स्थान लेते हैं या अपरिवर्तनीय डेटा के साथ काम करने का पसंदीदा तरीका है?

क्या मुझे Object.freeze()उस समय तक उपयोग करना चाहिए जब तक कि मैं समर्थन के साथ काम करने वाले सभी ब्राउज़रों constको constइसके बजाय उपयोग करने के लिए स्विच कर दूं?


2
मैंने अपनी बिल्ड प्रक्रिया में बैबलज का उपयोग करने के लिए लिया है ताकि मैं मुख्य रूप से इन जैसे संगतता मुद्दों को अनदेखा कर सकूं
खर्चा करने

22
नहीं - वे अलग-अलग चीजें करते हैं। कॉन्स्ट रिअसाइनमेंट को रोकता है (जैसे कि आप x = 1 कांस्ट नहीं कर सकते; x = 2); फ्रीज उत्परिवर्तन को रोकता है (जैसे आप ऑब्जेक्ट नहीं कर सकते हैं। एक्स (एक्स); एक्सए = 2);
जॉज़

यकीन नहीं होता कि यह समझ में आता है कि यह एक नया सवाल है या बस इसे यहाँ पर निपटाएँ लेकिन मैं भी उत्सुक होता अगर प्रतीक और ऑब्जेक्ट.फ्रीज़ के बीच कोई बड़ा अंतर होता? मैं वे भी संबंधित हैं (यानी प्रतीक से जमे हुए के रूप में मूल्यांकन किया जाता है लग रहा है Object.isFrozen, लेकिन वे भी अपने स्वयं के आदिम डेटा प्रकार ... कर रहे हैं)
Aug

1
उत्परिवर्तन को केवल पहले स्तर के लिए रोका गया है ताकि आप ऑब्जेक्ट.फ्रीज (एक्स) नहीं कर सकें; xa = 2, लेकिन आप ऑब्जेक्ट कर सकते हैं। x (x); xab = 2. jsfiddle.net/antimojv/op6ea91w/8 देखें । पूर्ण फ्रीज उपयोग के लिए तदर्थ पुस्तकालयों
एंटिमो

जवाबों:


232

constऔर Object.freezeदो पूरी तरह से अलग चीजें हैं।

constबाइंडिंग ("चर") पर लागू होता है । यह एक अपरिवर्तनीय बाइंडिंग बनाता है, अर्थात आप बाइंडिंग को कोई नया मान असाइन नहीं कर सकते।

Object.freezeमूल्यों पर काम करता है , और अधिक विशेष रूप से, वस्तु मूल्यों । यह एक वस्तु को अपरिवर्तनीय बनाता है, अर्थात आप इसके गुणों को नहीं बदल सकते।


3
मूल रूप से, constनया है var; यह सिर्फ ब्लॉक-स्कोप है और पुनर्मूल्यांकन को रोकता है। आप उपयोग कर सकते हैं let, लेकिन वास्तव में केवल तभी यदि आप एक वैरिएबल पॉइंट को बदलने जा रहे हैं, जो लूप कंट्रोल / इट्रिएटर वैरिएबल और सरल प्रकार जैसे संख्या और स्ट्रिंग्स के लिए समझ में आता है, लेकिन वस्तुओं के अधिकांश उपयोगों के लिए नहीं (सहित) सरणियों)। यदि आप एक ऐसी वस्तु / सरणी चाहते हैं, जिसकी सामग्री नहीं बदली जा सकती है, तो उसे घोषित करने के अलावा constआपको Object.freeze()उस पर कॉल भी करना चाहिए ।
मार्क रीड

2
constनया नहीं है var, letvar
फेसुंडो क्युसिएर जूल

84

ES5 में Object.freezeप्राइमेटीज़ पर काम नहीं होता है, जो संभवतः constवस्तुओं की तुलना में अधिक सामान्यतः घोषित किया जाएगा । आप ईएस 6 में आदिम फ्रीज कर सकते हैं, लेकिन फिर आपके लिए समर्थन भी है const

दूसरी ओर constवस्तुओं को घोषित करने के लिए इस्तेमाल किया जाता है, उन्हें "फ्रीज" नहीं किया जाता है, आप बस पूरी वस्तु को फिर से प्राप्त नहीं कर सकते हैं, लेकिन आप इसकी कुंजियों को स्वतंत्र रूप से संशोधित कर सकते हैं। दूसरी ओर आप जमी हुई वस्तुओं को पुनः प्राप्त कर सकते हैं।

Object.freeze उथला भी है, इसलिए आपको उनकी रक्षा के लिए नेस्टेड वस्तुओं पर पुनरावृत्ति करना होगा।

var ob1 = {
   foo : 1,
    bar : {
        value : 2   
    }
};
Object.freeze( ob1 );

const ob2 = {
   foo : 1,
    bar : {
        value : 2   
    }
}

ob1.foo = 4;  // (frozen) ob1.foo not modified
ob2.foo = 4;  // (const) ob2.foo modified

ob1.bar.value = 4;  // (frozen) modified, because ob1.bar is nested
ob2.bar.value = 4;  // (const) modified

ob1.bar = 4;  // (frozen) not modified, bar is a key of obj1
ob2.bar = 4;  // (const) modified

ob1 = {};  // (frozen) ob1 redeclared
ob2 = {}; // (const) ob2 not redeclared

इस स्पष्टीकरण ने एक स्वीप में मेरे कई सवालों को मंजूरी दे दी! के बारे में ob1.bar.value = 4; // (frozen) modified, because ob1.bar is nested: यह विधि के दायरे के कारण है?
YCode

14

सारांश:

constऔर Object.freeze()पूरी तरह से अलग उद्देश्यों की सेवा।

  • constवहाँ एक वैरिएबल घोषित करने के लिए है, जिसे तुरंत आश्वासन दिया गया है और इसे पुन: असाइन नहीं किया जा सकता है। द्वारा घोषित चरों constको ब्लॉक किया जाता है और इसके साथ घोषित चर की तरह कार्य नहीं किया जाता हैvar
  • Object.freeze()एक ऐसी विधि है जो किसी वस्तु को स्वीकार करती है और उसी वस्तु को वापस करती है। अब ऑब्जेक्ट में उसके किसी भी गुण को हटाया नहीं जा सकता है या कोई नया गुण नहीं जोड़ा जा सकता है।

उदाहरण const:

उदाहरण 1: पुन: असाइन नहीं किया जा सकता const

const foo = 5;

foo = 6;

निम्न कोड एक त्रुटि फेंकता है क्योंकि हम उस चर फ़ू को फिर से असाइन करने का प्रयास कर रहे हैं जिसे constकीवर्ड के साथ घोषित किया गया था , हम इसे पुन: असाइन नहीं कर सकते।

उदाहरण 2: डेटा संरचनाएँ जिन्हें म्यूट किया constजा सकता है

const object = {
  prop1: 1,
  prop2: 2 
}

object.prop1 = 5;   // object is still mutable!
object.prop3 = 3;   // object is still mutable!

console.log(object);  // object is mutated

इस उदाहरण में हम constकीवर्ड का उपयोग करते हुए एक वैरिएबल घोषित करते हैं और एक ऑब्जेक्ट को असाइन करते हैं। हालाँकि, हम ऑब्जेक्ट नामक इस वैरिएबल को फिर से असाइन नहीं कर सकते हैं, हम ऑब्जेक्ट को ही म्यूट कर सकते हैं। यदि हम मौजूदा गुणों को बदलते हैं या नए गुण जोड़ते हैं तो इसका प्रभाव पड़ेगा। किसी भी परिवर्तन को उस वस्तु को निष्क्रिय करने के लिए जिसकी हमें आवश्यकता है Object.freeze()

उदाहरण Object.freeze():

उदाहरण 1: जमी हुई वस्तु को नहीं बदल सकते

object1 = {
  prop1: 1,
  prop2: 2
}

object2 = Object.freeze(object1);

console.log(object1 === object2); // both objects are refer to the same instance

object2.prop3 = 3; // no new property can be added, won't work

delete object2.prop1; // no property can be deleted, won't work

console.log(object2); // object unchanged

इस उदाहरण में जब हम कॉल करते हैं Object.freeze()और object1एक तर्क के रूप में कार्य करते हैं तो वह वस्तु वापस आ जाती है जो अब 'फ्रोजन' है। यदि हम ===ऑपरेटर का उपयोग करके पुरानी वस्तु के नए ऑब्जेक्ट के संदर्भ की तुलना करते हैं तो हम देख सकते हैं कि वे उसी ऑब्जेक्ट को संदर्भित करते हैं। इसके अलावा जब हम किसी भी गुण को जोड़ने या हटाने का प्रयास करते हैं तो हम देख सकते हैं कि इसका कोई प्रभाव नहीं पड़ता है (सख्त मोड में त्रुटि फेंक देगा)।

उदाहरण 2: संदर्भ वाली वस्तुएँ पूरी तरह से जमी नहीं हैं

const object = {
  prop1: 1,
  nestedObj: {
    nestedProp1: 1,
    nestedProp2: 2,
  } 
}


const frozen = Object.freeze(object);

frozen.prop1 = 5; // won't have any effect
frozen.nestedObj.nestedProp1 = 5; //will update because the nestedObject isn't frozen

console.log(frozen);

यह उदाहरण दिखाता है कि नेस्टेड ऑब्जेक्ट्स (और संदर्भ डेटा संरचनाओं द्वारा अन्य) के गुण अभी भी परिवर्तनशील हैं । तो Object.freeze()यह पूरी तरह से ऑब्जेक्ट को 'फ्रीज' नहीं करता है जब इसमें ऐसे गुण होते हैं जो संदर्भ (जैसे एरे, ऑब्जेक्ट) होते हैं।


12
var obj = {
  a: 1,
  b: 2
};
Object.freeze(obj);
obj.newField = 3; // You can't assign new field , or change current fields

उपरोक्त उदाहरण यह पूरी तरह से आपकी वस्तु को अपरिवर्तनीय बनाता है।

निम्नलिखित उदाहरण देखें।

const obj = {
  a: 1,
  b: 2
};
obj.a = 13; // You can change a field
obj.newField = 3; // You can assign new field.

यह कोई त्रुटि नहीं देगा।

लेकिन अगर आप इस तरह की कोशिश करते हैं

const obj = {
      a: 1,
      b: 2
    };
obj = {
 t:4
};

यह एक त्रुटि की तरह फेंक देगा कि "obj केवल-पढ़ने के लिए है"।

एक और उपयोग मामला

const obj = {a:1};
var obj = 3;

यह फेंक देगा Duplicate declaration "obj"

इसके अलावा मोज़िला डॉक्स कॉन्स्टेबल स्पष्टीकरण के अनुसार

कांस्ट ऐलान मूल्य के लिए केवल-पढ़ने के लिए संदर्भ बनाता है। इसका अर्थ यह नहीं है कि इसका मूल्य अपरिवर्तनीय है , केवल यह कि परिवर्तनीय पहचानकर्ता को आश्वस्त नहीं किया जा सकता है।

यह उदाहरण babeljs ES6 सुविधाओं के अनुसार बनाया गया है।


4

सरल होने दो।

वे भिन्न हैं। कोड पर टिप्पणियों की जांच करें, जो प्रत्येक मामले की व्याख्या करेगा।

Const- यह ब्लॉक स्कोप वैरिएबल है let, जिसकी वैल्यू रीसाइनमेंट, री-घोषित नहीं हो सकती।

इसका मत

{
 const val = 10;  // you can not access it outside this block, block scope variable

}

console.log(val); // undefined because it is block scope 

const constvalue = 1;
constvalue = 2; // will give error as we are re-assigning the value;
const obj = { a:1 , b:2};

obj.a = 3;
obj.c = 4;
console.log(obj); // obj = {a:3,b:2,c:4} we are not assigning the value of identifier we can 
                  // change the object properties, const applied only on value, not with properties
obj = {x:1};     // error you are re-assigning the value of constant obj 
obj.a = 2 ;     // you can add, delete element of object

पूरी समझ यह है कि कास्ट ब्लॉक स्कोप है और इसका मान फिर से असाइन नहीं किया गया है।

Object.freeze: ऑब्जेक्ट रूट गुण अपरिवर्तनीय हैं, और भी हम अधिक गुणों को जोड़ और हटा नहीं सकते हैं, लेकिन हम फिर से पूरे ऑब्जेक्ट को पुन: असाइन कर सकते हैं।

var x = Object.freeze({data:1,
    name:{
    firstname:"hero", lastname:"nolast"
    }
});

x.data = 12;  // the object properties can not be change but in const you can do
x.firstname ="adasd"; // you can not add new properties to object but in const you can do

x.name.firstname = "dashdjkha"; // The nested value are changeable 

//The thing you can do in Object.freeze but not in const

x = { a: 1};  // you can reassign the object when it is Object.freeze but const its not allowed

// एक चीज जो दोनों में समान है, नेस्टेड वस्तु परिवर्तनशील है

const obj1 = {nested :{a:10}};
var obj2 =  Object.freeze({nested :{a:10}});

obj1.nested.a = 20; // both statement works
obj2.nested.a = 20;

धन्यवाद।

हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.