2016 मा JavaScript सिक्न कस्तो लाग्छ

यो लेख लेख्ने क्रममा कुनै जाभास्क्रिप्ट फ्रेमवर्कहरू सिर्जना गरिएको थिएन।

निम्न सर्कल CI को लेख "यो भविष्य हो" बाट प्रेरित छ। तपाईं यहाँ मूल पढ्न सक्नुहुन्छ । यो टुक्रा मात्र एक राय हो, र कुनै पनि JavaScript फ्रेमवर्क जस्तै, यो धेरै गम्भीरतापूर्वक लिनु हुँदैन।

हे, मैले यो नयाँ वेब परियोजना पाएँ, तर इमानदार हुन मैले केही वर्षहरूमा धेरै वेब कोडिङ गरेको छैन र मैले ल्यान्डस्केप अलिकति परिवर्तन भएको सुनेको छु। तपाईं यहाँ वरिपरि सबैभन्दा अप-टु-डेट वेब dev हुनुहुन्छ?

- वास्तविक शब्द फ्रन्ट एन्ड इन्जिनियर हो, तर हो, म सही मान्छे हुँ। म 2016 मा वेब गर्छु। भिजुअलाइजेसन, म्युजिक प्लेयर, फुटबल खेल्ने फ्लाइङ ड्रोन, तपाईं यसलाई नाम दिनुहोस्। म JsConf र ReactConf बाट भर्खरै आएको हुँ, त्यसैले मलाई वेब एपहरू सिर्जना गर्ने नवीनतम प्रविधिहरू थाहा छ।

कूल। मैले प्रयोगकर्ताहरूबाट नवीनतम गतिविधिहरू प्रदर्शन गर्ने पृष्ठ सिर्जना गर्न आवश्यक छ, त्यसैले मैले केवल REST अन्त्य बिन्दुबाट डाटा प्राप्त गर्न आवश्यक छ र यसलाई केहि प्रकारको फिल्टरयोग्य तालिकामा प्रदर्शन गर्न आवश्यक छ, र सर्भरमा केहि परिवर्तन भएमा यसलाई अद्यावधिक गर्नुहोस्। म सोच्दै थिएँ सायद jQuery प्रयोग गरेर डाटा ल्याउन र प्रदर्शन गर्न?

-हे भगवान होइन, अब कसैले jQuery प्रयोग गर्दैन। तपाईंले प्रतिक्रिया सिक्ने प्रयास गर्नुपर्छ, यो 2016 हो।

ओह, ठीक छ। प्रतिक्रिया के छ?

-यो Facebook मा केहि केटाहरु द्वारा बनाईएको एक सुपर कूल पुस्तकालय हो, यसले वास्तवमै तपाईको अनुप्रयोगमा नियन्त्रण र कार्यसम्पादन ल्याउँछ, तपाईलाई कुनै पनि दृश्य परिवर्तनहरू सजिलैसँग ह्यान्डल गर्न अनुमति दिएर।

त्यो सफा सुनिन्छ। के म सर्भरबाट डाटा प्रदर्शन गर्न प्रतिक्रिया प्रयोग गर्न सक्छु?

-हो, तर पहिले तपाईंले आफ्नो वेबपेजमा पुस्तकालयको रूपमा प्रतिक्रिया र प्रतिक्रिया DOM थप्न आवश्यक छ।

पर्खनुहोस्, किन दुई पुस्तकालयहरू?

- त्यसोभए एउटा वास्तविक पुस्तकालय हो र दोस्रो DOM हेरफेरको लागि हो, जुन अब तपाइँ JSX मा वर्णन गर्न सक्नुहुन्छ।

JSX? JSX भनेको के हो?

-JSX जाभास्क्रिप्ट सिन्ट्याक्स एक्स्टेन्सन मात्र हो जुन XML जस्तै देखिन्छ। यो DOM को वर्णन गर्ने अर्को तरिका हो, यसलाई राम्रो HTML को रूपमा सोच्नुहोस्।

HTML मा के गलत छ?

-यो 2016 हो। अब कसैले HTML लाई सीधै कोड गर्दैन।

सहि। जे भए पनि, यदि मैले यी दुई पुस्तकालयहरू थपे भने म प्रतिक्रिया प्रयोग गर्न सक्छु?

- एकदम छैन। तपाईंले Babel थप्न आवश्यक छ, र त्यसपछि तपाईं प्रतिक्रिया प्रयोग गर्न सक्षम हुनुहुन्छ।

अर्को पुस्तकालय? बाबेल के हो?

-ओह, बाबेल एउटा ट्रान्सपाइलर हो जसले तपाईंलाई जाभास्क्रिप्टको कुनै पनि संस्करणमा कोड गर्दा जाभास्क्रिप्टको विशिष्ट संस्करणहरूलाई लक्षित गर्न अनुमति दिन्छ। तपाईंले Babel लाई ReactJS प्रयोग गर्न समावेश गर्नुपर्दैन, तर तपाईंले नगरेसम्म, तपाईं ES5 प्रयोग गर्नमा अड्कनुभएको छ, र वास्तविक बनौं, यो 2016 हो, तपाईंले ES2016+ मा कोडिङ गरिरहनु पर्छ जस्तै कि बाँकी कूल बच्चाहरूले गर्छन्।

ES5? ES2016+? म यहाँ हराउँदै छु। ES5 र ES2016+ के हो?

-ES5 भनेको ECMAScript 5 हो। यो संस्करण हो जसलाई धेरैजसो मानिसहरूले लक्षित गरेका छन् किनभने यो आजकल धेरैजसो ब्राउजरहरूद्वारा लागू गरिएको छ।

ECMAScript?

-हो, तपाइँलाई थाहा छ, स्क्रिप्टिङ मानक JavaScript 1995 मा यसको प्रारम्भिक रिलीज पछि 1999 मा आधारित थियो, जब JavaScript लाई Livescript नाम दिइएको थियो र नेटस्केप नेभिगेटरमा मात्र चलेको थियो। त्यो त्यतिबेला धेरै गडबड थियो, तर धन्यबाद अब चीजहरू धेरै स्पष्ट छन् र हामीसँग यो कार्यान्वयनको 7 संस्करणहरू छन्।

७ संस्करण। वास्तविक लागि। र ES5 र ES2016+ हो?

- क्रमशः पाँचौं र सातौं संस्करण।

पर्खनुहोस्, छैटौं संग के भयो?

- तपाईको मतलब ES6 हो? हो, मेरो मतलब, प्रत्येक संस्करण अघिल्लो संस्करणको सुपरसेट हो, त्यसैले यदि तपाइँ ES2016+ प्रयोग गर्दै हुनुहुन्छ भने, तपाइँ अघिल्लो संस्करणका सबै सुविधाहरू प्रयोग गर्दै हुनुहुन्छ।

सहि। अनि किन ES6 मा ES2016+ प्रयोग गर्ने?

-ठीक छ, तपाईंले ES6 प्रयोग गर्न सक्नुहुन्छ, तर async र पर्खाइ जस्ता उत्कृष्ट सुविधाहरू प्रयोग गर्न, तपाईंले ES2016+ प्रयोग गर्न आवश्यक छ। अन्यथा तपाईं उचित नियन्त्रण प्रवाहको लागि एसिन्क्रोनस कलहरू रोक्नको लागि ES6 जेनेरेटरहरू coroutineहरूसँग अड्कनुभएको छ।

तपाईंले भर्खर के भन्नुभयो मलाई थाहा छैन, र यी सबै नामहरू भ्रमित छन्। हेर्नुहोस्, म भर्खरै सर्भरबाट डाटाको एक गुच्छा लोड गर्दैछु, म CDN बाट jQuery समावेश गर्न र AJAX कलहरूको साथ डाटा प्राप्त गर्न सक्षम थिएँ, म किन त्यसो गर्न सक्दिन?

-यो 2016 मान्छे हो, अब कसैले jQuery प्रयोग गर्दैन, यो स्पेगेटी कोडको गुच्छामा समाप्त हुन्छ। त्यो सबैलाई थाहा छ।

सहि। त्यसैले मेरो विकल्प डेटा ल्याउन र HTML तालिका प्रदर्शन गर्न तीन पुस्तकालयहरू लोड गर्न हो।

-ठीक छ, तपाईंले ती तीनवटा पुस्तकालयहरू समावेश गर्नुहुन्छ तर एउटा फाइल मात्र लोड गर्नका लागि मोड्युल प्रबन्धकसँग बन्डल गर्नुहोस्।

म देख्छु। र मोड्युल प्रबन्धक के हो?

- परिभाषा वातावरणमा निर्भर गर्दछ, तर वेबमा हामीले सामान्यतया AMD वा CommonJS मोड्युलहरूलाई समर्थन गर्ने कुनै पनि कुरालाई बुझाउँछौं।

Riiight। र AMD र CommonJS हो ...?

- परिभाषाहरू। त्यहाँ धेरै JavaScript पुस्तकालयहरू र कक्षाहरू कसरी अन्तरक्रिया गर्नुपर्छ भनेर वर्णन गर्ने तरिकाहरू छन्। तपाईलाई थाहा छ, निर्यात र आवश्यकता? तपाइँ AMD वा CommonJS API लाई परिभाषित गर्ने धेरै JavaScript फाइलहरू लेख्न सक्नुहुन्छ र तपाइँ तिनीहरूलाई बन्डल गर्न ब्राउजरिफिक जस्तै केहि प्रयोग गर्न सक्नुहुन्छ।

ठीक छ, त्यो अर्थ बनाउँछ ... मलाई लाग्छ। Browserify के हो?

- यो एउटा उपकरण हो जसले तपाइँलाई ब्राउजरमा चलाउन सकिने फाइलहरूमा CommonJS वर्णित निर्भरताहरू बन्डल गर्न अनुमति दिन्छ। यो सिर्जना गरिएको थियो किनभने धेरै व्यक्तिहरूले ती निर्भरताहरू npm रजिस्ट्रीमा प्रकाशित गर्छन्।

npm रजिस्ट्री?

-यो धेरै ठूलो सार्वजनिक भण्डार हो जहाँ स्मार्ट मानिसहरूले कोड र निर्भरताहरूलाई मोड्युलको रूपमा राख्छन्।

CDN जस्तै?

- साँच्चै होइन। यो एक केन्द्रीकृत डाटाबेस जस्तै हो जहाँ जो कोहीले पुस्तकालयहरू प्रकाशित र डाउनलोड गर्न सक्छन्, त्यसैले तपाईंले तिनीहरूलाई विकासको लागि स्थानीय रूपमा प्रयोग गर्न सक्नुहुन्छ र यदि तपाईं चाहनुहुन्छ भने तिनीहरूलाई CDN मा अपलोड गर्न सक्नुहुन्छ।

ओह, बोवर जस्तै!

-हो, तर यो 2016 हो, अब कसैले बोवर प्रयोग गर्दैन।

ओह, म देख्छु ... त्यसैले मैले npm बाट पुस्तकालयहरू डाउनलोड गर्न आवश्यक छ?

- हो। त्यसैले उदाहरणका लागि, यदि तपाइँ प्रतिक्रिया प्रयोग गर्न चाहनुहुन्छ भने, तपाइँ प्रतिक्रिया मोड्युल डाउनलोड गर्नुहोस् र यसलाई तपाइँको कोडमा आयात गर्नुहोस्। तपाइँ लगभग हरेक लोकप्रिय जाभास्क्रिप्ट पुस्तकालय को लागी यो गर्न सक्नुहुन्छ।

ओह, Angular जस्तै!

-Angular 2015 हो। तर हो। VueJS वा RxJS र अन्य उत्कृष्ट 2016 पुस्तकालयहरूको साथमा, Angular हुनेछ। ती बारे जान्न चाहनुहुन्छ?

प्रतिक्रियाको साथ रहौं, म अहिले धेरै कुराहरू सिकिरहेको छु। त्यसोभए, यदि मलाई प्रतिक्रिया प्रयोग गर्न आवश्यक छ भने म यसलाई यो एनपीएमबाट ल्याउँछु र त्यसपछि यो ब्राउजरिफिक चीज प्रयोग गर्छु?

- हो।

यो केवल निर्भरता को एक गुच्छा समात्न र तिनीहरूलाई एक साथ बाँध्न धेरै जटिल देखिन्छ।

-यसैले ब्राउजरफाइलाई स्वचालित रूपमा चलाउनको लागि ग्रन्ट वा गुल्प वा ब्रोकोली जस्ता कार्य प्रबन्धक प्रयोग गर्नुहुन्छ। हेक, तपाईं पनि Mimosa प्रयोग गर्न सक्नुहुन्छ।

ग्रन्ट? गुल्प? ब्रोकाउली? मिमोसा? के हामी अहिले कुरा गर्दैछौं?

- कार्य प्रबन्धकहरू। तर तिनीहरू अब शान्त छैनन्। हामीले तिनीहरूलाई जस्तै, 2015 मा प्रयोग गर्यौं, त्यसपछि हामीले मेकफाइलहरू प्रयोग गर्यौं, तर अब हामी वेबप्याकसँग सबै कुरा बेर्छौं।

मेकफाइलहरू? मैले सोचे कि त्यो प्रायः C वा C++ परियोजनाहरूमा प्रयोग भएको थियो।

-हो, तर स्पष्ट रूपमा वेबमा हामी चीजहरूलाई जटिल बनाउन र त्यसपछि आधारभूत कुराहरूमा फर्कन मन पराउँछौं। हामी प्रत्येक वर्ष वा त्यसो गर्छौं, यसको लागि पर्खनुहोस्, हामी एक वा दुई वर्षमा वेबमा एसेम्बली गर्न जाँदैछौं।

सास। तपाईंले वेबप्याक भनिने कुरा उल्लेख गर्नुभयो?

- यो ब्राउजरको लागि अर्को मोड्युल प्रबन्धक हो जबकि टास्क रनरको रूपमा पनि। यो Browserify को राम्रो संस्करण जस्तै छ।

ओ, ठीक छ। यो किन राम्रो छ?

-ठीक छ, सायद राम्रो छैन, यो तपाईंको निर्भरताहरू कसरी बाँध्नु पर्छ भन्नेमा बढी विचार गरिएको छ। Webpack ले तपाईंलाई फरक मोड्युल प्रबन्धकहरू प्रयोग गर्न अनुमति दिन्छ, र CommonJS मात्र होइन, उदाहरणका लागि नेटिभ ES6 समर्थित मोड्युलहरू।

म यो सम्पूर्ण CommonJS/ES6 कुराबाट धेरै अलमलमा छु।

-सबैजना छन्, तर तपाईंले SystemJS सँग अब ख्याल गर्नुपर्दैन।

येशू ख्रीष्ट, अर्को संज्ञा-js। ठीक छ, र यो SystemJS के हो?

- ठीक छ, Browserify र Webpack 1.x को विपरीत, SystemJS एक डायनामिक मोड्युल लोडर हो जसले तपाईंलाई एक ठूलो फाइलमा बन्डल गर्नुको सट्टा धेरै फाइलहरूमा धेरै मोड्युलहरू बाँध्न अनुमति दिन्छ।

पर्खनुहोस्, तर मैले सोचें कि हामी हाम्रो पुस्तकालयहरू एउटा ठूलो फाइलमा निर्माण गर्न चाहन्छौं र त्यो लोड गर्न चाहन्छौं!

-हो, तर किनभने HTTP/2 आउँदैछ अब धेरै HTTP अनुरोधहरू वास्तवमा राम्रो छन्।

पर्खनुहोस्, त्यसोभए के हामी प्रतिक्रियाको लागि तीनवटा मूल पुस्तकालयहरू थप्न सक्दैनौं??

- साँच्चै होइन। मेरो मतलब, तपाईंले तिनीहरूलाई CDN बाट बाह्य स्क्रिप्टको रूपमा थप्न सक्नुहुन्छ, तर तपाईंले अझै पनि Babel समावेश गर्न आवश्यक छ।

सास। र त्यो नराम्रो हो?

-हो, तपाईंले सम्पूर्ण बेबल-कोर समावेश गर्नुहुनेछ, र यो उत्पादनको लागि प्रभावकारी हुनेछैन। उत्पादनमा तपाईंले आफ्नो परियोजना तयार पार्न पूर्व-कार्यहरूको एक श्रृंखला प्रदर्शन गर्न आवश्यक छ जसले शैतानलाई उमालेको अण्डाको नुस्खा जस्तो देखिने अनुष्ठान बनाउँदछ। तपाईंले सम्पत्तिहरू कम गर्न आवश्यक छ, तिनीहरूलाई कुरूप बनाउनु पर्छ, फोल्ड माथिको इनलाइन सीएसएस, स्क्रिप्टहरू स्थगित गर्नुहोस्, साथै-

मैले बुझें, बुझें। त्यसोभए यदि तपाइँ पुस्तकालयहरूलाई सीडीएनमा सीधै समावेश गर्नुहुन्न भने, तपाइँ यसलाई कसरी गर्नुहुन्छ?

-म यसलाई वेबप्याक + SystemJS + Babel कम्बो प्रयोग गरेर टाइपस्क्रिप्टबाट ट्रान्सपाइल गर्नेछु।

टाइपस्क्रिप्ट? मैले सोचे कि हामी जाभास्क्रिप्टमा कोडिङ गर्दैछौं!

- टाइपस्क्रिप्ट जाभास्क्रिप्ट हो, वा राम्रो राख्नुहोस्, जाभास्क्रिप्टको एक सुपरसेट, अधिक विशेष गरी संस्करण ES6 मा जाभास्क्रिप्ट। तपाईलाई थाहा छ, त्यो छैटौं संस्करण हामीले पहिले कुरा गर्यौं?

मैले सोचे कि ES2016+ पहिले नै ES6 को सुपरसेट थियो! हामीलाई अहिले टाइपस्क्रिप्ट भन्ने कुरा किन चाहिन्छ?

-ओह, किनभने यसले हामीलाई टाइप गरिएको भाषाको रूपमा जाभास्क्रिप्ट प्रयोग गर्न र रन-टाइम त्रुटिहरू कम गर्न अनुमति दिन्छ। यो 2016 हो, तपाईंले आफ्नो JavaScript कोडमा केही प्रकारहरू थप्नुपर्छ।

र टाइपस्क्रिप्टले स्पष्ट रूपमा गर्छ।

-फ्लो पनि, यद्यपि यसले टाइपिङका लागि मात्र जाँच गर्छ जबकि टाइपस्क्रिप्ट जाभास्क्रिप्टको सुपरसेट हो जसलाई कम्पाइल गर्न आवश्यक छ।

सास... र प्रवाह हो?

- यो फेसबुक मा केहि केटाहरु द्वारा बनाईएको एक स्थिर प्रकार परीक्षक हो। तिनीहरूले यसलाई OCaml मा कोड गरे, किनभने कार्यात्मक प्रोग्रामिङ अद्भुत छ।

OCaml? कार्यात्मक प्रोग्रामिङ?

-आजकालका कूल बच्चाहरूले के प्रयोग गर्छन्, के थाहा छ, २०१६ मा ? कार्यात्मक प्रोग्रामिङ? उच्च आदेश कार्यहरू? करी गर्दै हुनुहुन्छ? शुद्ध कार्यहरू?

तपाईंले भर्खर के भन्नुभयो मलाई थाहा छैन।

- सुरुमा कसैले गर्दैन। हेर्नुहोस्, तपाईंले भर्खरै थाहा पाउनु पर्छ कि कार्यात्मक प्रोग्रामिंग OOP भन्दा राम्रो छ र हामीले 2016 मा प्रयोग गरिरहनु पर्छ।

पर्खनुहोस्, मैले कलेजमा OOP सिके, मैले सोचे कि यो राम्रो छ?

- Oracle द्वारा किन्नु अघि जाभा थियो। मेरो मतलब, OOP पहिलेका दिनहरूमा राम्रो थियो, र आज पनि यसको प्रयोगहरू छन्, तर अब सबैले महसुस गरिरहेका छन् कि राज्यहरू परिमार्जन गर्नु बच्चाहरूलाई लात मार्नु बराबर हो, त्यसैले अब सबैजना अपरिवर्तनीय वस्तुहरू र कार्यात्मक प्रोग्रामिङमा सर्दै छन्। Haskell केटाहरूले यसलाई वर्षौंदेखि कल गर्दै थिए, - र मलाई Elm साथीहरूसँग सुरु नगर्नुहोस्- तर सौभाग्य देखि वेबमा अब हामीसँग राम्दा जस्ता पुस्तकालयहरू छन् जसले हामीलाई सादा जाभास्क्रिप्टमा कार्यात्मक प्रोग्रामिङ प्रयोग गर्न अनुमति दिन्छ।

त्यसैको लागि नाम मात्रै छोड्दै हुनुहुन्छ ? रामन्दा के हो ?

-होइन। राम्दा। Lambda जस्तै। तपाईंलाई थाहा छ, त्यो डेभिड चेम्बर्सको पुस्तकालय?

डेभिड को?

- डेभिड चेम्बर्स। न्यानो मान्छे। एक मतलब कुप खेल खेल्छ। Ramda को लागि योगदानकर्ता मध्ये एक। यदि तपाइँ कार्यात्मक प्रोग्रामिङ सिक्ने बारे गम्भीर हुनुहुन्छ भने तपाईले एरिक मेइजरलाई पनि जाँच गर्नुपर्छ।

र एरिक मेइजर हो ...?

-कार्यात्मक प्रोग्रामिङ केटा पनि। गजब मान्छे। उनीसँग प्रस्तुतीकरणहरूको गुच्छा छ जहाँ उनले यो अनौठो रंगको शर्ट प्रयोग गर्दा एजाइललाई रद्दीटोकरीमा पार्छन्। तपाईंले Tj, Jash Kenas, Sindre Sorhus, Paul Irish, Addy Osmani- बाट केहि सामानहरू पनि जाँच गर्नुपर्छ।

ठीक छ। म तिमीलाई त्यहाँ रोक्न जाँदैछु। त्यो सबै राम्रो र राम्रो छ, तर मलाई लाग्छ कि त्यो सबै यति जटिल र अनावश्यक छ डाटा ल्याउन र प्रदर्शन गर्न को लागी। म पक्का छु कि मैले यी मानिसहरूलाई चिन्न वा ती सबै चीजहरू सिक्न आवश्यक छैन गतिशील डेटाको साथ तालिका सिर्जना गर्न। प्रतिक्रिया मा फर्कौं। म कसरी प्रतिक्रिया मार्फत सर्भरबाट डाटा ल्याउन सक्छु?

- ठिक छ, तपाईले वास्तवमा React बाट डाटा ल्याउनु हुन्न, तपाईले मात्र React सँग डाटा प्रदर्शन गर्नुहुन्छ।

ओह, मलाई धिक्कार छ। त्यसोभए तपाईले डाटा ल्याउन के प्रयोग गर्नुहुन्छ?

- तपाइँ सर्भरबाट डाटा ल्याउन फेच प्रयोग गर्नुहुन्छ।

मलाई माफ गर्नुहोस्? तपाइँ डेटा ल्याउन फेच प्रयोग गर्नुहुन्छ? जसले ती चीजहरूको नाम दिइरहेको छ उसलाई थिसौरस चाहिन्छ।

- मलाई थाहा छ? सर्भर विरुद्ध XMLHttpRequests प्रदर्शन गर्नको लागि यो नेटिभ कार्यान्वयनको नाम हो।

ओह, त्यसैले AJAX।

-AJAX XMLHttpRequests को प्रयोग मात्र हो। तर पक्का। Fetch ले तपाइँलाई AJAX प्रतिज्ञाहरूमा आधारित गर्न अनुमति दिन्छ, जुन तपाइँ कलब्याक नरकबाट बच्नको लागि समाधान गर्न सक्नुहुन्छ।

कलब्याक नरक?

- हो। प्रत्येक चोटि तपाईले सर्भर विरुद्ध एसिन्क्रोनस अनुरोध प्रदर्शन गर्नुहुन्छ, तपाईले यसको प्रतिक्रियाको लागि पर्खनु पर्छ, जसले तपाईलाई प्रकार्य भित्र एक प्रकार्य थप्न बनाउँछ, जसलाई नरकबाट कलब्याक पिरामिड भनिन्छ।

ओ, ठीक छ। र यो वाचा कुराले यसलाई समाधान गर्छ?

- साँच्चै। तपाईंको कलब्याकहरू प्रतिज्ञाहरू मार्फत हेरफेर गरेर, तपाईंले कोड बुझ्न, नक्कल गर्न र परीक्षण गर्न सजिलो लेख्न सक्नुहुन्छ, साथै एकैचोटि अनुरोधहरू गर्न सक्नुहुन्छ र ती सबै लोड नभएसम्म पर्खनुहोस्।

र त्यो Fetch संग गर्न सकिन्छ?

-हो, तर मात्र यदि तपाइँको प्रयोगकर्ताले सदाबहार ब्राउजर प्रयोग गर्दछ, अन्यथा तपाइँले फेच पोलिफिल समावेश गर्न वा अनुरोध, ब्लूबर्ड वा एक्सियोस प्रयोग गर्न आवश्यक छ।

भगवानको लागि मैले कतिवटा पुस्तकालयहरू जान्न आवश्यक छ? तिनीहरूमध्ये कति छन्?

- यो जाभास्क्रिप्ट हो। त्यहाँ हजारौं पुस्तकालयहरू हुनुपर्छ जुन सबैले एउटै काम गर्छन्। हामीलाई पुस्तकालयहरू थाहा छ, वास्तवमा हामीसँग उत्कृष्ट पुस्तकालयहरू छन्। हाम्रा पुस्तकालयहरू ह्युउज छन्, र कहिलेकाहीँ हामी तिनीहरूमा गाइ फिएरीका चित्रहरू समावेश गर्दछौं।

के तपाईंले भर्खर केटा फिएरी भन्नुभयो? यो संग समाप्त गरौं। यी Bluebird, Request, Axios पुस्तकालयहरूले के गर्छन्?

- तिनीहरू XMLHttpRequests गर्नका लागि पुस्तकालयहरू हुन् जसले प्रतिज्ञाहरू फर्काउँछन्।

के jQuery को AJAX विधिले पनि प्रतिज्ञाहरू फिर्ता गर्न थालेको छैन?

-हामी अब 2016 मा "J" शब्द प्रयोग गर्दैनौं। केवल फेच प्रयोग गर्नुहोस्, र ब्राउजरमा नभएको बेला यसलाई पोलिफिल गर्नुहोस् वा यसको सट्टा Bluebird, अनुरोध वा Axios प्रयोग गर्नुहोस्। त्यसपछि async प्रकार्य र बूम भित्र प्रतिक्षाको साथ वाचा प्रबन्ध गर्नुहोस्, तपाईंसँग उचित नियन्त्रण प्रवाह छ।

यो तेस्रो पटक हो तपाईंले पर्खाइको उल्लेख गर्नुभयो तर मलाई थाहा छैन यो के हो।

-Await ले तपाइँलाई एसिन्क्रोनस कल ब्लक गर्न अनुमति दिन्छ, तपाइँलाई डेटा ल्याउने र समग्रमा बढ्दो कोड पढ्ने क्षमतामा राम्रो नियन्त्रण गर्न अनुमति दिन्छ। यो गजबको छ, तपाईंले Babel मा चरण-3 प्रिसेट थप्न वा सिन्ट्याक्स-async-प्रकार्यहरू र transform-async-to-generator प्लगइन प्रयोग गर्ने कुरा सुनिश्चित गर्न आवश्यक छ।

यो पागल हो।

-होइन, पागल यो तथ्य हो कि तपाईंले टाइपस्क्रिप्ट कोड पूर्व-कम्पाइल गर्न आवश्यक छ र त्यसपछि पर्खाइ प्रयोग गर्नको लागि बेबलसँग ट्रान्सपाइल गर्नुहोस्।

के? यो Typescript मा समावेश छैन?

-यसले अर्को संस्करणमा गर्छ, तर संस्करण १.७ को रूपमा यसले ES6 लाई मात्र लक्षित गर्छ, त्यसैले यदि तपाइँ ब्राउजरमा पर्खनुहोस् प्रयोग गर्न चाहनुहुन्छ भने, पहिले तपाइँले तपाइँको टाइपस्क्रिप्ट कोड ES6 लाई लक्षित गरी कम्पाइल गर्न आवश्यक छ र त्यसपछि बेबल जुन ES5 लाई लक्षित गर्दछ।

यस बिन्दुमा मलाई के भन्ने थाहा छैन।

- हेर, यो सजिलो छ। Typescript मा सबै कोड गर्नुहोस्। Fetch प्रयोग गर्ने सबै मोड्युलहरूले तिनीहरूलाई ES6 लक्षित गर्न कम्पाइल गर्छन्, तिनीहरूलाई चरण-3 प्रिसेटमा Babel सँग ट्रान्सपाइल गर्नुहोस्, र तिनीहरूलाई SystemJS सँग लोड गर्नुहोस्। यदि तपाईंसँग फेच छैन भने, यसलाई पोलिफिल गर्नुहोस्, वा Bluebird, Request वा Axios प्रयोग गर्नुहोस्, र पर्खाइमा तपाईंका सबै प्रतिज्ञाहरू ह्यान्डल गर्नुहोस्।

हामीसँग सजिलोको धेरै फरक परिभाषाहरू छन्। त्यसोभए, त्यो अनुष्ठानको साथ मैले अन्ततः डाटा ल्याएँ र अब म यसलाई प्रतिक्रियाको साथ प्रदर्शन गर्न सक्छु?

-के तपाइँको आवेदन कुनै पनि राज्य परिवर्तन ह्यान्डल गर्न गइरहेको छ?

अरे, मलाई लाग्दैन। मैले केवल डाटा प्रदर्शन गर्न आवश्यक छ।

- ओह, भगवान धन्यवाद। अन्यथा मैले तपाईंलाई Flux, र Flummox, Alt, Fluxible जस्ता कार्यान्वयनहरू व्याख्या गर्नु पर्ने थियो। यद्यपि इमानदार हुन तपाईंले Redux प्रयोग गर्नुपर्छ।

म ती नामहरू माथि उड्न जाँदैछु। फेरि, मलाई डाटा प्रदर्शन गर्न आवश्यक छ।

-ओह, यदि तपाइँ भर्खर डाटा प्रदर्शन गर्दै हुनुहुन्छ भने तपाइँलाई सुरु गर्न प्रतिक्रिया आवश्यक पर्दैन। तपाईं टेम्प्लेटिंग इन्जिनको साथ राम्रो हुनुहुनेछ।

के तपाईं मसँग ठट्टा गर्दै हुनुहुन्छ? के तपाईलाई यो हास्यास्पद लाग्छ? के तपाईं आफ्ना प्रियजनहरूलाई यसरी व्यवहार गर्नुहुन्छ?

- मैले तपाई के प्रयोग गर्न सक्नुहुन्छ भनेर व्याख्या गर्दै थिएँ।

रोक्नुहोस्। बस रोक्नुहोस्।

-मेरो मतलब, यदि यो केवल टेम्प्लेटिंग इन्जिन प्रयोग गरिरहेको छ भने, यदि म तपाईं थिए भने, म अझै पनि टाइपस्क्रिप्ट + SystemJS + Babel कम्बो प्रयोग गर्नेछु।

मैले एउटा पृष्ठमा डाटा प्रदर्शन गर्न आवश्यक छ, सब शून्यको मूल MK घातकता प्रदर्शन गर्दैन। मलाई कुन टेम्प्लेटिंग इन्जिन प्रयोग गर्ने भन्नुहोस् र म त्यहाँबाट लिनेछु।

- त्यहाँ धेरै छ, तपाई कुनसँग परिचित हुनुहुन्छ?

उह, नाम याद छैन। यो धेरै समय अघि थियो।

-jTemplates? jQote? शुद्ध?

अरे, घण्टी बज्दैन। अर्को एक?

- पारदर्शिता? JSRender? MarkupJS? KnockoutJS? त्यो एक दुई-तर्फी बाइन्डिङ थियो।

अर्को एक?

-प्लेट्सजेएस? jQuery-tmpl? ह्यान्डलबारहरू? केही मानिसहरू अझै पनि प्रयोग गर्छन्।

हुनसक्छ। के त्यहाँ त्यो पछिल्लो एक समान छ?

- जुँगा, अन्डरस्कोर? मलाई लाग्छ कि अब लोडाशसँग पनि इमानदार हुनु पर्छ, तर ती 2014 को प्रकारका हुन्।

एर .. सायद यो नयाँ थियो।

- जेड? DustJS?

छैन।

-DotJS? EJS?

छैन।

- ननजक्स? ECT?

छैन।

-मह, कसैलाई पनि कफीस्क्रिप्ट सिन्ट्याक्स मन पर्दैन। जेड?

होइन, तपाईंले पहिले नै जेड भन्नुभयो।

- मेरो मतलब पग। मेरो मतलब जेड हो। मेरो मतलब, जेड अब पग छ।

सास। अहँ। याद छैन। तपाईं कुन प्रयोग गर्नुहुन्छ?

-सम्भवतः केवल ES6 नेटिभ टेम्प्लेट स्ट्रिङहरू।

मलाई अनुमान गर्न दिनुहोस्। र यसलाई ES6 चाहिन्छ।

-सही।

कुन, मैले कुन ब्राउजर प्रयोग गरिरहेको छु भन्ने आधारमा बाबेल चाहिन्छ।

-सही।

जुन, यदि म सम्पूर्ण कोर पुस्तकालय थपे बिना समावेश गर्न चाहन्छु, मैले यसलाई npm बाट मोड्युलको रूपमा लोड गर्न आवश्यक छ।

-सही।

जसलाई ब्राउजरफाइ, वा वेपब्याक, वा सम्भवतः SystemJS भनिने अर्को चीज चाहिन्छ।

-सही।

जुन, जबसम्म यो वेबप्याक होईन, आदर्श रूपमा कार्य धावक द्वारा व्यवस्थित गरिनु पर्छ।

-सही।

तर, मैले कार्यात्मक प्रोग्रामिङ र टाइप गरिएका भाषाहरू प्रयोग गरिरहेको हुनाले मैले पहिले टाइपस्क्रिप्ट पूर्व-कम्पाइल गर्न वा यो फ्लो चीज थप्न आवश्यक छ।

-सही।

र त्यसपछि Babel मा पठाउनुहोस् यदि म प्रतीक्षा प्रयोग गर्न चाहन्छु।

-सही।

त्यसोभए म फेच, प्रतिज्ञाहरू, र नियन्त्रण प्रवाह र ती सबै जादू प्रयोग गर्न सक्छु।

-बस पोलिफिल फेच गर्न नबिर्सनुहोस् यदि यो समर्थित छैन भने, सफारीले अझै यसलाई ह्यान्डल गर्न सक्दैन।

तपाईलाई थाहा छ के। मलाई लाग्छ हामी यहाँ सकियौं। वास्तवमा, मलाई लाग्छ कि मैले सकियो। मैले वेबको साथ गरिसकेको छु, मैले जाभास्क्रिप्टको साथ पूरा गरिसकेको छु।

-यो ठीक छ, केही वर्षमा हामी सबै Elm वा WebAssembly मा कोडिङ गर्न जाँदैछौं।

म भर्खर ब्याकइन्डमा फर्कन जाँदैछु। म यी धेरै परिवर्तनहरू र संस्करणहरू र संस्करणहरू र कम्पाइलरहरू र ट्रान्सपिलरहरू ह्यान्डल गर्न सक्दिन। जाभास्क्रिप्ट समुदाय पागल छ यदि यो सोच्दछ कि कसैले यसलाई जारी राख्न सक्छ।

- म तिमीलाई सुन्छु। तपाईंले पाइथन समुदाय प्रयास गर्नुपर्छ।

किन?

पाइथन ३ को बारेमा कहिल्यै सुन्नुभएको छ?

अपडेट: टाइपिङ र गल्तीहरू देखाउनु भएकोमा धन्यवाद, म लेखलाई उल्लेख गरे अनुसार अद्यावधिक गर्नेछु। HackerNews र Reddit मा छलफल ।