តម្លៃ Variable និង Type

មាតិកា

1. តម្លៃ និង Variable
2. const និង let
3. ហេតុអ្វីមិនប្រើ var
4. Primitive Type
5. String និង Template String
6. typeof, null និង undefined
7. អន្ទាក់នៃ Coercion
8. សាកល្បងដោយខ្លួនឯង

1. តម្លៃ និង Variable

តម្លៃ (value) គឺជាទិន្នន័យមួយដុំ៖ លេខ 42 អត្ថបទ "Dara" ចម្លើយ true។ Variable គឺជាឈ្មោះដែលចង្អុលទៅតម្លៃមួយ ដើម្បីឲ្យអ្នកអាចប្រើវាម្តងទៀតនៅពេលក្រោយ។ គិតដល់ប្រអប់ដែលមានស្លាក៖ ស្លាកគឺជាឈ្មោះ ហើយអ្វីដែលនៅខាងក្នុងគឺជាតម្លៃ។

បង្កើត file js/values.js ហើយដំណើរការវាដោយ node js/values.js ពេលអ្នកអាន។ នេះជាគំនិតទាំងមូលក្នុងបីបន្ទាត់៖

const name = "Dara Sok";
const age = 22;
console.log(name, age);

វាបោះពុម្ព Dara Sok 22។ ពាក្យ const បង្កើត variable, name ជាស្លាករបស់វា, = ផ្ទុកតម្លៃនៅខាងស្តាំចូលទៅក្នុងឈ្មោះនៅខាងឆ្វេង ហើយ ; បញ្ចប់ statement។ សញ្ញា = នៅទីនេះគឺជា assignment (ការផ្តល់តម្លៃ) មិនមែន "ស្មើ" ដូចក្នុងគណិតវិទ្យាទេ។

ឈ្មោះ variable អាចមានអក្សរ ខ្ទង់លេខ _ និង $ ប៉ុន្តែមិនអាចចាប់ផ្តើមដោយខ្ទង់លេខ ហើយមិនអាចជាពាក្យបម្រុងទុកដូចជា const បានទេ។ តាមទម្លាប់ JavaScript ប្រើ camelCase៖ firstName, projectCount។ ឈ្មោះប្រកាន់អក្សរតូចធំ ដូច្នេះ age និង Age ជា variable ផ្សេងគ្នា។

2. const និង let

JavaScript មានវិធីទំនើបពីរដើម្បីបង្កើត variable៖

const city = "Phnom Penh";
let projectCount = 3;

projectCount = 4;      // បាន៖ let អាចផ្លាស់ប្តូរ
console.log(projectCount); // 4

city = "Siem Reap";    // TypeError: Assignment to constant variable.

ដំណើរការវា ហើយបន្ទាត់ចុងក្រោយនឹងបញ្ឈប់កម្មវិធីដោយ TypeError។ នោះមានប្រយោជន៍៖ កំហុសប្រាប់អ្នកថាអ្នកបានព្យាយាមផ្លាស់ប្តូរអ្វីដែលត្រូវនៅថេរ។

ទម្លាប់ល្អ៖ ចាប់ផ្តើមដោយ const ហើយប្តូរទៅ let តែនៅពេលអ្នកឃើញថាតម្លៃត្រូវផ្លាស់ប្តូរប៉ុណ្ណោះ។ កូដងាយអានជាងនៅពេលឈ្មោះភាគច្រើនមិនប្រែប្រួល។

ចំណាំថា const ការពារ ការ assign ឡើងវិញ មិនមែនគ្រប់ប្រភេទនៃការផ្លាស់ប្តូរទេ។ នៅពេល const ចង្អុលទៅ array ឬ object អ្នកនៅតែអាចផ្លាស់ប្តូរអ្វីដែលនៅខាងក្នុងវាបាន។ ជំពូកទី 6 ពន្យល់រឿងនេះ។

3. ហេតុអ្វីមិនប្រើ var

កូដចាស់ប្រើ keyword ទីបីគឺ var។ អ្នកនឹងឃើញវាក្នុងមេរៀនចាស់ៗ ដូច្នេះអ្នកគួរស្គាល់វា ប៉ុន្តែអ្នកមិនគួរសរសេរវាទេ។ វាមានឥរិយាបថដែលធ្វើឲ្យភ្ញាក់ផ្អើល៖

if (true) {
  var leaked = "I am visible outside the block";
}
console.log(leaked); // ដំណើរការ ដែលគួរឲ្យភ្ញាក់ផ្អើល

if (true) {
  let contained = "I stay inside the block";
}
console.log(contained); // ReferenceError: contained is not defined

var មិនអើពើនឹងដង្កៀបអង្កាញ់ { } របស់ block ដូច្នេះ variable អាច "លេចធ្លាយ" ទៅកូដដែលមិនគួរឃើញវា។ let និង const ជា block scoped៖ ពួកវាមានតែនៅក្នុង { } ដែលអ្នកបង្កើតវាប៉ុណ្ណោះ។ ជំពូកទី 5 គ្របដណ្តប់ scope លម្អិតជាងនេះ។ ច្បាប់សម្រាប់ស៊េរីនេះសាមញ្ញ៖ ប្រើ const និង let កុំប្រើ var។

4. Primitive Type

គ្រប់តម្លៃមាន type។ Type សាមញ្ញបំផុតត្រូវបានហៅថា primitive៖ តម្លៃតែមួយ ដែលមិនអាចផ្លាស់ប្តូរបាន។

អ្នកនឹងប្រើប្រាំដំបូងជាប្រចាំ។ bigint សម្រាប់ចំនួនគត់ធំខ្លាំង អ្នកសរសេរវាដោយមាន n នៅចុង។ symbol ភាគច្រើនត្រូវបានប្រើដោយ library ដូច្នេះអ្នកអាចរំលងវាសិនបាន។

JavaScript មាន type តែមួយសម្រាប់លេខធម្មតា។ ចំនួនគត់ និងទសភាគសុទ្ធតែជា number ដូច្នេះមិនមាន type "integer" ដាច់ដោយឡែកឲ្យជ្រើសទេ។

តម្លៃដែលមិនមែនជា primitive គឺជា object ដូចជា array និងកំណត់ត្រា។ ពួកវាមានជំពូកផ្ទាល់ខ្លួន (ជំពូកទី 6)។

5. String និង Template String

String គឺជាអត្ថបទក្នុងសញ្ញាសម្រង់។ ស៊េរីនេះប្រើសញ្ញាសម្រង់ទ្វេ៖

const greeting = "Hello";
const length = greeting.length;       // 5
const loud = greeting.toUpperCase();  // "HELLO"
console.log(length, loud);

ដើម្បីបូកអត្ថបទជាមួយតម្លៃ អ្នកអាចប្រើ +៖

const firstName = "Dara";
const projects = 3;
console.log("Hi, " + firstName + "! You have " + projects + " projects.");

វាដំណើរការ ប៉ុន្តែឆាប់ពិបាកអាន។ Template string ងាយស្រួលជាង។ វាប្រើ backtick (`, ជាធម្មតាជាគ្រាប់ចុចនៅខាងឆ្វេងនៃ 1) ហើយដាក់ variable ក្នុង ${ }៖

console.log(`Hi, ${firstName}! You have ${projects} projects.`);

ទាំងពីរបន្ទាត់បោះពុម្ព Hi, Dara! You have 3 projects. អ្នកអាចដាក់ expression ណាមួយក្នុង ${ } ដូចជា ${projects + 1}។ Template string ក៏អាចលាតសន្ធឹងច្រើនបន្ទាត់ ដែលមានប្រយោជន៍នៅពេលក្រោយ សម្រាប់បង្កើត HTML។

6. typeof, null និង undefined

Operator typeof ប្រាប់អ្នកពី type នៃតម្លៃមួយ៖

console.log(typeof "Dara");     // "string"
console.log(typeof 42);         // "number"
console.log(typeof true);       // "boolean"
console.log(typeof undefined);  // "undefined"
console.log(typeof 10n);        // "bigint"
console.log(typeof null);       // "object"  <-- កំហុសដ៏ល្បីមួយ

បន្ទាត់ចុងក្រោយនោះគឺជា bug ពី JavaScript កំណែដំបូងក្នុងឆ្នាំ 1995។ ឥឡូវវាមិនអាចកែបានទេ ដោយមិនធ្វើឲ្យគេហទំព័រចាស់ៗខូច។ ចងចាំថា null មិនមែន ជា object ទេ ទោះបី typeof និយាយដូច្នោះក៏ដោយ។

null និង undefined ទាំងពីរមានន័យថា "គ្មានតម្លៃ" ប៉ុន្តែត្រូវបានប្រើខុសគ្នា៖

• undefined គឺជាអ្វីដែល JavaScript ផ្តល់ឲ្យអ្នកនៅពេលតម្លៃបាត់។ Variable ដែលប្រកាសដោយគ្មានតម្លៃ property របស់ object ដែលបាត់ និង function ដែលមិនត្រឡប់អ្វី សុទ្ធតែផ្តល់ undefined។
• null គឺជាអ្វីដែល អ្នក សរសេរ នៅពេលអ្នកចង់និយាយថា "ដោយចេតនា គ្មានអ្វីនៅទីនេះ"។

let nickname;
console.log(nickname); // undefined: មិនទាន់ assign តម្លៃ

nickname = null;
console.log(nickname); // null: យើងសម្រេចថាគ្មានឈ្មោះហៅក្រៅ

ច្បាប់សាមញ្ញ៖ ទុកឲ្យ JavaScript បង្កើត undefined ហើយប្រើ null តែនៅពេលអ្នកជ្រើសរើសបង្ហាញតម្លៃទទេប៉ុណ្ណោះ។

7. អន្ទាក់នៃ Coercion

ពេលខ្លះ JavaScript នឹងបំប្លែងតម្លៃពី type មួយទៅមួយទៀត ដើម្បីឲ្យប្រតិបត្តិការមួយដំណើរការ។ នេះហៅថា coercion។ វាងាយស្រួល ប៉ុន្តែអាចបង្កើតការភ្ញាក់ផ្អើល។ ដឹងបួនយ៉ាងនេះ៖

1. Operator + ភ្ជាប់អត្ថបទ ប្រសិនបើម្ខាងណាមួយជា string។

console.log("5" + 1);  // "51"  (អត្ថបទ មិនមែន 6)
console.log("5" - 1);  // 4     (ដក បំប្លែង "5" ទៅជាលេខ)

2. ការគណនាទសភាគមិនត្រឹមត្រូវពិតប្រាកដទេ។ កុំព្យូទ័ររក្សាទុកទសភាគជាគោលពីរ ហើយតម្លៃខ្លះមិនអាចរក្សាទុកបានយ៉ាងត្រឹមត្រូវទេ។ នេះពិតស្ទើរតែគ្រប់ភាសា មិនមែនតែ JavaScript ប៉ុណ្ណោះទេ៖

console.log(0.1 + 0.2);           // 0.30000000000000004
console.log(0.1 + 0.2 === 0.3);   // false

សម្រាប់ប្រាក់ អ្នកអភិវឌ្ឍច្រើនរក្សាទុកជាសេនទាំងមូល (1999 សម្រាប់ $19.99) ហើយបំប្លែងនៅចុងបញ្ចប់។

3. NaN មានន័យថា "Not a Number" (មិនមែនលេខ)។ អ្នកទទួលបានវានៅពេលការគណនាមួយគ្មានន័យ។ Type របស់វានៅតែជា number ហើយវាមិនស្មើនឹងខ្លួនឯងផង៖

const result = Number("hello");
console.log(result);                 // NaN
console.log(typeof result);          // "number"
console.log(result === NaN);         // false
console.log(Number.isNaN(result));   // true  <-- វិធីត្រឹមត្រូវដើម្បីពិនិត្យ

4. បំប្លែងដោយចេតនា មិនមែនដោយចៃដន្យ។ ប្រើ function ទាំងនេះ ជំនួសឲ្យការពឹងលើ coercion៖

console.log(Number("42"));      // 42
console.log(Number(""));        // 0
console.log(parseInt("42px"));  // 42
console.log(String(42));        // "42"
console.log(Boolean(""));       // false

ប្រើ Number() នៅពេលអត្ថបទទាំងមូលគួរជាលេខ ហើយប្រើ parseInt() នៅពេលលេខនៅដើមអត្ថបទផ្សេងទៀត។ នៅពេលទិន្នន័យមកពីវាលក្នុង form វាជា string ជានិច្ច ដូច្នេះត្រូវបំប្លែងវាមុនពេលធ្វើនព្វន្ត។

8. សាកល្បងដោយខ្លួនឯង

1. ប្រកាស និងបោះពុម្ព។ ក្នុង js/values.js បង្កើត variable const សម្រាប់ឈ្មោះរបស់អ្នក អាយុរបស់អ្នក និងថាតើអ្នកជានិស្សិតឬអត់ (boolean)។ បោះពុម្ពទាំងបីដោយ console.log តែមួយ។
2. ជួបកំហុស។ ប្រកាស const country = "Cambodia"; ហើយព្យាយាម assign តម្លៃថ្មីទៅវា។ អានកំហុស។ បន្ទាប់មកប្តូរ const ទៅ let ហើយមើលកំហុសបាត់។
3. ប្រើ template string។ បង្កើតប្រយោគ Dara Sok lives in Phnom Penh and has 3 projects. ពី variable បី ដោយប្រើ template string តែមួយ បន្ទាប់មកធ្វើម្តងទៀតដោយ + ហើយប្រៀបធៀប។
4. ពិនិត្យ type។ បោះពុម្ព typeof សម្រាប់ "7", 7, 7n, null, undefined និង []។ លទ្ធផលមួយណាធ្វើឲ្យអ្នកភ្ញាក់ផ្អើល?
5. ទាយ ហើយដំណើរការ។ ដោយមិនដំណើរការ ទាយលទ្ធផលនៃ "3" + 4, "3" * 4, true + 1 និង Number("12abc")។ ដំណើរការវា ហើយពន្យល់ចម្លើយនីមួយៗ។
6. ដោះស្រាយបញ្ហាទសភាគ។ បង្ហាញថា 0.1 + 0.2 === 0.3 គឺ false។ បន្ទាប់មកប្រៀបធៀប Math.abs(0.1 + 0.2 - 0.3) < Number.EPSILON ហើយពន្យល់ក្នុងមួយប្រយោគថាតើការប្រៀបធៀបនេះពិនិត្យអ្វី។

បន្ទាប់ យើងនឹងធ្វើការសម្រេចចិត្តជាមួយតម្លៃទាំងនេះ៖ ប្រៀបធៀបពួកវា ផ្សំលក្ខខណ្ឌ និងដំណើរការកូដខុសៗគ្នាតាមលទ្ធផល។ បន្តជាមួយ Operator និងលក្ខខណ្ឌ។