## ES6 को अपनाया
p5.js ने कोडबेस की जटिलता को कम करने, पठनीयता बढ़ाने और उन सुविधाओं का उपयोग करने के लिए हाल ही में ECMAScript 2015 (ES6) भाषा विनिर्देशों को अपनाया है, जो नए लोगों और सीज़न योगदानकर्ताओं के लिए सुरुचिपूर्ण और प्रभावी कोडिंग प्रथाओं की सुविधा प्रदान करते हैं।

संक्रमण प्रक्रिया की शुरुआत में p5 को ES6 में माइग्रेट करने के उद्देश्य से [चर्चा की गई थी](https://github.com/processing/p5.js/issues/3758), जो बाद में कोडबेस में ES6 विनिर्देशों के साथ बड़े पैमाने पर वाक्यविन्यास परिवर्तनों की एक श्रृंखला की ओर ले गया। प्रारंभिक संक्रमण के बारे में अधिक जानकारी [यहां](https://github.com/processing/p5.js/pull/3874) पाई जा सकती है। इन परिवर्तनों में ईएस 6 मानकों के आधार पर लाइब्रेरी को प्रोसेसिंग, लाइनिंग और परीक्षण की सुविधा प्रदान करने के लिए निर्माण प्रणाली में मामूली संशोधन शामिल थे, साथ ही साथ ईएस 6 सुविधाओं के अनुरूप प्रमुख और सर्वव्यापी वाक्यविन्यास संशोधन भी थे।

यह ध्यान देने योग्य है कि इसे लिखने के रूप में, ये परिवर्तन किसी भी तरह से पूर्ण नहीं हैं, और ES6 की हर संभव विशेषता को प्रतिबिंबित या कार्यान्वित नहीं करते हैं। इनका उद्देश्य है कि सामुदायिक हितों और मानकों के साथ गठबंधन करने पर ES6 सुविधाओं को ठीक से और कुशलता से उपयोग करने के लिए एक सरल संक्रमण की सुविधा प्रदान करना। और योगदानकर्ताओं को धीरे-धीरे नई शैली और विशेषताओं के अनुरूप बनाने के लिए प्रेरित करें।

हम सभी योगदानकर्ताओं को अपने कमिट्स और अनुरोधों में ES6 मानकों का पालन करने के लिए प्रोत्साहित करते हैं जब तक कि उपयोग की गई विशेषताएँ-
1. जावास्क्रिप्ट के साथ जुड़े वाक्यविन्यास अस्पष्टता और विलक्षणता को कम करें
2. पठनीयता और कोड स्पष्टता बढ़ाएँ
3. कोड अस्पष्टता और मतिहीनता से बचाये (पठनीयता के साथ सहायता के लिए)
4. नए लोगों के लिए उचित कोडिंग प्रथाओं को प्रोत्साहित करे
5. योगदान और विकास में आसानी
6. कार्यक्षमता का त्याग न करे

कई ES6 विशेषताएं हैं जो अभी तक p5 में उपयोग नहीं की गई हैं। हालाँकि लाइब्रेरी के कई क्षेत्र ऐसी विशेषताओं से लाभान्वित हो सकते हैं जिनमें शामिल हैं लेकिन यह सीमित नहीं हैं-
- जेनरेटर
- नंबर प्रकार की जाँच
- सेट/मैप डेटा संरचनाएं
- टाइप्ड एरे
- [आदि](http://es6-features.org/)

यह ध्यान देने योग्य है कि ES6 मानकों का पूर्ण अनुपालन p5 के सभी क्षेत्रों में समुदाय के प्रयासों की मांग करता है और इसकी प्रकृति के कारण एक क्रमिक प्रक्रिया है।

### प्रासंगिक संसाधन
- [आधिकारिक ES6 भाषा विशिष्टता](https://www.ecma-international.org/ecma-262/6.0/)
- [ES6 कार्यक्षमता तुलना](http://incaseofstairs.com/six-speed/)
- [ES6 विशेषताएं: अवलोकन और तुलना](http://es6-features.org/)
- [यू डॉन'ट नो जेएस : ES6 एंड बियॉन्ड  (पुस्तक)](https://github.com/getify/You-Dont-Know-JS/tree/main/es6%20%26%20beyond)
- [एक्सप्लोरिंग ES6 (पुस्तक)](https://exploringjs.com/es6/)

### कार्यक्षमता
यद्यपि हमारा लक्ष्य ES6 मानकों का अनुपालन और पालन करना है, यह ध्यान रखना महत्वपूर्ण है कि p5 प्रदर्शन कोड पर निर्भर करता है। इसे लिखते समय, ES6 की कई विशेषताएं कार्यक्षमता पतन, अड़चनों और ऊपरी चीज़ों से जुड़ी होती हैं। इस प्रकार, ES6 सुविधाओं का उपयोग करने से बचना महत्वपूर्ण है, जिसके परिणामस्वरूप खराब प्रदर्शन कोड होता है। हालांकि, यह एक अस्थायी चिंता का विषय है कि ब्राउज़र इंजन डेवलपर्स इन नई सुविधाओं के प्रदर्शन को बेहतर बनाने में सक्रिय रूप से लगे हुए हैं। हालांकि, कुछ समय के लिए, ES6 मानकों के पूर्ण अनुपालन पर प्रदर्शन को प्राथमिकता देना महत्वपूर्ण है, खासकर तब जब वाक्य-संबंधी परिवर्तन सामुदायिक लक्ष्यों के साथ गठबंधन किए गए बड़े सुधारों का परिणाम नहीं देते हैं। 

ES6 सुविधाओं के प्रदर्शन की तुलना के लिए कृपया [इस लिंक को देखें](http://incaseofstairs.com/six-speed/)।

प्रदर्शन प्राथमिकताकरण पर प्रकाश डालने वाली चर्चा के लिए, `forEach` के मामले पर [यहाँ](https://github.com/processing/p5.js/issues/3758#issuecomment-507922753) एक नज़र डालें।


### ब्राउज़र संगतता और संकलन

p5 का निर्माण [ब्राउज़र लिस्ट के](https://github.com/browserslist/browserslist) `अंतिम 2 संस्करणों` और` मृत नहीं` के विरुद्ध किया गया है, ताकि किसी बड़े यूज़रबेस तक पहुँच बनाए रखने के दौरान नवीनतम सुविधाओं का समर्थन किया जा सके। समर्थित ब्राउज़रों की जांच करने के लिए कृपया [इस लिंक](https://browserl.ist/?q=last+2+versions) पर जाएं। इसके अलावा, अब तक, p5 पहले के ES5 मानकों में [संकलित](https://en.wikipedia.org/wiki/Source-to-source_compiler) होने के लिए [बैबल](https://babeljs.io/) का उपयोग कर रहा है। इसका मतलब यह है कि यद्यपि हम जावास्क्रिप्ट के ES6 या संभवतः अधिक अत्याधुनिक सुविधाओं का उपयोग करते हैं, इन सभी सुविधाओं को अंततः पहले के ES5 मानकों में बदल दिया जाता है जब लाइब्रेरी उत्पादन के लिए बनाया जाता है (`p5-min.js`)। यह पुराने ब्राउज़रों और मोबाइल उपकरणों के साथ संगतता सुनिश्चित करने के लिए है जो इंटरनेट एक्सप्लोरर जैसे इन नई सुविधाओं का समर्थन करने में विफल रहते हैं। इसलिए जब ब्राउज़र संगतता के बारे में पता होना महत्वपूर्ण है, तो यह ध्यान देने योग्य है कि ES6 सुविधाओं को अंततः व्यापक रूप से समर्थित ES5 मानकों में परिवर्तित किया जाता है, और अधिकांश भाग के लिए संगतता को अनदेखा किया जा सकता है। 

इसे पढ़ते हुए आप आश्चर्यचकित हो सकते हैं: "* यदि ES6 को ES5 में बदल दिया जाए तो इन विशेषताओं का उपयोग करने का क्या मतलब है? *" इस बहुत ही उपयुक्त प्रश्न का उत्तर यह है कि ES5 निस्संदेह ES6 द्वारा आगामी वर्षों में प्रतिस्थापित किया जाएगा। और शायद समय आने पर लाइब्रेरी को ES5 में वापस स्थानांतरित करने की आवश्यकता नहीं होगी। ES6 मानकों का उपयोग मुख्य रूप से कोड को सरल बनाने, पठनीयता बढ़ाने और नए डेवलपर्स के लिए प्रवेश की बाधा को कम करने और यह सुनिश्चित करने के लिए करता है कि p5 नई सुविधाओं से लाभान्वित हो। सबसे महत्वपूर्ण बात यह है कि यह कोडबेस को भविष्य का प्रमाण बनाता है।

### संगतता बनाम प्रदर्शन

जबकि अधिकांश भाग के लिए ब्राउज़र संगतता को अनदेखा किया जा सकता है, वही प्रदर्शन के लिए सही नहीं है। ES6 का ES5 में रूपांतरण सुरक्षित रूप से पूरा किया जा सकता है, लेकिन ज्यादातर मामलों के लिए, उत्पन्न ES5 कोड से जुड़े कार्यक्षमता दंड हैं। कृपया फिर से देखें [यह लिंक](http://incaseofstairs.com/six-speed/) यह देखने के लिए कि कैसे बबेल द्वारा कोड किए गए कोड बनाम मूल ES5 कार्यान्वयन करता है।

### ES6 कोडिंग दिशानिर्देश
- ES6 `import` के पक्ष में `require` का परित्याग [[अधिक पढ़ें](https://exploringjs.com/es6/ch_modules.html#sec_importing-exporting-details)]
- ES6 `export` के पक्ष में `module.exports` का परित्याग [[अधिक पढ़ें](https://exploringjs.com/es6/ch_modules.html#sec_importing-exporting-details)]
  - **अपवाद:** `app.js` अभी भी सिस्टम सीमाओं के कारण `module.exports = p5;` का उपयोग कर रहा है।
- `const` का इस्तेमाल हमेशा करें और `let` का इस्तेमाल तभी करें, जब पुनः असाइनमेंट जरूरी हो [[विचार-विमर्श](https://github.com/processing/p5.js/issues/3877)]
- प्रोटोटाइप सदस्यों को एरो फ़ंक्शन के बजाय फ़ंक्शन घोषणा का उपयोग करना चाहिए [[विचार-विमर्श](https://github.com/processing/p5.js/issues/3875)]
  - **सही-** `p5.prototype.myMethod = function() { }`
  - **गलत-** `p5.prototype.myMethod = () => { }`
- प्रोटोटाइप सदस्य जिन्हें `.bind(this)` की आवश्यकता है उन्हें एरो फ़ंक्शन में परिवर्तित किया जाना चाहिए [[विचार-विमर्श](https://github.com/processing/p5.js/issues/3875)]
  - **सही-** `p5.prototype.myMethod = () => { }`
  - **गलत-** `p5.prototype.myMethod = function() {...}.bind(this);`
- स्थिरांक आयात किये जाते हैं जो वाक्यविन्यास पुराने प्रारूप को दोहराती हैं- `constants.TWO_PI`


### परिवर्तनों का सारांश
- [मॉड्यूल: निर्यात / आयात](http://es6-features.org/#ValueExportImport)
- [मॉड्यूल: डिफ़ॉल्ट और वाइल्डकार्ड](http://es6-features.org/#ValueExportImport)
- [स्थिरांक](http://es6-features.org/#Constants)
- [ब्लॉक-स्कोप चर](http://es6-features.org/#BlockScopedVariables)
- [रेस्ट पैरामीटर](http://es6-features.org/#RestParameter)
- [स्प्रेड ऑपरेटर ](http://es6-features.org/#SpreadOperator)
- [मेथड प्रॉपर्टीज](http://es6-features.org/#MethodProperties)
- [प्रॉपर्टी शॉर्टहैंड](http://es6-features.org/#PropertyShorthand)
- [एरो फंक्शन्स : स्टेटमेंट बॉडीज](http://es6-features.org/#StatementBodies)
- [एरो फंक्शन्स : एक्सप्रेशन बॉडीज](http://es6-features.org/#ExpressionBodies)
- [क्लास डेफिनिशन](http://es6-features.org/#ClassDefinition)
- [क्लास इनहेरिटेंस](http://es6-features.org/#ClassInheritance)
- [टेम्पलेट लिटेरल्स : स्ट्रिंग इन्टरपोलेशन](http://es6-features.org/#StringInterpolation)
- [टेम्पलेट लिटेरल्स : कस्टम इन्टरपोलेशन  ](http://es6-features.org/#CustomInterpolation)
- [डिफ़ॉल्ट पैरामीटर वैल्यूज](http://es6-features.org/#DefaultParameterValues)
- [स्ट्रिंग सर्चिंग: इन्क्लुड्स](http://es6-features.org/#StringSearching)
- [स्ट्रिंग सर्चिंग: इन्क्लुड्स (ES7)](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/includes)
- [इटरेटर्स: फॉर-ऑफ़](http://es6-features.org/#IteratorForOfOperator)

**ध्यान दें:** लाइब्रेरी में नई सुविधाओं को शामिल किए जाने पर कृपया ऊपर की सूची को अपडेट करें।

 ### Current Issues
- [`#3883`](https://github.com/processing/p5.js/issues/3883)- कस्टम बंडल्स बनाने के लिए `combineModules` का उपयोग करते समय `new p5()` का निर्माण करने में विफलता। वैश्विक मोड अप्रभावित है और अपेक्षा के अनुसार व्यवहार करता है।
