ES6 का परिचय

ईसीएमएस्क्रिप्ट 2015, जिसे ES6 (ईसीएमएस्क्रिप्ट 6) के नाम से भी जाना जाता है, जावास्क्रिप्ट का एक महत्वपूर्ण अपडेट है, जो नए सिंटैक्स और सुविधाओं को पेश करता है जो कोडिंग को अधिक कुशल और प्रबंधित करने में आसान बनाते हैं। जावास्क्रिप्ट वेब विकास के लिए उपयोग की जाने वाली सबसे लोकप्रिय प्रोग्रामिंग भाषाओं में से एक है, और ES6 में सुधार इसकी क्षमताओं को काफी बढ़ाता है।

यह मार्गदर्शिका ईएस6 में पेश की गई महत्वपूर्ण विशेषताओं को कवर करेगी, जिसमें एरो फ़ंक्शंस, लेखन कार्यों का एक शक्तिशाली नया तरीका पर विशेष ध्यान दिया जाएगा।

ES6 की मुख्य विशेषताएं

1. चलो और स्थिरांक

ES6 ने वेरिएबल घोषित करने के दो नए तरीके पेश किए: लेट और कॉन्स्ट।

• let: एक ब्लॉक-स्कोप्ड वेरिएबल घोषित करता है, जिसका अर्थ है कि वेरिएबल केवल उस ब्लॉक के भीतर उपलब्ध है जिसमें इसे घोषित किया गया था।
  

   let x = 10;
   if (true) {
     let x = 2;
     console.log(x); // 2 (inside block)
   }
   console.log(x); // 10 (outside block)
  

• const: एक स्थिर चर घोषित करता है जिसे पुन: असाइन नहीं किया जा सकता है। हालाँकि, यह वेरिएबल को अपरिवर्तनीय नहीं बनाता है - कॉन्स्ट के साथ घोषित ऑब्जेक्ट अभी भी अपने गुणों को बदल सकते हैं।
  

   const y = 10;
   y = 5; // Error: Assignment to constant variable.
  
   const person = { name: "John", age: 30 };
   person.age = 31; // This is allowed.
  

2. एरो फ़ंक्शन

ईएस6 की सबसे चर्चित विशेषताओं में से एक एरो फ़ंक्शन है। यह लेखन कार्यों के लिए एक छोटा और अधिक संक्षिप्त वाक्यविन्यास प्रदान करता है।

#### सिंटैक्स तुलना:

पारंपरिक कार्य (ES5):

   var add = function(x, y) {
     return x   y;
   };

एरो फ़ंक्शन (ES6):

   const add = (x, y) => x   y;

यहां बताया गया है कि एरो फ़ंक्शंस को क्या अलग बनाता है:

• छोटा वाक्यविन्यास: आपको फ़ंक्शन कीवर्ड लिखने की आवश्यकता नहीं है, और यदि फ़ंक्शन में एक ही कथन है तो आप घुंघराले ब्रेसिज़ {} को छोड़ सकते हैं।
• अंतर्निहित वापसी: यदि फ़ंक्शन में केवल एक अभिव्यक्ति है, तो उस अभिव्यक्ति का परिणाम स्वचालित रूप से वापस आ जाता है।
• यह बाध्यकारी नहीं है: एरो फ़ंक्शंस का अपना यह नहीं होता है, जो उन्हें ऑब्जेक्ट विधियों के लिए अनुपयुक्त बनाता है।

एकल-पंक्ति तीर फ़ंक्शन का उदाहरण:

   const multiply = (a, b) => a * b;
   console.log(multiply(4, 5)); // 20

एरो फ़ंक्शन का उपयोग पैरामीटर के बिना भी किया जा सकता है:

   const greet = () => "Hello, World!";
   console.log(greet()); // "Hello, World!"

एक से अधिक लाइन वाले कार्यों के लिए, घुंघराले ब्रेसिज़ {} की आवश्यकता होती है, और रिटर्न स्टेटमेंट स्पष्ट होना चाहिए:

   const sum = (a, b) => {
     let result = a   b;
     return result;
   };

एरो फ़ंक्शंस और यह
एक महत्वपूर्ण अंतर यह है कि यह एरो फ़ंक्शंस में कैसे व्यवहार करता है। पारंपरिक फ़ंक्शंस के विपरीत, एरो फ़ंक्शंस स्वयं को बाध्य नहीं करते हैं - वे इसे अपने आस-पास के संदर्भ से प्राप्त करते हैं।

   const person = {
     name: "John",
     sayName: function() {
       setTimeout(() => {
         console.log(this.name);
       }, 1000);
     }
   };
   person.sayName(); // "John"

उपरोक्त उदाहरण में, सेटटाइमआउट के अंदर एरो फ़ंक्शन इसे सेनेम विधि से प्राप्त करता है, जो व्यक्ति ऑब्जेक्ट को सही ढंग से संदर्भित करता है।

3. डिस्ट्रक्चरिंग असाइनमेंट

डिस्ट्रक्चरिंग हमें सरणियों या वस्तुओं से मान निकालने और उन्हें अधिक संक्षिप्त तरीके से चर में निर्दिष्ट करने की अनुमति देता है।

ऑब्जेक्ट डिस्ट्रक्चरिंग:

   const person = { name: "John", age: 30 };
   const { name, age } = person;
   console.log(name); // "John"
   console.log(age);  // 30

सरणी विध्वंस:

   const fruits = ["Apple", "Banana", "Orange"];
   const [first, second] = fruits;
   console.log(first);  // "Apple"
   console.log(second); // "Banana"

4. स्प्रेड एंड रेस्ट ऑपरेटर (...)

... ऑपरेटर का उपयोग सरणियों को अलग-अलग तत्वों में विस्तारित करने या एकाधिक तत्वों को एक सरणी में इकट्ठा करने के लिए किया जा सकता है।

• प्रसार: एक सरणी को अलग-अलग तत्वों में विस्तारित करता है।
  

   const numbers = [1, 2, 3];
   const newNumbers = [...numbers, 4, 5];
   console.log(newNumbers); // [1, 2, 3, 4, 5]
  

• Rest: एकाधिक तर्कों को एक सरणी में एकत्रित करता है।
  

   function sum(...args) {
     return args.reduce((acc, curr) => acc   curr);
   }
   console.log(sum(1, 2, 3, 4)); // 10
  

5. वादे

वादे का उपयोग जावास्क्रिप्ट में अतुल्यकालिक संचालन को संभालने के लिए किया जाता है। एक वादा एक मूल्य का प्रतिनिधित्व करता है जो अभी, भविष्य में या कभी उपलब्ध नहीं हो सकता है।

उदाहरण:

   const myPromise = new Promise((resolve, reject) => {
     setTimeout(() => {
       resolve("Success!");
     }, 1000);
   });

   myPromise.then(result => {
     console.log(result); // "Success!" after 1 second
   });

इस उदाहरण में, वादा 1 सेकंड के बाद हल हो जाता है, और तत्कालीन() विधि हल किए गए मान को संभालती है।

6. डिफ़ॉल्ट पैरामीटर्स

ES6 में, आप फ़ंक्शन पैरामीटर के लिए डिफ़ॉल्ट मान सेट कर सकते हैं। यह तब उपयोगी होता है जब कोई पैरामीटर प्रदान नहीं किया जाता है या अपरिभाषित होता है।

उदाहरण:

   function greet(name = "Guest") {
     return `Hello, ${name}!`;
   }
   console.log(greet());       // "Hello, Guest!"
   console.log(greet("John")); // "Hello, John!"

7. स्ट्रिंग मेथड्स (इसमें(), स्टार्ट्सविथ(), एंड्सविथ())

सामान्य कार्यों को आसान बनाने के लिए स्ट्रिंग्स में नए तरीके जोड़े गए:

• includes(): जाँचता है कि क्या किसी स्ट्रिंग में कोई निर्दिष्ट मान है।
  

   let str = "Hello world!";
   console.log(str.includes("world")); // true
  

• startsWith(): जांचता है कि कोई स्ट्रिंग किसी निर्दिष्ट मान से शुरू होती है या नहीं।
  

   console.log(str.startsWith("Hello")); // true
  

• endsWith(): जांचता है कि कोई स्ट्रिंग किसी निर्दिष्ट मान के साथ समाप्त होती है या नहीं।
  

   console.log(str.endsWith("!")); // true
  

8. सरणी विधियां (ढूंढें(), ढूंढेंइंडेक्स(), से())

ES6 ने सरणियों के साथ काम करने के लिए नए तरीके पेश किए:

• find(): पहला तत्व लौटाता है जो किसी शर्त को पूरा करता है।
  

   const numbers = [5, 12, 8, 130, 44];
   const found = numbers.find(num => num > 10);
   console.log(found); // 12
  

• findIndex(): किसी शर्त को पूरा करने वाले पहले तत्व का सूचकांक लौटाता है।
  

   const index = numbers.findIndex(num => num > 10);
   console.log(index); // 1 (position of 12 in the array)
  

9. कक्षाएं

ईएस6 ने जावास्क्रिप्ट में कक्षाएं पेश कीं, जो जावास्क्रिप्ट के मौजूदा प्रोटोटाइप-आधारित विरासत पर वाक्यात्मक चीनी हैं। कक्षाएं स्वच्छ और अधिक समझने योग्य ऑब्जेक्ट-ओरिएंटेड प्रोग्रामिंग की अनुमति देती हैं।

उदाहरण:

   class Car {
     constructor(brand, year) {
       this.brand = brand;
       this.year = year;
     }

     displayInfo() {
       return `${this.brand} from ${this.year}`;
     }
   }

   const myCar = new Car("Toyota", 2020);
   console.log(myCar.displayInfo()); // "Toyota from 2020"

निष्कर्ष

ES6 ने जावास्क्रिप्ट को बदल दिया है, जिससे यह अधिक कुशल और उपयोग में आसान हो गया है। एरो फ़ंक्शंस की शुरूआत फ़ंक्शन सिंटैक्स को सरल बनाती है, जबकि डिस्ट्रक्चरिंग, वादे, क्लासेस, और स्प्रेड ऑपरेटर जैसी नई सुविधाएँ डेवलपर्स को स्वच्छ, अधिक अभिव्यंजक कोड लिखने की अनुमति देता है। चाहे आप शुरुआती हों या उन्नत डेवलपर, आधुनिक जावास्क्रिप्ट लिखने के लिए इन ES6 सुविधाओं को समझना आवश्यक है।

इन अवधारणाओं में महारत हासिल करके, आप वास्तविक दुनिया की कोडिंग चुनौतियों को संभालने और कुशल, स्केलेबल वेब एप्लिकेशन बनाने के लिए बेहतर ढंग से सुसज्जित होंगे।

GitHub पर एरो फ़ंक्शंस प्रोजेक्ट का अनुसरण करें

संदर्भ

• https://www.w3schools.com/js/js_es6.asp
• https://towardsdatascience.com/javascript-es6-iterables-and-iterators-de18b54f4d4
• https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/rest_parameters
• https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Default_parameters
• https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions
• https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements