Download as pptx, pdf, or txt
Download as pptx, pdf, or txt
You are on page 1of 24

ម៉ា ស្ទ័រអាយធី

វគ្គ៖ JAVASCRIPT FROM BEGGINER TO ADVANCED

លោកគ្រូ៖ ផេងពុទ្ធា រិទ្ធ

MASTERIT CAMBODIA JAVASCRIPT BEGINNER TO ADVANCED


អំពី JAVASCRIPT

វគ្គសិក្សា JavaScript from beginner to advanced​ របស់សាលាម៉ា ស្ទ័រអាយធីជាវគ្គសិក្សាស្តីអំពី


មូលដ្ឋា នគ្រឹះនៅក្នុង Web Development។ នៅក្នុង Web Development ត្រូវបានគេបែងចែកជាពីរ
គឺ Front-end និង Back-end ដែល​ Frameworks​​ យកមកប្រើសំរាប់ Front-end​ និង Back-end
មានដូចជា Angular.JS Vue.JS React.JS​​Node.JS​( ដើម្បីបង្កើតបានជា Website​ស្តង់ដារ ) ដែល
ទំាងអស់នេះសុទ្ធតែជា Frameworks​​ របស់​ JavaScript ទំាងអស់។ លើសពីនេះយើងអាចប្រើ
JavaScript Frameworks ផេ្សងទៀតដើម្បីបង្កើត Desktop Application ( Electron.JS )​ ​ និង
Mobile application ( React Native​)។​

MASTERIT CAMBODIA JAVASCRIPT BEGINNER TO ADVANCED


លទ្ធផលនៃការសិក្សាវគ្គសិក្សា JAVASCRIPT

១. ចេះមូលដ្ឋា នគ្រឹះដល់ advanced features របស់ JavaScript

២. ចេះទំាងទ្រឹស្តីនិងការអនុវត្តន៍លំហាត់

៣. អនុវត្តន៍ Bank transaction ( ដកនិងដាក់លុយ នៅលើផ្ទាំង Console )

៤. ចេះប្រើប្រាស់ Online IDE ដោយពុំចាំបាច់ដំឡើងកម្មវិធីអ្វីទាំងអស់នៅលើកុំព្យូទ័រ

៥. មានមូលដ្ឋា នគ្រឹះអាចបន្តទៅផ្នែក Front-end​ឬ Back-end​ឬ ទាំងពីរក៏បាន

៦. មានសមត្ថភាពគ្រប់គ្រាន់ និងទំនុកចិត្តដើម្បីបន្តចាប់យក Frameworks របស់ ​JavaScript

MASTERIT CAMBODIA JAVASCRIPT BEGINNER TO ADVANCED


ជំពូកទី១ មូលដ្ឋា នគ្រឹះ Beginner

MASTERIT CAMBODIA JAVASCRIPT BEGINNER TO ADVANCED


មេរៀនទី៣ គុណភាពរបស់កូដ Code quality

១. Coding style

គោលការណ៍ សរសេរកូដដែលអ្នកសរសេរកូដទំាងអស់គួរគោរពតាម
គឺការ សរសេរកូដរបស់យើង ត្រូវមានរបៀបរៀបរយហើយ
ងាយស្រួលក្នុងការ មើល ( read ) សម្រាប់ទំាងខ្លួនឯង និងអ្នក
សរសេរកូដផ្សេងទៀត។

MASTERIT CAMBODIA JAVASCRIPT BEGINNER TO ADVANCED


MASTERIT CAMBODIA JAVASCRIPT BEGINNER TO ADVANCED
១.១ Curly braces

ការប្រើប្រាស់ curly braces ឱ្យស្របតាមក្បួន។​

• Not good ☹

if (x == 1) console.log("x: ", x);

 Not good ☹
if (x == 1)
console.log("x: ", x);

MASTERIT CAMBODIA JAVASCRIPT BEGINNER TO ADVANCED


• Not good ☹

if (x == 1) { console.log("x: ", x); }

• Good 😊

if (x == 1) {

console.log("x: ", x);

MASTERIT CAMBODIA JAVASCRIPT BEGINNER TO ADVANCED


១.២ ប្រវែងកូដក្នុងមួយជួរដេក

បើយើងសរសេរកូដវែងក្នុងមួយជួរដេកៗគឺពិបាកមើលទំាងគេទំាងយើង ដូចនេះយើង

សរសេរកុំឱ្យ វែងពេកបើ text នោះវែងយើងគួរចុះបន្ទា ប់។

ចំណំា៖ បើយើងប្រើ single quotes (‘ ’) ឬ double quotes (“ ”) ហើយចុះបន្ទា ត់នោះនឹងមាន

Error ។ ដំណោះស្រាយគឺយើងត្រូវប្រើ backtick quotes (` `)។

MASTERIT CAMBODIA JAVASCRIPT BEGINNER TO ADVANCED


• Not good ☹

console.log("Lorem ipsum dolor sit amet, consectetur adipisicing elit. Lore");

• Error ☹

console.log("Lorem ipsum dolor sit amet, consectetur adipisicing elit.


Aspernatur, quasi? Vel consequatur sunt, necessitatibus aliquid
delectus asperiores eos");

MASTERIT CAMBODIA JAVASCRIPT BEGINNER TO ADVANCED


• Good 😊

console.log(`

Lorem ipsum dolor sit amet consectetur

adipisicing elit. Unde aliquam voluptatibus

iusto labore adipisci, sint consequuntur

`);

MASTERIT CAMBODIA JAVASCRIPT BEGINNER TO ADVANCED


១.៣ ការចូលបន្ទា ត់ ( Indents )
• ការចូលបន្ទា ត់ជួរដេក ( Horizontal indents ) ២ ឬ ៤ space ឬក៏ ១ tab

function sum(a, b) {

return a + b; // ត្រង់មួយជួរនេះគឺយើងចូលបន្ទា ត់មួយ tab

MASTERIT CAMBODIA JAVASCRIPT BEGINNER TO ADVANCED


• ការចុះបន្ទា ត់ជួរឈរ

function sum(a, b) {

return a + b;

<= ទុកចន្លោះមួយបន្ទា ត់

console.log("Sum: ", sum(12, 3));

MASTERIT CAMBODIA JAVASCRIPT BEGINNER TO ADVANCED


១.៤ Semicolons ( ; )
By default JavaScript នឹងធ្វើការដាក់ semicolons នៅត្រង់ចំនុច line break។
ប៉ុន្តែយើង គប្បីប្រើ semicolons ( ; ) រាល់ line break ដោយខ្លួនឯងជៀសវាងមាន Error
ដែលពិបាកនឹង ស្វែងរក។

MASTERIT CAMBODIA JAVASCRIPT BEGINNER TO ADVANCED


MASTERIT CAMBODIA JAVASCRIPT BEGINNER TO ADVANCED
១.៥ Nesting levels
Nesting levels ច្រើនតែកើតមាននៅពេលដែលយើងប្រើប្រាស់​ if statement, loop ។
ល។

វាអាចបង្កជាភាពស្មុគស្មា ញទៅវិញក្នុងការដោះស្រាយអ្វីមួយប្រសិនអនុវត្តដូច
ខាងក្រោម៖

MASTERIT CAMBODIA JAVASCRIPT BEGINNER TO ADVANCED


• គប្បីជៀសវាង ☹

if ( x > 0) {

if (x == y) {

if (x > z) {

... block code

MASTERIT CAMBODIA JAVASCRIPT BEGINNER TO ADVANCED


• គប្បីជៀសវាងប្រសិនជាអាច ☹

for (let i = 0; i < 100; i++) {

for (let j = 1; j < i; j++) {

if (j == null) {

return ...

MASTERIT CAMBODIA JAVASCRIPT BEGINNER TO ADVANCED


២. ការប្រើប្រាស់ comments

ជាទូទៅយើងប្រើប្រាស់ comments ដើម្បីពិពណ៌ នាអំពីដំណើ រការរបស់កូដ។


Comments មាន ដូចជា៖

single-line : //

multi-line : /* … */ និង <!-- … -->

MASTERIT CAMBODIA JAVASCRIPT BEGINNER TO ADVANCED


២.១ Bad comments
// កូដនេះសម្រាប់គណនានេះ​ហើយផ្ទេរទៅឱ្យ (...) ហើយទទួលបានបែប (...)

// ... នៅពេលមួយខែក្រោយមក មកមើលខ្លួនឯងក៏អត់យល់

… block code

MASTERIT CAMBODIA JAVASCRIPT BEGINNER TO ADVANCED


២.២ Good comments
/*

* Returns x ស្វ័យគុណ n-th។

* @parameter {number} x គឺជាតួលេខដែលត្រូវបង្កើន។

* @parameter {number} n គឺជាស្វ័យគុណហើយត្រូវតែជាលេខ។

* @return {number} x ស្វ័យគុណ n-th។

*/

MASTERIT CAMBODIA JAVASCRIPT BEGINNER TO ADVANCED


function pow(x, n) {

... block code

ចំណំា៖ ការដាក់ឈ្មោះឱ្យអញ្ញ ត្តិឬ functions, classes ។ល។​គឺសុទ្ធសឹងជាការ comments។

let email = "example@gmail.com";

let password = "@9os3023l";

function login() {

... block code

MASTERIT CAMBODIA JAVASCRIPT BEGINNER TO ADVANCED


សេចក្តីសង្ខេបរួមមេរៀនទី៣

នៅក្នុងមេរៀនទី៣នេះយើងបានសិក្សាអំពីការសរសេរកូដឱ្យមានសណ្តា ប់ធ្នា ប់
ងាយ ស្រួលអានទំាងអ្នកដទៃ និងខ្លួនយើង។

MASTERIT CAMBODIA JAVASCRIPT BEGINNER TO ADVANCED


សូមអរគុណ!

MASTERIT CAMBODIA JAVASCRIPT BEGINNER TO ADVANCED

You might also like