जावास्क्रिप्ट में const और const {} के बीच क्या अंतर है

Question

जब मैं इलेक्ट्रॉन का अध्ययन करता हूं, तो मुझे BrowserWindow ऑब्जेक्ट प्राप्त करने के 2 तरीके मिले।

const {BrowserWindow} = require('electron')

तथा

const electron = require('electron')
const BrowserWindow = electron.BrowserWindow

constऔर const {}जावास्क्रिप्ट में क्या अंतर है ?

मैं समझ नहीं पा रहा हूं कि const {}काम क्यों हो सकता है। क्या मुझे JS के बारे में कुछ भी याद है?

Answer 1

कोड के दो टुकड़े बराबर हैं लेकिन पहले वाला ES6 विनाशकारी असाइनमेंट का उपयोग कर रहा है का उपयोग कम करने के लिए कर रहा है।

यह कैसे काम करता है इसका एक त्वरित उदाहरण है:

const obj = {
  name: "Fred",
  age: 42,
  id: 1
}

//simple destructuring
const { name } = obj;
console.log("name", name);

//assigning multiple variables at one time
const { age, id } = obj;
console.log("age", age);
console.log("id", id);

//using different names for the properties
const { name: personName } = obj;
console.log("personName", personName);

Comments

आपका उत्तर सहायक है। मुझे मोज़िला डेवलपर वेबसाइट समझने में बहुत कठिन लगी। धन्यवाद।

— डेविडहोगो

Answer 2

const {BrowserWindow} = require('electron')

ऊपर सिंटैक्स ES6 का उपयोग करता है। यदि आपके पास एक वस्तु के रूप में परिभाषित है:

const obj = {
    email: "[e-mail]",
    title: "Hello world"
}

अब यदि हम obj के ईमेल और शीर्षक क्षेत्र को असाइन करना या उपयोग करना चाहते हैं तो हमें पूरे वाक्यविन्यास को लिखने की आवश्यकता नहीं है

const email = obj.email;
const title = obj.title;

यह अब पुराना स्कूल है।

हम ES6 डिस्ट्रक्ट्यूरिक असाइनमेंट का उपयोग कर सकते हैं , यदि हमारी वस्तु में 20 ऑब्जेक्ट्स में ऑब्जेक्ट हैं तो हमें बस उन फील्ड्स के नाम लिखने हैं, जिन्हें हम इस तरह से उपयोग करना चाहते हैं:

const { email,title } = obj;

यह ईएस 6 सिंटैक्स-सरल है यह स्वचालित रूप से ईमेल और शीर्षक प्रदान करेगा obj, बस नाम को आवश्यक फ़ील्ड के लिए सही ढंग से बताया जाना है।

Answer 3

यह ES6 में नई सुविधाओं में से एक है। घुंघराले ब्रेस नोटेशन तथाकथित का एक हिस्सा है destructuring assignment। इसका मतलब यह है कि, अब आपको ऑब्जेक्ट को स्वयं प्राप्त नहीं करना होगा और प्रत्येक संपत्ति के लिए वैरिएबल निर्दिष्ट करना होगा जिसे आप अलग-अलग लाइनों पर चाहते हैं। आप कुछ ऐसा कर सकते हैं:

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

// previously you would need to do something like this:
const firstProp = obj.prop1;
const secondProp = obj.prop2;
console.log(firstProp, secondProp);
// etc.

// however now you can do this on the same line:
const {prop1, prop2} = obj;
console.log(prop1, prop2);

जैसा कि आपने अंत में देखा है कि कार्यक्षमता समान है - बस किसी वस्तु से संपत्ति प्राप्त करना।

विनाशकारी असाइनमेंट के लिए और भी बहुत कुछ है - आप MDN में संपूर्ण सिंटैक्स की जाँच कर सकते हैं: https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Operators/Destructuring_ignignment