តើវាមានអារម្មណ៍យ៉ាងណាក្នុងការរៀន JavaScript ក្នុងឆ្នាំ 2016

មិនមាន ក្របខ័ណ្ឌ JavaScript ត្រូវបានបង្កើតឡើងក្នុងអំឡុងពេលសរសេរអត្ថបទនេះទេ។

ខាងក្រោមនេះត្រូវបានបំផុសគំនិតដោយអត្ថបទ "វាជាអនាគត" ពី Circle CI ។ អ្នកអាចអានដើម នៅទីនេះ ។ បំណែកនេះគ្រាន់តែជាមតិមួយប៉ុណ្ណោះ ហើយដូចជាក្របខ័ណ្ឌ JavaScript ណាមួយ វាមិនគួរត្រូវបានយកចិត្តទុកដាក់ខ្លាំងពេកនោះទេ។

ហេ! ខ្ញុំទទួលបានគម្រោងបណ្តាញថ្មីនេះ ប៉ុន្តែនិយាយឱ្យត្រង់ទៅ ខ្ញុំមិនបានសរសេរកូដគេហទំព័រច្រើនទេក្នុងរយៈពេលពីរបីឆ្នាំ ហើយខ្ញុំបានលឺថាទេសភាពបានផ្លាស់ប្តូរបន្តិច។ អ្នកគឺជាអ្នកអភិវឌ្ឍន៍គេហទំព័រដែលទាន់សម័យបំផុតនៅជុំវិញទីនេះមែនទេ?

- ពាក្យពិតគឺវិស្វករ Front End ប៉ុន្តែបាទ ខ្ញុំជាមនុស្សត្រឹមត្រូវ។ ខ្ញុំធ្វើគេហទំព័រនៅឆ្នាំ 2016។ ការមើលឃើញ អ្នកលេងភ្លេង យន្តហោះគ្មានមនុស្សបើកដែលលេងបាល់ទាត់ អ្នកដាក់ឈ្មោះវា។ ខ្ញុំទើបតែត្រលប់មកពី JsConf និង ReactConf ដូច្នេះខ្ញុំដឹងពីបច្ចេកវិទ្យាចុងក្រោយបង្អស់ដើម្បីបង្កើតកម្មវិធីគេហទំព័រ។

ត្រជាក់។ ខ្ញុំត្រូវបង្កើតទំព័រដែលបង្ហាញសកម្មភាពចុងក្រោយបំផុតពីអ្នកប្រើប្រាស់ ដូច្នេះខ្ញុំគ្រាន់តែត្រូវការយកទិន្នន័យពីចំណុចបញ្ចប់ REST ហើយបង្ហាញវានៅក្នុងតារាងដែលអាចត្រងបានខ្លះ ហើយធ្វើបច្ចុប្បន្នភាពវាប្រសិនបើមានអ្វីផ្លាស់ប្តូរនៅក្នុងម៉ាស៊ីនមេ។ ខ្ញុំគិតថាប្រហែលជាប្រើ jQuery ដើម្បីទាញយក និងបង្ហាញទិន្នន័យ?

- អូព្រះរបស់ខ្ញុំ គ្មាននរណាម្នាក់ប្រើ jQuery ទៀតទេ។ អ្នកគួរតែសាកល្បងរៀន React វាជាឆ្នាំ 2016។

អូ យល់ព្រម។ ប្រតិកម្មអ្វី?

- វាជាបណ្ណាល័យដ៏អស្ចារ្យមួយដែលបង្កើតឡើងដោយបុរសមួយចំនួននៅ Facebook វាពិតជានាំមកនូវការគ្រប់គ្រង និងដំណើរការទៅកាន់កម្មវិធីរបស់អ្នក ដោយអនុញ្ញាតឱ្យអ្នកដោះស្រាយការផ្លាស់ប្តូរទិដ្ឋភាពណាមួយយ៉ាងងាយស្រួល។

ស្តាប់​ទៅ​ស្អាត។ តើខ្ញុំអាចប្រើ React ដើម្បីបង្ហាញទិន្នន័យពីម៉ាស៊ីនមេបានទេ?

-បាទ ប៉ុន្តែដំបូងអ្នកត្រូវបន្ថែម React និង React DOM ជាបណ្ណាល័យក្នុងគេហទំព័ររបស់អ្នក។

ចាំមើល ហេតុអ្វីបានជាបណ្ណាល័យពីរ?

- ដូច្នេះមួយគឺជាបណ្ណាល័យពិតប្រាកដ ហើយទីពីរគឺសម្រាប់រៀបចំ DOM ដែលឥឡូវនេះអ្នកអាចពិពណ៌នានៅក្នុង JSX ។

JSX? តើ JSX ជាអ្វី?

-JSX គឺគ្រាន់តែជាផ្នែកបន្ថែមវាក្យសម្ព័ន្ធ JavaScript ដែលមើលទៅដូច XML ។ វាជាវិធីមួយផ្សេងទៀតដើម្បីពិពណ៌នាអំពី DOM គិតថាវាជា HTML ល្អជាង។

តើ HTML មានបញ្ហាអ្វី?

-វាជាឆ្នាំ 2016។ គ្មាននរណាម្នាក់សរសេរកូដ HTML ដោយផ្ទាល់ទៀតទេ។

ត្រូវហើយ។ បើខ្ញុំបន្ថែមបណ្ណាល័យទាំងពីរនេះ តើខ្ញុំអាចប្រើ React បានទេ?

- មិនអីទេ។ អ្នកត្រូវបន្ថែម Babel ហើយបន្ទាប់មកអ្នកអាចប្រើ React បាន។

បណ្ណាល័យមួយទៀត? Babel ជាអ្វី?

-Oh Babel គឺជា transpiler ដែលអនុញ្ញាតឱ្យអ្នកកំណត់គោលដៅកំណែជាក់លាក់នៃ JavaScript ខណៈពេលដែលអ្នកសរសេរកូដនៅក្នុងកំណែ JavaScript ណាមួយ។ អ្នកមិនចាំបាច់បញ្ចូល Babel ដើម្បីប្រើ ReactJS ទេ ប៉ុន្តែលុះត្រាតែអ្នកធ្វើ អ្នកជាប់គាំងជាមួយការប្រើប្រាស់ ES5 ហើយសូមឱ្យវាក្លាយជាការពិត វាជាឆ្នាំ 2016 អ្នកគួរតែសរសេរកូដនៅក្នុង ES2016+ ដូចក្មេងៗដែលនៅសេសសល់ដែរ។

ES5? ES2016+? ខ្ញុំកំពុងវង្វេងនៅទីនេះ។ តើ ES5 និង ES2016+ ជាអ្វី?

-ES5 តំណាងឱ្យ ECMAScript 5។ វាជាការបោះពុម្ពផ្សាយដែលមានមនុស្សភាគច្រើនជាគោលដៅចាប់តាំងពីវាត្រូវបានអនុវត្តដោយកម្មវិធីរុករកភាគច្រើននាពេលបច្ចុប្បន្ននេះ។

ECMAScript?

-បាទ អ្នកដឹងទេ ស្តង់ដារស្គ្រីប JavaScript ត្រូវបានផ្អែកលើនៅឆ្នាំ 1999 បន្ទាប់ពីការចេញផ្សាយដំបូងរបស់វាក្នុងឆ្នាំ 1995 ត្រឡប់មកវិញនៅពេលដែល JavaScript ត្រូវបានដាក់ឈ្មោះថា Livescript ហើយដំណើរការតែនៅក្នុង Netscape Navigator ប៉ុណ្ណោះ។ នោះពិតជារញ៉េរញ៉ៃណាស់នៅពេលនោះ ប៉ុន្តែជាសំណាងល្អឥឡូវនេះអ្វីៗមានភាពច្បាស់លាស់ ហើយយើងមាន 7 កំណែនៃការអនុវត្តនេះ។

7 បោះពុម្ព។ សម្រាប់ពិត។ ហើយ ES5 និង ES2016+ គឺ?

- ការបោះពុម្ពលើកទី ៥ និងទី ៧ រៀងៗខ្លួន។

ចាំមើល តើមានអ្វីកើតឡើងជាមួយទីប្រាំមួយ?

- អ្នកមានន័យថា ES6? បាទ ខ្ញុំចង់និយាយថា ការបោះពុម្ពនីមួយៗគឺជា superset នៃកំណែមុន ដូច្នេះប្រសិនបើអ្នកកំពុងប្រើ ES2016+ អ្នកកំពុងប្រើមុខងារទាំងអស់នៃកំណែមុននេះ។

ត្រូវហើយ។ ហើយហេតុអ្វីត្រូវប្រើ ES2016+ លើ ES6 អញ្ចឹង?

-ល្អ អ្នក​អាច​ប្រើ ES6 ប៉ុន្តែ​ដើម្បី​ប្រើ​មុខងារ​ត្រជាក់ៗ​ដូចជា async ហើយ​រង់ចាំ អ្នក​ត្រូវ​ប្រើ ES2016+។ បើមិនដូច្នោះទេ អ្នកជាប់គាំងជាមួយម៉ាស៊ីនភ្លើង ES6 ជាមួយនឹង coroutines ដើម្បីទប់ស្កាត់ការហៅអសមកាលសម្រាប់លំហូរនៃការគ្រប់គ្រងត្រឹមត្រូវ។

ខ្ញុំមិនដឹងថាអ្នកទើបតែនិយាយអ្វីទេ ហើយឈ្មោះទាំងអស់នេះមានការភ័ន្តច្រឡំ។ មើល ខ្ញុំកំពុងផ្ទុកទិន្នន័យជាច្រើនពីម៉ាស៊ីនមេ ខ្ញុំធ្លាប់អាចបញ្ចូល jQuery ពី CDN ហើយគ្រាន់តែទទួលបានទិន្នន័យជាមួយនឹងការហៅ AJAX ហេតុអ្វីខ្ញុំមិនអាចធ្វើវាបាន?

-វាជាបុរសឆ្នាំ 2016 គ្មាននរណាម្នាក់ប្រើ jQuery ទៀតទេ វាបញ្ចប់ដោយកូដ spaghetti ជាច្រើន។ មនុស្សគ្រប់គ្នាដឹងរឿងនោះ។

ត្រូវហើយ។ ដូច្នេះជម្រើសរបស់ខ្ញុំគឺផ្ទុកបណ្ណាល័យចំនួនបីដើម្បីទាញយកទិន្នន័យ និងបង្ហាញតារាង HTML ។

-មែនហើយ អ្នករួមបញ្ចូលបណ្ណាល័យទាំងបីនោះ ប៉ុន្តែចងពួកវាជាមួយកម្មវិធីគ្រប់គ្រងម៉ូឌុល ដើម្បីផ្ទុកឯកសារតែមួយប៉ុណ្ណោះ។

ខ្ញុំឃើញ។ ហើយអ្វីទៅជាកម្មវិធីគ្រប់គ្រងម៉ូឌុល?

- និយមន័យគឺអាស្រ័យលើបរិស្ថាន ប៉ុន្តែនៅក្នុងបណ្តាញយើងជាធម្មតាមានន័យថាអ្វីដែលគាំទ្រម៉ូឌុល AMD ឬ CommonJS ។

រីយ៉ាត។ ហើយ AMD និង CommonJS គឺ...?

- និយមន័យ។ មានវិធីដើម្បីពិពណ៌នាអំពីរបៀបដែលបណ្ណាល័យ និងថ្នាក់ JavaScript ច្រើនគួរធ្វើអន្តរកម្ម។ អ្នកដឹងទេ នាំចេញ និងទាមទារ? អ្នកអាចសរសេរឯកសារ JavaScript ជាច្រើនដែលកំណត់ AMD ឬ CommonJS API ហើយអ្នកអាចប្រើអ្វីមួយដូចជា Browserify ដើម្បីបាច់ពួកវា។

យល់ព្រម វាសមហេតុផល... ខ្ញុំគិតថា។ តើ Browserify ជាអ្វី?

-វាជាឧបករណ៍ដែលអនុញ្ញាតឱ្យអ្នកចងនូវភាពអាស្រ័យដែលបានពិពណ៌នារបស់ CommonJS ទៅកាន់ឯកសារដែលអាចដំណើរការក្នុងកម្មវិធីរុករកបាន។ វាត្រូវបានបង្កើតឡើងដោយសារតែមនុស្សភាគច្រើនបោះផ្សាយភាពអាស្រ័យទាំងនោះនៅក្នុងបញ្ជីឈ្មោះ npm ។

npm ចុះឈ្មោះ?

- វាជាឃ្លាំងសាធារណៈដ៏ធំមួយ ដែលមនុស្សឆ្លាតដាក់កូដ និងភាពអាស្រ័យជាម៉ូឌុល។

ដូច CDN?

- មិនពិតទេ។ វាកាន់តែដូចជាមូលដ្ឋានទិន្នន័យកណ្តាល ដែលអ្នកណាម្នាក់អាចបោះផ្សាយ និងទាញយកបណ្ណាល័យ ដូច្នេះអ្នកអាចប្រើវាក្នុងមូលដ្ឋានសម្រាប់ការអភិវឌ្ឍន៍ ហើយបន្ទាប់មកបញ្ចូលវាទៅក្នុង CDN ប្រសិនបើអ្នកចង់។

អូដូចជា Bower!

- បាទ ប៉ុន្តែវាជាឆ្នាំ 2016 ឥឡូវនេះគ្មាននរណាម្នាក់ប្រើ Bower ទៀតទេ។

អូ ខ្ញុំឃើញ… ដូច្នេះខ្ញុំត្រូវទាញយកបណ្ណាល័យពី npm មែនទេ?

- បាទ។ ដូច្នេះ ឧទាហរណ៍ ប្រសិនបើអ្នកចង់ប្រើ React អ្នកទាញយកម៉ូឌុល React ហើយនាំចូលវាទៅក្នុងកូដរបស់អ្នក។ អ្នកអាចធ្វើវាបានសម្រាប់ស្ទើរតែគ្រប់បណ្ណាល័យ JavaScript ដ៏ពេញនិយមទាំងអស់។

អូដូច Angular!

-Angular គឺដូច្នេះ 2015. ប៉ុន្តែបាទ។ Angular នឹងនៅទីនោះ រួមជាមួយនឹង VueJS ឬ RxJS និងបណ្ណាល័យ 2016 ដ៏ត្រជាក់ផ្សេងទៀត។ ចង់រៀនអំពីរឿងទាំងនោះ?

តោះនៅជាមួយ React ពេលនេះខ្ញុំកំពុងរៀនរឿងជាច្រើនរួចទៅហើយ។ ដូច្នេះប្រសិនបើខ្ញុំត្រូវការប្រើ React ខ្ញុំយកវាពី npm នេះហើយប្រើ Browserify នេះ?

- បាទ។

វាហាក់ដូចជាស្មុគ្រស្មាញខ្លាំងពេក ក្នុងការចាប់យកបណ្តុំនៃភាពអាស្រ័យ ហើយចងពួកវាជាមួយគ្នា។

- នោះហើយជាមូលហេតុដែលអ្នកប្រើកម្មវិធីគ្រប់គ្រងភារកិច្ចដូចជា Grunt ឬ Gulp ឬ Broccoli ដើម្បីដំណើរការ Browserify ដោយស្វ័យប្រវត្តិ។ Heck អ្នកថែមទាំងអាចប្រើ Mimosa ទៀតផង។

ហត់? Gulp? ប្រូខូលី? មីម៉ូសា? តើយើងកំពុងនិយាយអំពីអ្វីឥឡូវនេះ?

- អ្នកគ្រប់គ្រងភារកិច្ច។ ប៉ុន្តែពួកគេមិនត្រជាក់ទៀតទេ។ យើងបានប្រើវាដូចជាឆ្នាំ 2015 បន្ទាប់មកយើងប្រើ Makefiles ប៉ុន្តែឥឡូវនេះយើងរុំអ្វីៗគ្រប់យ៉ាងជាមួយ Webpack ។

Makefiles? ខ្ញុំគិតថាវាភាគច្រើនប្រើលើគម្រោង C ឬ C ++។

-មែនហើយ ប៉ុន្តែតាមមើលទៅក្នុងបណ្តាញ យើងចូលចិត្តធ្វើឱ្យរឿងស្មុគស្មាញ ហើយបន្ទាប់មកត្រឡប់ទៅមូលដ្ឋានវិញ។ យើង​ធ្វើ​បែប​នោះ​ជា​រៀង​រាល់​ឆ្នាំ ដោយ​គ្រាន់​តែ​រង់​ចាំ​វា យើង​នឹង​ធ្វើ​ការ​ជួប​ជុំ​គ្នា​ក្នុង​បណ្ដាញ​ក្នុង​មួយ​ឆ្នាំ ឬ​ពីរ​ឆ្នាំ។

ដកដង្ហើមធំ។ តើអ្នកបាននិយាយអ្វីដែលគេហៅថា Webpack?

-វាជាកម្មវិធីគ្រប់គ្រងម៉ូឌុលមួយផ្សេងទៀតសម្រាប់កម្មវិធីរុករកខណៈដែលជាប្រភេទកម្មវិធីដំណើរការការងារផងដែរ។ វាដូចជាកំណែ Browserify ប្រសើរជាងមុន។

អូខេ។ ហេតុអ្វីបានជាវាប្រសើរជាង?

- ប្រហែលជាមិនប្រសើរជាងនេះទេ វាគ្រាន់តែជាការយល់ឃើញកាន់តែច្រើនអំពីរបៀបដែលភាពអាស្រ័យរបស់អ្នកគួរតែត្រូវបានចង។ Webpack អនុញ្ញាតឱ្យអ្នកប្រើកម្មវិធីគ្រប់គ្រងម៉ូឌុលផ្សេងៗគ្នា ហើយមិនត្រឹមតែ CommonJS ប៉ុណ្ណោះទេ ដូច្នេះឧទាហរណ៍ ES6 ដើមដែលគាំទ្រម៉ូឌុល។

ខ្ញុំមានការភ័ន្តច្រឡំយ៉ាងខ្លាំងចំពោះរឿង CommonJS/ES6 ទាំងមូលនេះ។

- គ្រប់គ្នាគឺ ប៉ុន្តែអ្នកមិនគួរខ្វល់ទៀតទេជាមួយ SystemJS ។

ព្រះយេស៊ូវគ្រីស្ទ នាមមួយទៀត -js ។ យល់ព្រម ហើយតើ SystemJS នេះជាអ្វី?

- ជាការប្រសើរណាស់ មិនដូច Browserify និង Webpack 1.x ទេ SystemJS គឺជាកម្មវិធីផ្ទុកម៉ូឌុលថាមវន្តដែលអនុញ្ញាតឱ្យអ្នកចងម៉ូឌុលជាច្រើននៅក្នុងឯកសារជាច្រើនជំនួសឱ្យការចងពួកវាក្នុងឯកសារធំមួយ។

រង់ចាំ ប៉ុន្តែខ្ញុំគិតថាយើងចង់បង្កើតបណ្ណាល័យរបស់យើងក្នុងឯកសារធំមួយ ហើយផ្ទុកវា!

- បាទ / ចាស ប៉ុន្តែដោយសារ HTTP/2 កំពុងមកឥឡូវនេះសំណើ HTTP ច្រើនពិតជាប្រសើរជាង។

ចាំអីទៀត យើងគ្រាន់តែបន្ថែមបណ្ណាល័យដើមទាំងបីសម្រាប់ React បានទេ??

- មិនពិតទេ។ ខ្ញុំចង់និយាយថា អ្នកអាចបន្ថែមពួកវាជាស្គ្រីបខាងក្រៅពី CDN ប៉ុន្តែអ្នកនៅតែត្រូវបញ្ចូល Babel បន្ទាប់មក។

ដកដង្ហើមធំ។ ហើយវាអាក្រក់មែនទេ?

-បាទ អ្នក​នឹង​រួម​បញ្ចូល​ទាំង​ស្នូល babel-core ហើយ​វា​នឹង​មិន​មាន​ប្រសិទ្ធភាព​សម្រាប់​ការ​ផលិត។ នៅលើការផលិត អ្នកត្រូវធ្វើកិច្ចការមុនៗជាបន្តបន្ទាប់ ដើម្បីរៀបចំគម្រោងរបស់អ្នក ដែលធ្វើឱ្យពិធីហៅសាតាំងមើលទៅដូចរូបមន្តស៊ុតឆ្អិន។ អ្នក​ត្រូវ​បង្រួម​ទ្រព្យ​សកម្ម ធ្វើ​ឱ្យ​ខូច​ពួកវា បញ្ចូល css នៅ​ខាង​លើ​បត់ ពន្យារ​ស្គ្រីប ព្រម​ទាំង​-

ខ្ញុំបានទទួលវា ខ្ញុំបានទទួលវា។ ដូច្នេះប្រសិនបើអ្នកនឹងមិនបញ្ចូលបណ្ណាល័យដោយផ្ទាល់នៅក្នុង CDN ទេ តើអ្នកនឹងធ្វើវាដោយរបៀបណា?

- ខ្ញុំនឹងចម្លងវាពី Typescript ដោយប្រើ Webpack + SystemJS + Babel combo ។

វាយអក្សរ? ខ្ញុំគិតថាយើងកំពុងសរសេរកូដក្នុង JavaScript!

-Typescript IS JavaScript ឬដាក់ឱ្យប្រសើរជាងនេះ គឺជាសំណុំនៃ JavaScript ពិសេសជាងនេះទៅទៀត JavaScript នៅលើកំណែ ES6។ តើអ្នកដឹងទេថាកំណែទីប្រាំមួយដែលយើងបាននិយាយពីមុន?

ខ្ញុំគិតថា ES2016+ គឺជាកំពូលនៃ ES6 រួចទៅហើយ! ហេតុអ្វីបានជាយើងត្រូវការរបស់នេះហៅថា Typescript?

-Oh ព្រោះវាអនុញ្ញាតឱ្យយើងប្រើ JavaScript ជាភាសាវាយអក្សរ និងកាត់បន្ថយកំហុសពេលដំណើរការ។ វាជាឆ្នាំ 2016 អ្នកគួរតែបន្ថែមប្រភេទមួយចំនួនទៅក្នុងកូដ JavaScript របស់អ្នក។

ហើយ Typescript ច្បាស់ជាធ្វើវា។

-Flow ផងដែរ ទោះបីជាវាពិនិត្យតែការវាយអក្សរ ខណៈពេលដែល Typescript គឺជា superset នៃ JavaScript ដែលត្រូវការចងក្រង។

ហ៊ឺ… ហើយលំហូរគឺ?

- វាជាកម្មវិធីត្រួតពិនិត្យប្រភេទឋិតិវន្តដែលធ្វើឡើងដោយបុរសមួយចំនួននៅហ្វេសប៊ុក។ ពួកគេបានសរសេរកូដវានៅក្នុង OCaml ពីព្រោះ កម្មវិធី មុខងារ គឺអស្ចារ្យណាស់។

អូខេមល? កម្មវិធីមុខងារ?

-វា​ជា​អ្វី​ដែល​ក្មេង​ប្រុស​សម័យ​នេះ​ប្រើ​ទេ​ដឹង​ឆ្នាំ ២០១៦? កម្មវិធីមុខងារ? មុខងារលំដាប់ខ្ពស់? ការី? មុខងារសុទ្ធ?

ខ្ញុំមិនដឹងថាអ្នកទើបតែនិយាយអ្វីទេ។

- គ្មាននរណាម្នាក់ធ្វើនៅដើមដំបូងទេ។ មើល អ្នកគ្រាន់តែត្រូវដឹងថាកម្មវិធីមុខងារគឺប្រសើរជាង OOP ហើយនោះជាអ្វីដែលយើងគួរប្រើក្នុងឆ្នាំ 2016។

ចាំខ្ញុំរៀន OOP នៅមហាវិទ្យាល័យ ខ្ញុំគិតថាល្អមែនទេ?

- ដូច្នេះ Java មុនពេលត្រូវបានទិញដោយ Oracle ។ ខ្ញុំចង់និយាយថា OOP គឺល្អកាលពីសម័យមុន ហើយវានៅតែមានការប្រើប្រាស់នាពេលបច្ចុប្បន្ននេះ ប៉ុន្តែឥឡូវនេះគ្រប់គ្នាកំពុងដឹងថាការកែប្រែរដ្ឋគឺស្មើនឹងការទាត់ទារក ដូច្នេះឥឡូវនេះអ្នកគ្រប់គ្នាកំពុងផ្លាស់ប្តូរទៅវត្ថុដែលមិនអាចផ្លាស់ប្តូរបាន និងកម្មវិធីមុខងារ។ បុរស Haskell បានហៅវាអស់ជាច្រើនឆ្នាំ ហើយកុំឱ្យខ្ញុំចាប់ផ្តើមជាមួយបុរស Elm ប៉ុន្តែសំណាងល្អនៅក្នុងបណ្តាញឥឡូវនេះយើងមានបណ្ណាល័យដូចជា Ramda ដែលអនុញ្ញាតឱ្យយើងប្រើកម្មវិធីមុខងារនៅក្នុង JavaScript ធម្មតា។

តើអ្នកគ្រាន់តែទម្លាក់ឈ្មោះសម្រាប់ជាប្រយោជន៍របស់វាមែនទេ? តើ Ramnda ជាអ្វីទៅ?

- ទេ។ រ៉ាមដា។ ដូចជា Lambda ។ តើអ្នកដឹងទេថាបណ្ណាល័យរបស់ David Chambers?

ដាវីឌ អ្នកណា?

- លោក David Chambers ។ បុរសត្រជាក់។ លេងល្បែងរដ្ឋប្រហារដ៏មានន័យ។ ម្នាក់ក្នុងចំណោមអ្នករួមចំណែកសម្រាប់ Ramda ។ អ្នកក៏គួរពិនិត្យមើល Erik Meijer ផងដែរ ប្រសិនបើអ្នកយកចិត្តទុកដាក់ក្នុងការរៀនកម្មវិធីមុខងារ។

ហើយ Erik Meijer គឺ…?

- អ្នកសរសេរកម្មវិធីដែលមានមុខងារផងដែរ។ បុរសអស្ចារ្យ។ គាត់​មាន​បទ​បង្ហាញ​ជាច្រើន​ដែល​គាត់​បោះចោល Agile ពេល​ប្រើ​អាវ​ពណ៌​ចំលែក​នេះ។ អ្នកក៏គួរតែពិនិត្យមើលវត្ថុមួយចំនួនពី Tj, Jash Kenas, Sindre Sorhus, Paul Irish, Addy Osmani-

យល់ព្រម។ ខ្ញុំនឹងបញ្ឈប់អ្នកនៅទីនោះ។ អ្វីៗទាំងអស់គឺល្អ និងល្អ ប៉ុន្តែខ្ញុំគិតថាអ្វីៗទាំងអស់គឺស្មុគស្មាញ និងមិនចាំបាច់សម្រាប់គ្រាន់តែទាញយកទិន្នន័យ និងបង្ហាញវា។ ខ្ញុំប្រាកដណាស់ថាខ្ញុំមិនចាំបាច់ស្គាល់មនុស្សទាំងនេះ ឬរៀនអ្វីៗទាំងអស់នោះដើម្បីបង្កើតតារាងដែលមានទិន្នន័យថាមវន្តនោះទេ។ តោះត្រឡប់ទៅ React វិញ។ តើខ្ញុំអាចទាញយកទិន្នន័យពីម៉ាស៊ីនមេដោយប្រើ React ដោយរបៀបណា?

-មែនហើយ អ្នកពិតជាមិនទាញយកទិន្នន័យជាមួយ React ទេ អ្នកគ្រាន់តែបង្ហាញទិន្នន័យជាមួយ React ។

អូ! ដូច្នេះ តើអ្នកប្រើអ្វីដើម្បីទាញយកទិន្នន័យ?

- អ្នកប្រើ Fetch ដើម្បីទាញយកទិន្នន័យពីម៉ាស៊ីនមេ។

ខ្ញុំសុំទោស? តើអ្នកប្រើ Fetch ដើម្បីទាញយកទិន្នន័យមែនទេ? អ្នក​ណា​ដែល​ដាក់​ឈ្មោះ​វត្ថុ​ទាំង​នោះ​ត្រូវ​ការ​វចនានុក្រម។

- ខ្ញុំដឹងត្រូវទេ? យកវាជាឈ្មោះនៃការអនុវត្តដើមសម្រាប់អនុវត្ត XMLHttpRequests ប្រឆាំងនឹងម៉ាស៊ីនមេ។

ដូច្នេះ AJAX ។

-AJAX គឺគ្រាន់តែជាការប្រើប្រាស់ XMLHttpRequests ប៉ុណ្ណោះ។ ប៉ុន្តែប្រាកដ។ Fetch អនុញ្ញាតឱ្យអ្នកធ្វើ AJAX ដោយផ្អែកលើការសន្យាដែលបន្ទាប់មកអ្នកអាចដោះស្រាយដើម្បីជៀសវាងការហៅត្រឡប់មកវិញ។

ហៅ​នរក​វិញ?

- បាទ។ រាល់ពេលដែលអ្នកធ្វើសំណើអសមកាលប្រឆាំងនឹងម៉ាស៊ីនមេ អ្នកត្រូវរង់ចាំការឆ្លើយតបរបស់វា ដែលបន្ទាប់មកធ្វើឱ្យអ្នកបន្ថែមមុខងារនៅក្នុងមុខងារមួយ ដែលត្រូវបានគេហៅថាសាជីជ្រុងហៅមកវិញពីឋាននរក។

អូខេ។ ហើយការសន្យានេះដោះស្រាយវាទេ?

- ពិត។ តាមរយៈការរៀបចំការហៅត្រឡប់មកវិញរបស់អ្នកតាមរយៈការសន្យា អ្នកអាចសរសេរកាន់តែងាយស្រួលយល់កូដ ចំអក និងសាកល្បងពួកវា ក៏ដូចជាអនុវត្តសំណើក្នុងពេលដំណាលគ្នា ហើយរង់ចាំរហូតដល់ពួកគេទាំងអស់ត្រូវបានផ្ទុក។

ហើយវាអាចធ្វើទៅបានជាមួយ Fetch?

-បាទ/ចាស ប៉ុន្តែប្រសិនបើអ្នកប្រើរបស់អ្នកប្រើកម្មវិធីរុករកបៃតង បើមិនដូច្នេះទេ អ្នកត្រូវបញ្ចូល Fetch polyfill ឬប្រើ Request, Bluebird ឬ Axios។

តើ​ខ្ញុំ​ត្រូវ​ដឹង​បណ្ណាល័យ​ប៉ុន្មាន​ដើម្បី​ជា​ប្រយោជន៍​ដល់​ព្រះ? តើមានប៉ុន្មាននាក់?

- វាជា JavaScript ។ ត្រូវតែមានបណ្ណាល័យរាប់ពាន់ ដែលសុទ្ធតែធ្វើដូចគ្នា។ យើងស្គាល់បណ្ណាល័យ តាមពិតយើងមានបណ្ណាល័យល្អបំផុត។ បណ្ណាល័យរបស់យើងមានច្រើន ហើយពេលខ្លះយើងបញ្ចូលរូបភាពរបស់ Guy Fieri នៅក្នុងពួកគេ។

តើអ្នកគ្រាន់តែនិយាយថា Guy Fieri ទេ? ចូរយើងបញ្ចប់រឿងនេះជាមួយ។ តើបណ្ណាល័យ Bluebird, Request, Axios ធ្វើអ្វី?

- ពួកគេគឺជាបណ្ណាល័យដើម្បីអនុវត្ត XMLHttpRequests ដែលត្រលប់មកវិញនូវការសន្យា។

តើវិធីសាស្រ្ដ AJAX របស់ jQuery ចាប់ផ្តើមត្រលប់មកវិញនូវការសន្យាដែរឬទេ?

- យើងមិនប្រើពាក្យ "J" ក្នុងឆ្នាំ 2016 ទៀតទេ។ គ្រាន់តែប្រើ Fetch ហើយបំពេញវានៅពេលដែលវាមិននៅក្នុងកម្មវិធីរុករក ឬប្រើ Bluebird, Request ឬ Axios ជំនួសវិញ។ បន្ទាប់មកគ្រប់គ្រងការសន្យាជាមួយនឹងការរង់ចាំនៅក្នុងមុខងារ async និងការរីកចំរើន អ្នកមានលំហូរគ្រប់គ្រងត្រឹមត្រូវ។

វា​ជា​លើក​ទី​បី​ហើយ​ដែល​អ្នក​រង់ចាំ ប៉ុន្តែ​ខ្ញុំ​មិន​ដឹង​ថា​វា​ជា​អ្វី​ទេ។

-Await អនុញ្ញាត​ឱ្យ​អ្នក​ទប់ស្កាត់​ការ​ហៅ​ទូរសព្ទ​អសមកាល ដែល​អនុញ្ញាត​ឱ្យ​អ្នក​មាន​ការ​គ្រប់គ្រង​បាន​កាន់​តែ​ប្រសើរ​នៅ​ពេល​ដែល​ទិន្នន័យ​កំពុង​ត្រូវ​បាន​ទាញ​យក និង​ការ​បង្កើន​ការ​អាន​កូដ​ជារួម។ វាអស្ចារ្យណាស់ អ្នកគ្រាន់តែត្រូវប្រាកដថាអ្នកបន្ថែមការកំណត់ជាមុនដំណាក់កាល-3 នៅក្នុង Babel ឬប្រើវាក្យសម្ព័ន្ធ- async-functions និង transform-async-to-generator plugin ។

នេះគឺឆ្កួត។

- ទេ ឆ្កួតគឺជាការពិតដែលថាអ្នកត្រូវចងក្រងកូដ Typescript ជាមុនហើយបន្ទាប់មកចម្លងវាជាមួយ Babel ដើម្បីប្រើរង់ចាំ។

អ្វី? វាមិនត្រូវបានបញ្ចូលក្នុង Typescript ទេ?

- វាធ្វើនៅក្នុងកំណែបន្ទាប់ ប៉ុន្តែសម្រាប់កំណែ 1.7 វាកំណត់គោលដៅតែ ES6 ប៉ុណ្ណោះ ដូច្នេះប្រសិនបើអ្នកចង់ប្រើ រង់ចាំនៅក្នុងកម្មវិធីរុករកដំបូង អ្នកត្រូវចងក្រងកូដ Typescript របស់អ្នកដែលកំណត់គោលដៅ ES6 ហើយបន្ទាប់មក Babel ដែលអាក្រក់រហូតដល់គោលដៅ ES5 ។

ត្រង់​ចំណុច​នេះ ខ្ញុំ​មិន​ដឹង​ថា​ត្រូវ​និយាយ​យ៉ាង​ណា​ទេ។

- មើលវាងាយស្រួល។ សរសេរកូដអ្វីគ្រប់យ៉ាងនៅក្នុង Typescript ។ ម៉ូឌុលទាំងអស់ដែលប្រើ Fetch ចងក្រងពួកវាដើម្បីកំណត់គោលដៅ ES6 ចម្លងពួកវាជាមួយ Babel នៅលើការកំណត់ជាមុនដំណាក់កាល-3 ហើយផ្ទុកពួកវាជាមួយ SystemJS ។ ប្រសិនបើអ្នកមិនមាន Fetch, polyfill វា ឬប្រើ Bluebird, Request ឬ Axios ហើយដោះស្រាយរាល់ការសន្យារបស់អ្នកដោយរង់ចាំ។

យើងមាននិយមន័យផ្សេងគ្នានៃភាពងាយស្រួល។ ដូច្នេះហើយ ជាមួយនឹងពិធីនោះ ទីបំផុតខ្ញុំបានទាញយកទិន្នន័យ ហើយឥឡូវនេះខ្ញុំអាចបង្ហាញវាជាមួយនឹង React មែនទេ?

- តើកម្មវិធីរបស់អ្នកនឹងដោះស្រាយការផ្លាស់ប្តូររដ្ឋទេ?

បាទ ខ្ញុំមិនគិតដូច្នេះទេ។ ខ្ញុំគ្រាន់តែត្រូវការបង្ហាញទិន្នន័យ។

- អូ អរគុណព្រះ។ បើមិនដូច្នោះទេខ្ញុំត្រូវតែពន្យល់អ្នក Flux និងការអនុវត្តដូចជា Flummox, Alt, Fluxible ។ ទោះបីជានិយាយដោយស្មោះត្រង់អ្នកគួរតែប្រើ Redux ។

ខ្ញុំនឹងហោះពីលើឈ្មោះទាំងនោះ។ ជាថ្មីម្តងទៀត ខ្ញុំគ្រាន់តែត្រូវការបង្ហាញទិន្នន័យប៉ុណ្ណោះ។

-អូ! ប្រសិនបើអ្នកគ្រាន់តែបង្ហាញទិន្នន័យ អ្នកមិនត្រូវការ React ដើម្បីចាប់ផ្តើមជាមួយ។ អ្នកប្រហែលជាល្អជាមួយម៉ាស៊ីនគំរូ។

តើអ្នកកំពុងលេងសើចទេ? តើអ្នកគិតថានេះជារឿងកំប្លែងទេ? តើ​អ្នក​ប្រព្រឹត្ត​ចំពោះ​មនុស្ស​ជា​ទី​ស្រឡាញ់​របស់​អ្នក​ឬ?

- ខ្ញុំគ្រាន់តែពន្យល់ពីអ្វីដែលអ្នកអាចប្រើបាន។

ឈប់។ គ្រាន់តែឈប់។

- ខ្ញុំចង់និយាយថា ទោះបីជាវាគ្រាន់តែប្រើម៉ាស៊ីនគំរូក៏ដោយ ខ្ញុំនៅតែប្រើបន្សំ Typescript + SystemJS + Babel ប្រសិនបើខ្ញុំជាអ្នក។

ខ្ញុំត្រូវបង្ហាញទិន្នន័យនៅលើទំព័រមួយ មិនមែនអនុវត្តការស្លាប់របស់ MK ដើមរបស់ Sub Zero ទេ។ គ្រាន់តែប្រាប់ខ្ញុំថាតើម៉ាស៊ីនគំរូណាដែលត្រូវប្រើ ហើយខ្ញុំនឹងយកវាពីទីនោះ។

- មានច្រើនណាស់ តើអ្នកស្គាល់មួយណា?

អូ មិនអាចចាំឈ្មោះបានទេ។ វា​ជា​យូរ​មក​ហើយ​។

-jTemplates? jQote? សុទ្ធ?

ខុស មិន​ចុច​កណ្ដឹង​ទេ។ មួយទៀត?

-តម្លាភាព? JSRender? MarkupJS? KnockoutJS? មួយនោះមានការចងពីរផ្លូវ។

មួយទៀត?

-PlatesJS? jQuery-tmpl? ដៃកាន់? មនុស្សមួយចំនួននៅតែប្រើវា។

ប្រហែល។ តើ​មាន​លក្ខណៈ​ស្រដៀង​នឹង​រឿង​ចុង​ក្រោយ​នេះ​ដែរ​ឬ​ទេ?

- ពុកមាត់, គូសបញ្ជាក់? ខ្ញុំគិតថាឥឡូវនេះសូម្បីតែ lodash មានមួយដែលត្រូវតែស្មោះត្រង់, ប៉ុន្តែវាគឺជាប្រភេទនៃ 2014 ។

ខុស.. ប្រហែលជាវាថ្មីជាងនេះ។

- ជេដ? DustJS?

ទេ

- DotJS? EJS?

ទេ

-Nunjucks? ECT?

ទេ

-Mah គ្មាននរណាម្នាក់ចូលចិត្តវាក្យសម្ព័ន្ធ Coffeescript ទេ។ Jade?

ទេ អ្នកបាននិយាយរួចហើយថា Jade ។

- ខ្ញុំមានន័យថា Pug ។ ខ្ញុំមានន័យថា Jade ។ ខ្ញុំចង់និយាយថា Jade ឥឡូវនេះគឺ Pug ។

ដកដង្ហើមធំ។ ទេ មិនអាចចាំបានទេ។ តើអ្នកនឹងប្រើមួយណា?

- ប្រហែលគ្រាន់តែជាខ្សែអក្សរគំរូដើម ES6 ប៉ុណ្ណោះ។

ឱ្យខ្ញុំទាយ។ ហើយវាទាមទារ ES6 ។

- ត្រឹមត្រូវ។

ដែលអាស្រ័យលើកម្មវិធីរុករកដែលខ្ញុំកំពុងប្រើត្រូវការ Babel ។

- ត្រឹមត្រូវ។

ដែលប្រសិនបើខ្ញុំចង់បញ្ចូលដោយមិនបន្ថែមបណ្ណាល័យស្នូលទាំងមូល ខ្ញុំត្រូវផ្ទុកវាជាម៉ូឌុលពី npm ។

- ត្រឹមត្រូវ។

ដែលទាមទារ Browserify ឬ Wepback ឬភាគច្រើនហៅថា SystemJS។

- ត្រឹមត្រូវ។

ដែលលើកលែងតែវាជា Webpack តាមឧត្ដមគតិគួរតែត្រូវបានគ្រប់គ្រងដោយអ្នករត់ភារកិច្ច។

- ត្រឹមត្រូវ។

ប៉ុន្តែ ដោយសារ​ខ្ញុំ​គួរ​ប្រើ​កម្មវិធី​មុខងារ និង​ភាសា​វាយ​បញ្ចូល​ដំបូង ខ្ញុំ​ត្រូវ​ចងក្រង Typescript ជាមុន ឬ​បន្ថែម Flow thingy នេះ។

- ត្រឹមត្រូវ។

ហើយបន្ទាប់មកផ្ញើវាទៅ Babel ប្រសិនបើខ្ញុំចង់ប្រើរង់ចាំ។

- ត្រឹមត្រូវ។

ដូច្នេះខ្ញុំអាចប្រើ Fetch, សន្យា និងគ្រប់គ្រងលំហូរ និងវេទមន្តទាំងអស់នោះ។

-គ្រាន់តែកុំភ្លេច polyfill Fetch ប្រសិនបើវាមិនត្រូវបានគាំទ្រ Safari នៅតែមិនអាចដោះស្រាយវាបាន។

អ្នកដឹងពីអ្វី។ ខ្ញុំគិតថាយើងបានបញ្ចប់នៅទីនេះ។ តាមពិតទៅ ខ្ញុំគិតថាខ្ញុំរួចរាល់ហើយ។ ខ្ញុំបានបញ្ចប់ជាមួយគេហទំព័រ ខ្ញុំបានបញ្ចប់ជាមួយ JavaScript ទាំងអស់គ្នា។

- មិនអីទេ ក្នុងរយៈពេលពីរបីឆ្នាំទៀត យើងទាំងអស់គ្នានឹងសរសេរកូដនៅក្នុង Elm ឬ WebAssembly ។

ខ្ញុំគ្រាន់តែនឹងផ្លាស់ទីទៅផ្នែកខាងក្រោយ។ ខ្ញុំគ្រាន់តែមិនអាចដោះស្រាយការផ្លាស់ប្ដូរ និងកំណែ និងការបោះពុម្ព និងការចងក្រង និងឧបករណ៍បំប្លែងសារទាំងនេះបានទេ។ សហគមន៍ JavaScript គឺឆ្កួតប្រសិនបើវាគិតថានរណាម្នាក់អាចបន្តជាមួយនេះ។

- ខ្ញុំឮអ្នក។ អ្នកគួរតែសាកល្បងសហគមន៍ Python បន្ទាប់មក។

ហេតុអ្វី?

- ធ្លាប់លឺ Python 3 ទេ?

អាប់ដេត៖ អរគុណសម្រាប់ការចង្អុលកំហុស និងកំហុស ខ្ញុំនឹងធ្វើបច្ចុប្បន្នភាពអត្ថបទដូចដែលបានកត់សម្គាល់។ ការពិភាក្សានៅក្នុង HackerNews និង Reddit ។