🐧 🧜🏻 👈🏼 वैकल्पिक जावास्क्रिप्ट तर्क के खतरे ☕️ 📓 👨‍🌾

"शून्य से शून्य" के बारे में मेरा आखिरी विषय बहुत रुचि पैदा कर रहा है। इसलिए मैं आज जावास्क्रिप्ट की एक और विशेषता का वर्णन करने जा रहा हूं, जो कि ट्वीट से प्रेरित था:

ब्राउज़र में इसे दोहराने की कोशिश किए बिना, निम्नलिखित कोड क्या लौटाएगा?
["1", "2", "3"].map(parseInt); 

यह एक पेचीदा सवाल था। शायद कुछ प्रोग्रामर इस एक्सप्रेशन [1, 2, 3] को वापस करने की उम्मीद करते हैं, लेकिन यह वहाँ नहीं था। क्यों? हमें वास्तव में क्या मिलता है? मैंने कोड शुरू नहीं किया और तुरंत ECMAScript 5 विनिर्देशन में शामिल हो गया। विनिर्देश के अनुसार, उत्तर स्पष्ट है:

 [1, NaN, NaN]

उसके बाद, मैंने अभी भी ब्राउज़र में उदाहरण दिया और परिणाम समान था। इससे पहले कि मैं समझाऊं कि क्यों, आप इस पर ध्यान केंद्रित करना चाहते हैं और देख सकते हैं कि क्या आप समझ सकते हैं कि क्या हो रहा है।

ठीक है, यहाँ स्पष्टीकरण है। parseInt एक बिल्ट-इन फ़ंक्शन है जो संख्याओं की एक स्ट्रिंग को पार्स करने और इसे एक संख्या के रूप में वापस करने के लिए डिज़ाइन किया गया है। वह है, एक फ़ंक्शन:

 var n = parseInt ("123");

स्थानीय वैरिएबल n को 123 का सांख्यिक मान निर्दिष्ट करना चाहिए।

आपको यह भी पता होना चाहिए कि यदि एक स्ट्रिंग को एक संख्या के रूप में पार्स नहीं किया जा सकता है, तो parseInt परिणामस्वरूप NaN वापस आ जाएगा। NaN (संक्षिप्त नाम "संख्या नहीं"), एक मान है जो एक स्ट्रिंग को एक संख्या में परिवर्तित करने में त्रुटि की पहचान करता है। इसलिए, निम्नलिखित पंक्ति:

 var x = parseInt("xyz");

वैरिएबल x को मान NaN प्रदान करता है।

मानचित्र - ECMAScript 5 में अंतर्निहित सरणी विधि, कई ब्राउज़रों में उपलब्ध थी। यह सरणी के प्रत्येक तत्व से गुजरता है और तर्क के रूप में तत्व के मूल्य को पारित करते हुए, प्रत्येक तत्व के लिए एक बार तर्क फ़ंक्शन को कॉल करता है। फ़ंक्शन के परिणामों से, यह एक नई सरणी बनाता है। उदाहरण के लिए, इस लाइन के लिए

 [1,2,3].map(function (value) {return value+1});

यह एक नया ऐरे [2,3,4] लौटाएगा। यह संभवतः काफी प्रथागत है कि parseInt जैसे एक फ़ंक्शन को मैप विधि में पास किया जाता है और यह काफी सही है।

पार्सइंट और मानचित्र की मूल बातों के आधार पर, यह स्पष्ट हो जाता है कि मूल अभिव्यक्ति का उद्देश्य संख्यात्मक रेखाओं के सरणी से प्रत्येक पंक्ति के संख्यात्मक मूल्यों वाले संबंधित सरणियों को वापस करना था। यह काम क्यों नहीं कर रहा है? इस प्रश्न का उत्तर खोजने के लिए, पार्सइंट की परिभाषाओं और अधिक विस्तार से विचार करना आवश्यक है।

विनिर्देश के अनुसार, parseInt दो तर्क स्वीकार करता है। पहला तर्क स्ट्रिंग को पार्स किया जाना है, और दूसरा नंबर सिस्टम है जिसके द्वारा इसे पार्स किया जाना चाहिए। और इसलिए, parseInt("ffff",16) 65535 वापस आएगा, जबकि parseInt("ffff",8) NaN लौटेगा, क्योंकि "ffff" को अष्टक संख्या के रूप में पार्स नहीं किया गया है। यदि दूसरा तर्क अनुपस्थित है या 0 के बराबर है, तो डिफ़ॉल्ट संख्या प्रणाली दशमलव है, इसलिए parseInt("12",10) , parseInt("12") और parseInt("12", 0) 12 वापस आ जाएगी।

अब मानचित्र विधि के विनिर्देश को ध्यान से देखें और इसके पहले तर्क में कौन से मूल्य हैं - कॉलबैकफ़न। विनिर्देश कहता है "कॉलबैक फ़ंक्शन को तीन तर्कों के साथ कहा जाता है: तत्व का मूल्य, तत्व का सूचकांक, और जिस वस्तु के साथ हमने काम किया है।" इसका मतलब यह है कि पार्सइंट कॉल के बजाय जो इस तरह दिखता है:

 parseInt("1") parseInt("2") parseInt("3")

हमें तीन कॉल मिलेगी जो इस तरह दिखाई देगी:

 parseInt("1", 0, theArray) parseInt("2", 1, theArray) parseInt("3", 2, theArray)

जहाँ ऐरे मूल सरणी है ["1","2","3"] ।

जावास्क्रिप्ट फ़ंक्शन, एक नियम के रूप में, अनावश्यक तर्कों को अनदेखा करते हैं और parseInt केवल पहले दो तर्कों का उपयोग करता है, इसलिए हमें इन कॉल्स में एयर तर्क के बारे में चिंता करने की ज़रूरत नहीं है। लेकिन दूसरे तर्क का क्या? पहली कॉल में, दूसरा तर्क 0 है, जिसका अर्थ है, जैसा कि हम जानते हैं, दशमलव संख्या प्रणाली का उपयोग, इसलिए parseInt("1", 0) वापस आ जाएगी। 1 दूसरी कॉल में 1 तर्क के रूप में संख्या प्रणाली को दर्शाती है। विनिर्देश स्पष्ट रूप से बताता है कि इस मामले में क्या होगा। यदि संख्या प्रणाली गैर-शून्य है और 2 से कम है, तो फ़ंक्शन स्ट्रिंग का विश्लेषण किए बिना भी NaN लौटाता है।

तीसरा कॉल नंबर सिस्टम के तर्क के रूप में 2 लेता है। इसका मतलब यह है कि रूपांतरण के लिए इच्छित स्ट्रिंग केवल "0" और "1" युक्त एक बाइनरी नंबर होना चाहिए। ParseInt विनिर्देशन के अनुच्छेद 11 में कहा गया है कि एक फ़ंक्शन पहले अवैध चरित्र के लिए बाएं से दाएं स्ट्रिंग को पार्स करता है। स्ट्रिंग का पहला वर्ण - "3" भी बाइनरी नंबर सिस्टम में एक वैध अंक नहीं है, इसलिए प्रतिस्थापन में पार्स करने के लिए संख्याएं नहीं हैं। इस स्थिति में, पैराग्राफ 12 के अनुसार, फ़ंक्शन NaN देता है। और इसलिए, तीन कॉल का परिणाम 1, NaN और NaN है।

मूल अभिव्यक्ति प्रोग्रामर कम से कम दो संभावित त्रुटियों को बनाता है जो इस बग का कारण बनता है। सबसे पहले, यह या तो भूल जाता है या बस यह नहीं जानता है कि parseInt एक वैकल्पिक पैरामीटर के रूप में दूसरे तर्क को स्वीकार करता है। दूसरे, यह या तो भूल जाता है या बस यह नहीं जानता कि नक्शा तीन तर्कों के साथ कॉलबैकफ़न कहता है। अधिक बार नहीं, यह दो त्रुटियों का एक संयोजन है। सबसे अधिक उपयोग किए जाने वाले मामले में, parseInt केवल एक तर्क से गुजरता है और मानचित्र विधि में दिए गए अधिकांश फ़ंक्शन केवल पहले तर्क का उपयोग करते हैं, इसलिए आप आसानी से भूल सकते हैं कि दोनों मामलों में अतिरिक्त तर्क संभव हैं।

समस्याओं से बचने के लिए मूल अभिव्यक्ति को कैसे फिर से लिखना है, इसका एक उदाहरण यहां दिया गया है। का उपयोग करें:

 ["1","2","3"].map(function(value) {return parseInt(value)})

इसके बजाय:

 ["1","2","3"].map(parseInt)

अर्थात्, कॉलबैकफ़न केवल एक तर्क के लिए कॉल करता है। अधिक क्रिया और कम सुरुचिपूर्ण।

इस बारे में ट्वीट करने के बाद, इस समस्या से बचने के लिए या कम से कम परिवर्तनों को बोझिल बनाने के लिए जावास्क्रिप्ट को कैसे आगे बढ़ाया जाए, इस बारे में एक चर्चा शुरू हुई।
एंगस क्रॉल (@angusTweets) ने नंबर कंस्ट्रक्टर का उपयोग पार्सेइंट के बजाय कॉलबैकफान के रूप में करने का सुझाव दिया। इस तरह से संख्या को स्ट्रिंग तर्क को दशमलव संख्या के रूप में देखा जाएगा। संख्या, इस तरह से भी दशमलव संख्या प्रणाली के आधार पर पहला तर्क पेश करता है, लेकिन दूसरे तर्क पर ध्यान नहीं देता है।

@__DavidFlanagan ने मैपबैक विधि जोड़ने का सुझाव दिया जो कॉलबैकफान के लिए केवल एक तर्क देता है। हालाँकि, ECMAScript 5 में सात अलग-अलग तरीके हैं जो नक्शे की तरह काम करते हैं, इसलिए हमें उन्हें जोड़ना होगा।

मैंने एक तरीका जोड़ने की संभावना का सुझाव दिया जो कुछ इस तरह दिख सकता है:

 Function.prototype.only=function(numberOfArgs) { var self=this; //the original function return function() { return self.apply(this,[].slice.call(arguments,0,numberOfArgs)) } }

यह एक उच्च-क्रम फ़ंक्शन है जो एक फ़ंक्शन को तर्क के रूप में लेता है और एक नया फ़ंक्शन देता है जो मूल फ़ंक्शन को कॉल करता है, लेकिन सीमित तर्कों के साथ। मूल अभिव्यक्ति इस तरह लिखी जा सकती है:

 ["1","2","3"].map(parseInt.only(1))

जो थोड़ा अधिक विस्तृत है, लेकिन एक ही समय में अपनी सुंदरता को बनाए रखता है

इससे जावास्क्रिप्ट में करी (फ़ंक्शन के आंशिक अनुप्रयोग) के बारे में और चर्चा हुई। एक फ़ंक्शन का आंशिक अनुप्रयोग एक फ़ंक्शन लेता है जिसमें कुछ निश्चित संख्या में तर्कों की आवश्यकता होती है और एक नए फ़ंक्शन का उत्पादन होता है जिसमें कम तर्कों की आवश्यकता होती है। यह विधि एक फ़ंक्शन का एक उदाहरण है जो किसी फ़ंक्शन का आंशिक अनुप्रयोग करता है। आखिरकार, ES5 में एक फंक्शन.प्रोटाइप.बिंड विधि जोड़ा गया। क्या जावास्क्रिप्ट को अतिरिक्त तरीकों की आवश्यकता है? उदाहरण के लिए, bindRight विधि, जो तत्वों को दाईं ओर सेट करती है। यह संभव है, लेकिन जब चर संख्या के तर्कों की अनुमति दी जाती है तो कौन से तत्व ऐसे माने जाएंगे? संभवतः एक bindStartingAt जो तर्क की स्थिति का उपयोग करता है, जावास्क्रिप्ट के लिए सबसे अच्छा विकल्प होगा।

हालांकि, विस्तार के बारे में चर्चा समस्या के मूल से दूर है। उनमें से किसी का उपयोग करने के लिए, आपको पहले वैकल्पिक तर्क मानचित्र और पार्सइंट के बेमेल के बारे में जानना होगा। इस समस्या के कई समाधान हैं, लेकिन यदि आप इसके बारे में नहीं जानते हैं, तो प्रस्तावित समाधानों में से कोई भी मदद नहीं करेगा। एपीआई के गलत डिज़ाइन के कारण यह समस्या अधिक होने की संभावना है, और इसलिए, JavaSript में वैकल्पिक तर्कों का उपयोग करने की अनुरूपता के बारे में सवाल उठता है।

वैकल्पिक तर्कों के लिए समर्थन एपीआई कार्यों की कुल संख्या को कम करके और कई उपयोगकर्ताओं को केवल सबसे सामान्य मामलों के बारे में सोचने की अनुमति देकर एपीआई डिजाइन को आसान बना सकता है। जैसा कि हम ऊपर देख सकते हैं, यह सरलीकरण समस्याओं का कारण बन सकता है जब कार्यों को अप्रत्याशित तरीकों से जोड़ा जाता है। इस उदाहरण में, हम देखते हैं कि वैकल्पिक तर्कों के दो अलग-अलग उपयोग हैं।

पहले मामले में, वैकल्पिक तर्कों को कॉलिंग फ़ंक्शन (मानचित्र विधि, जिसे कॉलबैकफ़न कहते हैं) द्वारा माना जाता है। दूसरे मामले में - बुलाया फ़ंक्शन (कॉलबैकफ़न, जिसे मानचित्र विधि द्वारा बुलाया जाता है) की तरफ से। ParseInt डिज़ाइन मानता है कि कॉल करने वाला जानता है कि वह parseInt कॉल कर रहा है और उसने वर्तमान तर्क को ठीक से चुना है। दूसरा तर्क कॉलर के लिए वैकल्पिक है। यदि प्रोग्रामर डिफ़ॉल्ट संख्या प्रणाली का उपयोग करना चाहता है, तो वह इस तर्क को अनदेखा कर सकता है। हालांकि, वर्तमान parseInt विनिर्देश तर्कों की संख्या और मूल्य के आधार पर एक फ़ंक्शन के व्यवहार को परिभाषित करता है।

एक अन्य उपयोग मामला कॉलिंग फ़ंक्शन के दृष्टिकोण से स्थिति को रोशन करता है। वह नहीं जानती है कि वह किस विशिष्ट कार्य को कहती है और इसलिए हमेशा समान संख्या में तर्क पारित करती है।
मैप स्पेसिफिकेशन स्पष्ट रूप से परिभाषित करता है कि यह विधि किसी भी कॉलबैक फ़ंक्शन के लिए हमेशा तीन तर्क पारित करेगी। चूंकि कॉलिंग फ़ंक्शन को कॉल किए गए फ़ंक्शन की परिभाषा नहीं पता है और यह नहीं जानता है कि इसे किस जानकारी की आवश्यकता है, मैप सभी मौजूदा जानकारी को तर्क मानता है। शायद यह कहा जाता है कि तर्कों को उन फ़ंक्शन को अनदेखा किया जाएगा जिनकी आवश्यकता नहीं है। इस मामले में, दूसरा और तीसरा तर्क फ़ंक्शन के दृष्टिकोण से बुलाया जा रहा है।
दोनों मामले वैकल्पिक तर्कों के सही उपयोग के उदाहरण हैं, लेकिन जब वे संयुक्त होते हैं, तो विफलता होती है। कॉल और कॉलिंग फ़ंक्शन के वैकल्पिक तर्क शायद ही कभी मेल खाते हैं। आप उच्च-क्रम के कार्यों जैसे कि bind या only विधियों को विसंगतियों को सही करने के लिए उपयोग कर सकते हैं, लेकिन वे केवल तभी उपयोगी होंगे जब प्रोग्रामर को इस अंतर के बारे में पता हो। जावास्क्रिप्ट एपीआई डिजाइनरों को इसे ध्यान में रखना चाहिए और प्रत्येक जावास्क्रिप्ट प्रोग्रामर को यह सुनिश्चित करना चाहिए कि वह कॉलबैकफैन के रूप में गुजरता है
अद्यतन 1: map(Number) साथ एक महान समाधान के लिए एंगस क्रोल का धन्यवाद।

वैकल्पिक जावास्क्रिप्ट तर्क के खतरे

More articles: