msb-public
/
30-Days-Of-JavaScript
mirror of https://github.com/Asabeneh/30-Days-Of-JavaScript
1
0
Code Issues Projects Releases Wiki Activity

Translated day 6 till day 10

Browse Source
pull/803/head
Hongsreng-P 2 years ago
parent 1b9f1259f6
commit c4a974937f
5 changed files with 2933 additions and 0 deletions
Show Stats Download Patch File Download Diff File

484
Khmer/06_Day_Loops/06_day_loops.md
Unescape View File

@ -0,0 +1,484 @@
<div align="center">
<h1> 30 ថ្ងៃនៃ JavaScript: Loops</h1>
<a class="header-badge" target="_blank" href="https://www.linkedin.com/in/asabeneh/">
<img src="https://img.shields.io/badge/style--5eba00.svg?label=LinkedIn&logo=linkedin&style=social">
</a>
<a class="header-badge" target="_blank" href="https://twitter.com/Asabeneh">
<img alt="Twitter Follow" src="https://img.shields.io/twitter/follow/asabeneh?style=social">
</a>
<sub>អ្នកនិពន្ធ:
<a href="https://www.linkedin.com/in/asabeneh/" target="_blank">Asabeneh Yetayeh</a><br>
<small> ខែមករា ឆ្នាំ ២០២០</small>
</sub>
</div>
[<< ថ្ងៃទី 5](../05_Day_Arrays/05_day_arrays.md) | [ថ្ងៃទី 7 >>](../07_Day_Functions/07_day_functions.md)
![ថ្ងៃទី 5](../images/banners/day_1_6.png)
- [📔 ថ្ងៃទី 6](#-day-6)
- [Loops](#loops)
- [for Loop](#for-loop)
- [while loop](#while-loop)
- [do while loop](#do-while-loop)
- [for of loop](#for-of-loop)
- [break](#break)
- [continue](#continue)
- [💻 លំហាត់៖ ថ្ងៃទី ៦](#-exercisesday-6)
- [លំហាត់៖ កម្រិត ១](#exercises-level-1)
- [លំហាត់៖ កម្រិត ២](#exercises-level-2)
- [លំហាត់៖ កម្រិត ៣](#exercises-level-3)
# 📔 ថ្ងៃទី 6
## Loops
សកម្មភាពភាគច្រើនដែលយើងធ្វើក្នុងជីវិតគឺពោរពេញដោយពាក្យដដែលៗ។ ស្រមៃមើលប្រសិនបើខ្ញុំសុំឱ្យអ្នកបោះពុម្ពពី 0 ទៅ 100 ដោយប្រើ console.log() ។ ដើម្បីអនុវត្តកិច្ចការដ៏សាមញ្ញនេះ វាអាចចំណាយពេលអ្នកពី 2 ទៅ 5 នាទី កិច្ចការដែលធុញទ្រាន់ និងដដែលៗអាចត្រូវបានអនុវត្តដោយប្រើ loop។ ប្រសិនបើអ្នកចូលចិត្តមើលវីដេអូ អ្នកអាចពិនិត្យមើល [video tutorials](https://www.youtube.com/channel/UCM4xOopkYiPwJqyKsSqL9mw)
នៅក្នុងភាសាសរសេរកម្មវិធី ដើម្បីអនុវត្តការងារដដែលៗ យើងប្រើប្រភេទ loop ផ្សេងៗគ្នា។ ឧទាហរណ៍ខាងក្រោមគឺជា loop ដែលប្រើជាទូទៅក្នុង JavaScript និងភាសាសរសេរកម្មវិធីផ្សេងទៀត។
### for Loop
```js
// ចនាសម្ព័ន្ធរបស់ For loop
for(initialization, condition, increment/decrement){
// code goes here
}
```
```js
for(let i = 0; i <= 5; i++){
console.log(i)
}
// 0 1 2 3 4 5
```
```js
for(let i = 5; i >= 0; i--){
console.log(i)
}
// 5 4 3 2 1 0
```
```js
for(let i = 0; i <= 5; i++){
console.log(`${i} * ${i} = ${i * i}`)
}
```
```sh
0 * 0 = 0
1 * 1 = 1
2 * 2 = 4
3 * 3 = 9
4 * 4 = 16
5 * 5 = 25
```
```js
const countries = ['Finland', 'Sweden', 'Denmark', 'Norway', 'Iceland']
const newArr = []
for(let i = 0; i < countries.length; i++){
newArr.push(countries[i].toUpperCase())
}
// ["FINLAND", "SWEDEN", "DENMARK", "NORWAY", "ICELAND"]
```
ការបន្ថែមធាតុទាំងអស់នៅក្នុងអារេ
```js
const numbers = [1, 2, 3, 4, 5]
let sum = 0
for(let i = 0; i < numbers.length; i++){
sum = sum + numbers[i] // អាចកាត់ឲខ្លីបាន, sum += numbers[i]
}
console.log(sum) // 15
```
ការបង្កើតអារេថ្មីដោយផ្អែកលើអារេដែលមានស្រាប់
```js
const numbers = [1, 2, 3, 4, 5]
const newArr = []
let sum = 0
for(let i = 0; i < numbers.length; i++){
newArr.push( numbers[i] ** 2)
}
console.log(newArr) // [1, 4, 9, 16, 25]
```
```js
const countries = ['Finland', 'Sweden', 'Norway', 'Denmark', 'Iceland']
const newArr = []
for(let i = 0; i < countries.length; i++){
newArr.push(countries[i].toUpperCase())
}
console.log(newArr) // ["FINLAND", "SWEDEN", "NORWAY", "DENMARK", "ICELAND"]
```
### while loop
```js
let i = 0
while (i <= 5) {
console.log(i)
i++
}
// 0 1 2 3 4 5
```
### do while loop
```js
let i = 0
do {
console.log(i)
i++
} while (i <= 5)
// 0 1 2 3 4 5
```
### for of loop
យើងប្រើ for of loop សម្រាប់អារេ។ វា​ជា​វិធី​ដ៏​ងាយស្រួល​ក្នុង​ការ​ iterate ​តាមរយៈ​អារេ​មួយ ប្រសិនបើ​យើង​មិន​ចាប់អារម្មណ៍​លើ​ index ​នៃ​ធាតុ​នីមួយៗ​ក្នុង​អារេ។
```js
for (const element of arr) {
// ដាក់កូដទីនេះ
}
```
```js
const numbers = [1, 2, 3, 4, 5]
for (const num of numbers) {
console.log(num)
}
// 1 2 3 4 5
for (const num of numbers) {
console.log(num * num)
}
// 1 4 9 16 25
// ការបន្ថែមលេខទាំងអស់នៅក្នុងអារេ
let sum = 0
for (const num of numbers) {
sum = sum + num
// អាច​ត្រូវ​បាន​កាត់ឲខ្លី​ដូច​នេះ​, sum += num
// បន្ទាប់ពីនេះយើងនឹងប្រើ syntax ខ្លីជាងមុន (+=, -=, *=, /= etc)
}
console.log(sum) // 15
const webTechs = [
'HTML',
'CSS',
'JavaScript',
'React',
'Redux',
'Node',
'MongoDB'
]
for (const tech of webTechs) {
console.log(tech.toUpperCase())
}
// HTML CSS JAVASCRIPT REACT NODE MONGODB
for (const tech of webTechs) {
console.log(tech[0]) // យកតែអក្សរទីមួយនៃធាតុនីមួយៗ, H C J R N M
}
```
```js
const countries = ['Finland', 'Sweden', 'Norway', 'Denmark', 'Iceland']
const newArr = []
for(const country of countries){
newArr.push(country.toUpperCase())
}
console.log(newArr) // ["FINLAND", "SWEDEN", "NORWAY", "DENMARK", "ICELAND"]
```
### break
Break ត្រូវបានប្រើដើម្បីបញ្ចប់ loop.
```js
for(let i = 0; i <= 5; i++){
if(i == 3){
break
}
console.log(i)
}
// 0 1 2
```
កូដខាងលើនឹងឈប់ ប្រសិនបើ 3 បានរកឃើញនៅក្នុងដំណើរការ iteration។
### continue
យើងប្រើពាក្យគន្លឹះ *continue* ដើម្បីរំលង iteration ណាមួយ។
```js
for(let i = 0; i <= 5; i++){
if(i == 3){
continue
}
console.log(i)
}
// 0 1 2 4 5
```
🌕 អ្នក​ក្លាហាន​ណាស់​អ្នក​បាន​ធ្វើ​វា​ដល់​ពេល​នេះ​។ ឥឡូវនេះ អ្នកទទួលបានថាមពលដើម្បីធ្វើកិច្ចការដដែលៗ និងគួរឱ្យធុញទ្រាន់ដោយស្វ័យប្រវត្តិ។ អ្នកទើបតែបានបញ្ចប់ការប្រកួតថ្ងៃទី 6 ហើយអ្នកគឺជាជំហាន 6 ឆ្ពោះទៅរកផ្លូវរបស់អ្នកទៅកាន់ភាពអស្ចារ្យ។ ឥឡូវធ្វើលំហាត់ខ្លះសម្រាប់ខួរក្បាល និងសាច់ដុំរបស់អ្នក។
## 💻 លំហាត់៖ ថ្ងៃទី ៦
### លំហាត់៖ កម្រិត ១
```js
const countries = [
'Albania',
'Bolivia',
'Canada',
'Denmark',
'Ethiopia',
'Finland',
'Germany',
'Hungary',
'Ireland',
'Japan',
'Kenya'
]
const webTechs = [
'HTML',
'CSS',
'JavaScript',
'React',
'Redux',
'Node',
'MongoDB'
]
const mernStack = ['MongoDB', 'Express', 'React', 'Node']
```
1. iterate ពី 0 ទៅ 10 ដោយប្រើ loop ហើយធ្វើដូចគ្នាដោយប្រើ while និងធ្វើ while loop
2. iterate ពី 10 ទៅ 0 ដោយប្រើ loop ហើយធ្វើដូចគ្នាដោយប្រើ while និងធ្វើ while loop
3. iterate ពី 0 ទៅ n ដោយប្រើ loop
4. សរសេរ loop ដែលបង្កើតលំនាំខាងក្រោមដោយប្រើ console.log():
```js
#
##
###
####
#####
######
#######
```
5. ប្រើ loop ដើម្បីបង្ហាញលំនាំខាងក្រោម:
```sh
0 x 0 = 0
1 x 1 = 1
2 x 2 = 4
3 x 3 = 9
4 x 4 = 16
5 x 5 = 25
6 x 6 = 36
7 x 7 = 49
8 x 8 = 64
9 x 9 = 81
10 x 10 = 100
```
6. ប្រើ loop ដើម្បីបង្ហាញលំនាំខាងក្រោម:
```sh
i i^2 i^3
0 0 0
1 1 1
2 4 8
3 9 27
4 16 64
5 25 125
6 36 216
7 49 343
8 64 512
9 81 729
10 100 1000
```
7. ប្រើ for loop ដើម្បី iterate ពី 0 ទៅ 100 ហើយបង្ហាញតែលេខគូប៉ុណ្ណោះ។
8. ប្រើ for loop ដើម្បី iterate ពី 0 ទៅ 100 ហើយបង្ហាញតែលេខសេសប៉ុណ្ណោះ។
9. ប្រើ for loop ដើម្បី iterate ពី 0 ទៅ 100 ហើយបង្ហាញតែលេខបឋមតែប៉ុណ្ណោះ។
10. ប្រើ for loop ដើម្បី iterate ពី 0 ទៅ 100 ហើយបង្ហាញផលបូកនៃលេខទាំងអស់។
```sh
The sum of all numbers from 0 to 100 is 5050.
```
11. ប្រើ for loop ដើម្បី iterate ពី 0 ដល់ 100 ហើយបោះពុម្ពផលបូកនៃលេខគូទាំងអស់ និងផលបូកនៃលេខសេសទាំងអស់។
```sh
The sum of all evens from 0 to 100 is 2550. And the sum of all odds from 0 to 100 is 2500.
```
12. ប្រើ for loop ដើម្បី iterate ពី 0 ដល់ 100 ហើយបង្ហាញផលបូកនៃលេខគូទាំងអស់ និងផលបូកនៃលេខសេសទាំងអស់។ បង្ហាញផលបូកនៃគូ និងផលបូកនៃសេសជាអារេ
```sh
[2550, 2500]
```
13. បង្កើតស្គ្រីបតូចមួយដែលបង្កើតអារេនៃ 5 លេខចៃដន្យ
14. បង្កើតស្គ្រីបតូចមួយដែលបង្កើតអារេនៃលេខចៃដន្យ 5 ហើយលេខត្រូវតែមានតែមួយគត់
15. បង្កើតស្គ្រីបតូចមួយដែលបង្កើតលេខសម្គាល់ចៃដន្យចំនួនប្រាំមួយ:
```sh
5j2khz
```
### លំហាត់៖ កម្រិត ២
1. បង្កើតស្គ្រីបតូចមួយដែលបង្កើតលេខតួអក្សរចៃដន្យណាមួយ៖
```sh
fe3jo1gl124g
```
```sh
xkqci4utda1lmbelpkm03rba
```
1. សរសេរស្គ្រីបដែលបង្កើតលេខគោលដប់ប្រាំមួយចៃដន្យ។
```sh
'#ee33df'
```
1. សរសេរស្គ្រីបដែលបង្កើតលេខពណ៌ rgb ចៃដន្យ។
```sh
rgb(240,180,80)
```
1. ដោយប្រើអារេប្រទេសខាងលើ បង្កើតអារេថ្មីខាងក្រោម។
```sh
["ALBANIA", "BOLIVIA", "CANADA", "DENMARK", "ETHIOPIA", "FINLAND", "GERMANY", "HUNGARY", "IRELAND", "JAPAN", "KENYA"]
```
1. ដោយប្រើអារេប្រទេសខាងលើ បង្កើតអារេសម្រាប់ប្រវែងប្រទេស'។
```sh
[7, 7, 6, 7, 8, 7, 7, 7, 7, 5, 5]
```
1. ប្រើ array ប្រទេសដើម្បីបង្កើតអារេខាងក្រោម៖
```sh
[
['Albania', 'ALB', 7],
['Bolivia', 'BOL', 7],
['Canada', 'CAN', 6],
['Denmark', 'DEN', 7],
['Ethiopia', 'ETH', 8],
['Finland', 'FIN', 7],
['Germany', 'GER', 7],
['Hungary', 'HUN', 7],
['Ireland', 'IRE', 7],
['Iceland', 'ICE', 7],
['Japan', 'JAP', 5],
['Kenya', 'KEN', 5]
]
```
2. នៅក្នុងបណ្តាប្រទេសខាងលើ សូមពិនិត្យមើលថាតើមានប្រទេស ឬប្រទេសដែលមានពាក្យ 'land' ។ ប្រសិនបើមានប្រទេសដែលមាន 'land' សូមបោះពុម្ពវាជាអារេ។ ប្រសិនបើគ្មានប្រទេសណាដែលមានពាក្យ 'land' ទេ បោះពុម្ព 'All these countries are without land'
```sh
['Finland','Ireland', 'Iceland']
```
3. នៅក្នុងអារេប្រទេសខាងលើ សូមពិនិត្យមើលថាតើមានប្រទេស ឬប្រទេសដែលបញ្ចប់ដោយអក្សររង 'ia' ។ ប្រសិនបើមានប្រទេសបញ្ចប់ដោយ បោះពុម្ពវាជាអារេ។ ប្រសិនបើគ្មានប្រទេសដែលមានពាក្យ 'ai' ទេ បោះពុម្ព 'These are countries ends without ia' ។
```sh
['Albania', 'Bolivia','Ethiopia']
```
4. ដោយប្រើអារេប្រទេសខាងលើ ស្វែងរកប្រទេសដែលមានចំនួនតួអក្សរច្រើនបំផុត។
```sh
Ethiopia
```
5. ដោយប្រើអារេប្រទេសខាងលើ ស្វែងរកប្រទេសដែលមានត្រឹមតែ 5 តួអក្សរ។
```sh
['Japan', 'Kenya']
```
6. ស្វែងរកពាក្យវែងបំផុតនៅក្នុងអារេ webTechs
7. ប្រើអារេ webTechs ដើម្បីបង្កើតអារេនៃអារេខាងក្រោម៖
```sh
[["HTML", 4], ["CSS", 3],["JavaScript", 10],["React", 5],["Redux", 5],["Node", 4],["MongoDB", 7]]
```
8. កម្មវិធីដែលបានបង្កើតដោយប្រើ MongoDB, Express, React និង Node ត្រូវបានគេហៅថាកម្មវិធីជង់ MERN ។ បង្កើតអក្សរកាត់ MERN ដោយប្រើអារេ mernStack
9. iterate តាមរយៈអារេ ["HTML", "CSS", "JS", "React", "Redux", "Node", "Express", "MongoDB"] ដោយប្រើ for loop ឬ for of loop ហើយបោះពុម្ពចេញ ធាតុ។
10. នេះគឺជាអារេផ្លែឈើ , ['banana', 'orange', 'mango', 'lemon'] បញ្ច្រាសលំដាប់ដោយប្រើ loop និងមិនប្រើ reverse method។
11. បង្ហាញធាតុទាំងអស់នៃអារេដូចបង្ហាញខាងក្រោម។
```js
const fullStack = [
['HTML', 'CSS', 'JS', 'React'],
['Node', 'Express', 'MongoDB']
]
````
```sh
HTML
CSS
JS
REACT
NODE
EXPRESS
MONGODB
```
### លំហាត់៖ កម្រិត ៣
1. ចម្លងអារេប្រទេស (ជៀសវាងការផ្លាស់ប្តូរ)
1. អារេអាចផ្លាស់ប្តូរបាន។ បង្កើតច្បាប់ចម្លងនៃអារេដែលមិនកែប្រែរបស់ដើម។ តម្រៀបអារេដែលបានចម្លង ហើយរក្សាទុកក្នុង sortedCountries
1. តម្រៀបអារេ webTechs និង អារេ mernStack
1. ស្រង់ប្រទេសទាំងអស់មានពាក្យ 'land' ពី [countries array](https://github.com/Asabeneh/30DaysOfJavaScript/tree/master/data/countries.js) ហើយបោះពុម្ពវាជាអារេ
1. ស្វែងរកប្រទេសដែលមានចំនួនតួអក្សរខ្ពស់បំផុតនៅក្នុង [countries array](https://github.com/Asabeneh/30DaysOfJavaScript/tree/master/data/countries.js)
1. ស្រង់ប្រទេសទាំងអស់មានពាក្យ 'land' ពី [countries array](https://github.com/Asabeneh/30DaysOfJavaScript/tree/master/data/countries.js) ហើយបោះពុម្ពវាជាអារេ
1. ស្រង់ប្រទេសទាំងអស់ដែលមានតែបួនតួអក្សរពី [countries array](https://github.com/Asabeneh/30DaysOfJavaScript/tree/master/data/countries.js) ហើយបោះពុម្ពវាជាអារេ
1. ស្រង់ប្រទេសទាំងអស់ដែលមានពាក្យពីរ ឬច្រើនចេញពី [countries array](https://github.com/Asabeneh/30DaysOfJavaScript/tree/master/data/countries.js) ហើយបោះពុម្ពវាជាអារេ
1. បញ្ច្រាស [countries array](https://github.com/Asabeneh/30DaysOfJavaScript/tree/master/data/countries.js) ហើយសរសេរជាអក្សរធំរបស់ប្រទេសនីមួយៗ ហើយរក្សាទុកវាជាអារេ
🎉 អបអរសាទរ ! 🎉
[<< ថ្ងៃទី 5](../05_Day_Arrays/05_day_arrays.md) | [ថ្ងៃទី 7 >>](../07_Day_Functions/07_day_functions.md)

707
Khmer/07_Day_Functions/07_day_functions.md
Unescape View File

@ -0,0 +1,707 @@
<div align="center">
<h1> 30 ថ្ងៃនៃ JavaScript: Functions</h1>
<a class="header-badge" target="_blank" href="https://www.linkedin.com/in/asabeneh/">
<img src="https://img.shields.io/badge/style--5eba00.svg?label=LinkedIn&logo=linkedin&style=social">
</a>
<a class="header-badge" target="_blank" href="https://twitter.com/Asabeneh">
<img alt="Twitter Follow" src="https://img.shields.io/twitter/follow/asabeneh?style=social">
</a>
<sub>អ្នកនិពន្ធ:
<a href="https://www.linkedin.com/in/asabeneh/" target="_blank">Asabeneh Yetayeh</a><br>
<small> ខែមករា ឆ្នាំ ២០២០</small>
</sub>
</div>
[<< ថ្ងៃទី 6](../06_Day_Loops/06_day_loops.md) | [ថ្ងៃទី 8 >>](../08_Day_Objects/08_day_objects.md)
![Thirty Days Of JavaScript](../images/banners/day_1_7.png)
- [📔 Day 7](#-day-7)
- [Functions](#functions)
- [ការប្រកាស Function](#function-declaration)
- [Function ដោយគ្មានប៉ារ៉ាម៉ែត្រនិង return](#function-without-a-parameter-and-return)
- [Function ជាមួយតម្លៃ return](#function-returning-value)
- [Function ជាមួយប៉ារ៉ាម៉ែត្រ](#function-with-a-parameter)
- [Function ជាមួយប៉ារ៉ាម៉ែត្រពីរ](#function-with-two-parameters)
- [Function ជាមួយប៉ារ៉ាម៉ែត្រជាច្រើន។](#function-with-many-parameters)
- [Function ជាមួយនឹងចំនួនប៉ារ៉ាម៉ែត្រគ្មានដែនកំណត់](#function-with-unlimited-number-of-parameters)
- [ចំនួនប៉ារ៉ាម៉ែត្រគ្មានដែនកំណត់ក្នុង function ធម្មតា](#unlimited-number-of-parameters-in-regular-function)
- [ចំនួនប៉ារ៉ាម៉ែត្រគ្មានដែនកំណត់នៅក្នុង arrow function](#unlimited-number-of-parameters-in-arrow-function)
- [Anonymous Function](#anonymous-function)
- [Expression Function](#expression-function)
- [Self Invoking Functions](#self-invoking-functions)
- [Arrow Function](#arrow-function)
- [Function ជាមួយ default parameters](#function-with-default-parameters)
- [Function declaration និង Arrow function](#function-declaration-versus-arrow-function)
- [💻 លំហាត់](#-exercises)
- [លំហាត់៖ កម្រិត ១](#exercises-level-1)
- [លំហាត់៖ កម្រិត ២](#exercises-level-2)
- [លំហាត់៖ កម្រិត ៣](#exercises-level-3)
# 📔 ថ្ងៃទី 7
## Functions
រហូតមកដល់ពេលនេះ យើងបានឃើញ JavaScript function ជាច្រើន។ នៅក្នុងផ្នែកនេះ យើងនឹងផ្តោតលើ custom function។ តើ function ជាអ្វី? មុន​នឹង​យើង​ចាប់​ផ្ដើម​បង្កើត ​function សូម​យល់​ថា​ function ជា​អ្វី​ ហើយ​ហេតុ​អ្វី​បាន​ជា​យើង​ត្រូវ function?
function គឺជាប្លុកដែលអាចប្រើឡើងវិញបានក្នុងការសរសេរកម្មវិធីដែលត្រូវបានរចនាឡើងដើម្បីអនុវត្តកិច្ចការជាក់លាក់មួយ។
function ​ត្រូវ​បាន​ប្រកាស​ដោយ​ពាក្យ​គន្លឹះ​ function ​ដែល​តាម​ដោយ​ឈ្មោះ​មួយនិង​វង់ក្រចក ()។ វង់ក្រចកអាចយកប៉ារ៉ាម៉ែត្រ។ ប្រសិនបើ function យកប៉ារ៉ាម៉ែត្រវានឹងត្រូវបានហៅថា arugment។ functin ក៏អាចយកប៉ារ៉ាម៉ែត្រលំនាំដើមផងដែរ។ ដើម្បីរក្សាទុកទិន្នន័យទៅមុខងារ មុខងារមួយត្រូវបោះប្រភេទទិន្នន័យជាក់លាក់។ ដើម្បីទទួលបានតម្លៃដែលយើងហៅ ឬហៅ function មួយ។
function ធ្វើឲកូដ៖
- ស្អាត និងងាយស្រួលអាន
- អាចប្រើឡើងវិញបាន
- ងាយស្រួលក្នុងការតេស
function មួយអាចត្រូវបានប្រកាស ឬបង្កើតតាមវិធីដូចខាងក្រោម:
- _Declaration function_
- _Expression function_
- _Anonymous function_
- _Arrow function_
### ការប្រកាស Function
តោះមើលរបៀបប្រកាស function និងរបៀបហៅ function។
```js
//ប្រកាស function ដោយគ្មានប៉ារ៉ាម៉ែត្រ
function functionName() {
// code goes here
}
functionName() // function ហៅតាមឈ្មោះរបស់វា និងជាមួយវង់ក្រចក
```
### Function ដោយគ្មានប៉ារ៉ាម៉ែត្រនិង return
function អាចត្រូវបានប្រកាសដោយគ្មានប៉ារ៉ាម៉ែត្រ។
**ឧទាហរណ៍:**
```js
// function ដោយ​គ្មាន​ប៉ារ៉ាម៉ែត្រ function ដែល​បង្កើត​ចំនួន​ការ៉េ
function square() {
let num = 2
let sq = num * num
console.log(sq)
}
square() // 4
// function ដោយ​គ្មាន​ប៉ារ៉ាម៉ែត្រ
function addTwoNumbers() {
let numOne = 10
let numTwo = 20
let sum = numOne + numTwo
console.log(sum)
}
addTwoNumbers() // function មួយត្រូវហៅតាមឈ្មោះរបស់វា ទើបអាចប្រតិបត្តិបាន។
```
```js
function printFullName (){
let firstName = 'Asabeneh'
let lastName = 'Yetayeh'
let space = ' '
let fullName = firstName + space + lastName
console.log(fullName)
}
printFullName() // ការហៅ functino មួយ។
```
### Function ជាមួយតម្លៃ return
function ក៏អាចបោះ​តម្លៃ​វិញ​ដែរ ប្រសិនបើ​អនុគមន៍​មិន​បោះ​តម្លៃនោះ​តម្លៃ​នៃ function នឹងមិន​ត្រូវ​បាន​កំណត់។ អនុញ្ញាតឱ្យយើងសរសេរ function ខាងលើជាមួយនឹងការបោះតម្លៃមកវិញ។ ចាប់ពីពេលនេះតទៅ យើងបោះតម្លៃទៅ function មួយជំនួសឱ្យការបោះពុម្ពវា។
```js
function printFullName (){
let firstName = 'Asabeneh'
let lastName = 'Yetayeh'
let space = ' '
let fullName = firstName + space + lastName
return fullName
}
console.log(printFullName())
```
```js
function addTwoNumbers() {
let numOne = 2
let numTwo = 3
let total = numOne + numTwo
return total
}
console.log(addTwoNumbers())
```
### Function ជាមួយប៉ារ៉ាម៉ែត្រ
នៅក្នុង function យើងអាចបញ្ចូលប្រភេទទិន្នន័យផ្សេងៗគ្នា (number, string, boolean, object, function) ជាប៉ារ៉ាម៉ែត្រ។
```js
// function ជាមួយប៉ារ៉ាម៉ែត្រមួយ។
function functionName(parm1) {
//code goes her
}
functionName(parm1) // កំឡុងពេលហៅ
function areaOfCircle(r) {
let area = Math.PI * r * r
return area
}
console.log(areaOfCircle(10)) // គួរតែត្រូវបានហៅដោយ argument មួយ។
function square(number) {
return number * number
}
console.log(square(10))
```
### Function ជាមួយប៉ារ៉ាម៉ែត្រពីរ
```js
// Function ជាមួយប៉ារ៉ាម៉ែត្រពីរ
function functionName(parm1, parm2) {
//code goes her
}
functionName(parm1, parm2) // Function ជាមួយប៉ារ៉ាម៉ែត្រពីរ
// function គ្មាន​ប៉ារ៉ាម៉ែត្រ​មិន​យក​ការ​បញ្ចូល​ទេ ដូច្នេះ​អនុញ្ញាត​ឱ្យយើង​បង្កើត​ function ជាមួយ​ប៉ារ៉ាម៉ែត្រ
function sumTwoNumbers(numOne, numTwo) {
let sum = numOne + numTwo
console.log(sum)
}
sumTwoNumbers(10, 20) //ហៅ function
// ប្រសិនបើ functino មិន return វាមិនរក្សាទុកទិន្នន័យទេ ដូច្នេះវាគួរតែ return មកវិញ
function sumTwoNumbers(numOne, numTwo) {
let sum = numOne + numTwo
return sum
}
console.log(sumTwoNumbers(10, 20))
function printFullName(firstName, lastName) {
return `${firstName} ${lastName}`
}
console.log(printFullName('Asabeneh', 'Yetayeh'))
```
### Function ជាមួយប៉ារ៉ាម៉ែត្រជាច្រើន។
```js
// Functino ជាមួយប៉ារ៉ាម៉ែត្រជាច្រើន។
function functionName(parm1, parm2, parm3,...){
//code goes here
}
functionName(parm1,parm2,parm3,...) // កំឡុងពេលហៅ arugment ចំនួនបីដែលត្រូវការ
// function នេះយកអារេជាប៉ារ៉ាម៉ែត្រ ហើយបូកសរុបលេខក្នុងអារេ
function sumArrayValues(arr) {
let sum = 0;
for (let i = 0; i < arr.length; i++) {
sum = sum + arr[i];
}
return sum;
}
const numbers = [1, 2, 3, 4, 5];
//calling a function
console.log(sumArrayValues(numbers));
const areaOfCircle = (radius) => {
let area = Math.PI * radius * radius;
return area;
}
console.log(areaOfCircle(10))
```
### Function ជាមួយនឹងចំនួនប៉ារ៉ាម៉ែត្រគ្មានដែនកំណត់
ពេល​ខ្លះ​យើង​មិន​ដឹង​ថា​តើ​មាន​អាគុយម៉ង់​ប៉ុន្មាន​ដែល​អ្នក​ប្រើ​នឹង​ដាក់។ ដូច្នេះ​ហើយ យើង​គួរ​ដឹង​ពី​របៀប​សរសេរ​មុខងារ​មួយ​ដែល​អាច​យក​ចំនួន​ argument មិន​កំណត់។ វិធីដែលយើងធ្វើវាមានភាពខុសគ្នាខ្លាំងរវាងការប្រកាស regular function (មុខងារធម្មតា) និង arrow function។ ចូរយើងមើលឧទាហរណ៍ទាំងនៅក្នុងមុខងារប្រកាស និងមុខងារព្រួញ។
#### ចំនួនប៉ារ៉ាម៉ែត្រគ្មានដែនកំណត់ក្នុង function ធម្មតា
វត្ថុណាមួយដែលបានដាក់ជា argument អាចចូលប្រើបានពី arguments object នៅខាងក្នុង function។ ចូរយើងមើលឧទាហរណ៍មួយ។
```js
// Let us access the arguments object
​
function sumAllNums() {
console.log(arguments)
}
sumAllNums(1, 2, 3, 4)
// Arguments(4) [1, 2, 3, 4, callee: ƒ, Symbol(Symbol.iterator): ƒ]
```
```js
// ការប្រកាស functino
​
function sumAllNums() {
let sum = 0
for (let i = 0; i < arguments.length; i++) {
sum += arguments[i]
}
return sum
}
console.log(sumAllNums(1, 2, 3, 4)) // 10
console.log(sumAllNums(10, 20, 13, 40, 10)) // 93
console.log(sumAllNums(15, 20, 30, 25, 10, 33, 40)) // 173
```
#### ចំនួនប៉ារ៉ាម៉ែត្រគ្មានដែនកំណត់នៅក្នុង arrow function
ដើម្បីអនុវត្តមុខងារដែលយកចំនួនអាគុយម៉ង់មិនកំណត់ក្នុង arrow function យើងប្រើ Spread operator អមដោយឈ្មោះប៉ារ៉ាម៉ែត្រណាមួយ។ អ្វីក៏ដោយដែលយើងដាក់ជាអាគុយម៉ង់ក្នុង function អាចចូលប្រើជាអារេក្នុង arrow function។ ចូរយើងមើលឧទាហរណ៍មួយ។
```js
// Let us access the arguments object
​
const sumAllNums = (...args) => {
// console.log(arguments), រកមិនឃើញវ arguments object នៅក្នុង arrow functino
// ជំនួសមកវិញ យើងប្រើប៉ារ៉ាម៉ែត្រដែលមាន spread operator (...) នៅពីមុខ
console.log(args)
}
sumAllNums(1, 2, 3, 4)
// [1, 2, 3, 4]
```
```js
// function declaration
​
const sumAllNums = (...args) => {
let sum = 0
for (const element of args) {
sum += element
}
return sum
}
console.log(sumAllNums(1, 2, 3, 4)) // 10
console.log(sumAllNums(10, 20, 13, 40, 10)) // 93
console.log(sumAllNums(15, 20, 30, 25, 10, 33, 40)) // 173
```
### Anonymous Function
Anonymous function រឺ function គ្មានឈ្មោះ
```js
const anonymousFun = function() {
console.log(
'I am an anonymous function and my value is stored in anonymousFun'
)
}
```
### Expression Function
Expression functions គឺជា anonymous functions។ បន្ទាប់​ពី​យើង​បង្កើត function ដោយ​មិន​មាន​ឈ្មោះ​ហើយ​យើង​កំណត់​វា​ទៅ​ជា​អថេរ។ ដើម្បីបោះតម្លៃពីអនុគមន៍ យើងគួរហៅអថេរ។ សូមមើលឧទាហរណ៍ខាងក្រោម។
```js
// Function expression
const square = function(n) {
return n * n
}
console.log(square(2)) // -> 4
```
### Self Invoking Functions
Self invoking functions គឺជា anonymous functions ដែលមិនចាំបាច់ហៅដើម្បីឲតម្លៃ។
```js
(function(n) {
console.log(n * n)
})(2) // 4, ប៉ុន្តែជំនួសឱ្យការគ្រាន់តែបោះពុម្ព ប្រសិនបើយើងចង់ត្រឡប់ និងរក្សាទុកទិន្នន័យ យើងធ្វើដូចបានបង្ហាញខាងក្រោម
let squaredNum = (function(n) {
return n * n
})(10)
console.log(squaredNum)
```
### Arrow Function
arrow function គឺជាជម្រើសមួយសម្រាប់សរសេរ functino ទោះជាយ៉ាងណាក៏ដោយ ការប្រកាស function និង arrow functinoមានភាពខុសគ្នាបន្តិចបន្តួច។
arrow functino ប្រើព្រួញជំនួសឱ្យពាក្យគន្លឹះ *function* ដើម្បីប្រកាស function។ អនុញ្ញាតឱ្យយើងឃើញទាំងការប្រកាស function និង arrow function។
```js
// នេះជារបៀបដែលយើងសរសេរ function ធម្មតា
// អនុញ្ញាតឱ្យយើងផ្លាស់ប្តូរ functino នេះទៅជា arrow function
function square(n) {
return n * n
}
console.log(square(2)) // 4
const square = n => {
return n * n
}
console.log(square(2)) // -> 4
// ប្រសិន​បើ​យើង​មាន​តែ​មួយ​បន្ទាត់​នៅ​ក្នុង​ប្លុក​កូដ​នោះ វា​អាច​ត្រូវ​បាន​សរសេរ​ដូច​ខាង​ក្រោម​
const square = n => n * n // -> 4
```
```js
const changeToUpperCase = arr => {
const newArr = []
for (const element of arr) {
newArr.push(element.toUpperCase())
}
return newArr
}
const countries = ['Finland', 'Sweden', 'Norway', 'Denmark', 'Iceland']
console.log(changeToUpperCase(countries))
// ["FINLAND", "SWEDEN", "NORWAY", "DENMARK", "ICELAND"]
```
```js
const printFullName = (firstName, lastName) => {
return `${firstName} ${lastName}`
}
console.log(printFullName('Asabeneh', 'Yetayeh'))
```
function ខាងលើមានពាក្យត្រឡប់ តែយើងអាច return វាវិញបានដូចខាងក្រោម។
```js
const printFullName = (firstName, lastName) => `${firstName} ${lastName}`
console.log(printFullName('Asabeneh', 'Yetayeh'))
```
### Function ជាមួយ default parameters
ពេល​ខ្លះ​យើង​បញ្ជូន​តម្លៃ​លំនាំដើម​ទៅ​ប៉ារ៉ាម៉ែត្រ ពេល​យើង​ហៅ​មុខងារ​នេះ បើ​យើង​មិនឲតម្លៃទេ ​លំនាំដើម​នឹង​ត្រូវ​បាន​ប្រើ។ ទាំងការប្រកាសមុខងារ និងមុខងារព្រួញអាចមានតម្លៃលំនាំដើម។
```js
// syntax
// ប្រកាស functino
function functionName(param = value) {
//codes
}
// ហៅ function
functionName()
functionName(arg)
```
**ឧទាហរណ៍:**
```js
function greetings(name = 'Peter') {
let message = `${name}, welcome to 30 Days Of JavaScript!`
return message
}
console.log(greetings())
console.log(greetings('Asabeneh'))
```
```js
function generateFullName(firstName = 'Asabeneh', lastName = 'Yetayeh') {
let space = ' '
let fullName = firstName + space + lastName
return fullName
}
console.log(generateFullName())
console.log(generateFullName('David', 'Smith'))
```
```js
function calculateAge(birthYear, currentYear = 2019) {
let age = currentYear - birthYear
return age
}
console.log('Age: ', calculateAge(1819))
```
```js
function weightOfObject(mass, gravity = 9.81) {
let weight = mass * gravity + ' N' // តម្លៃត្រូវតែប្តូរទៅ string ជាមុនសិន
return weight
}
console.log('Weight of an object in Newton: ', weightOfObject(100)) //ទំនាញផែនដី ៩.៨១
console.log('Weight of an object in Newton: ', weightOfObject(100, 1.62)) // ទំនាញនៅលើផ្ទៃព្រះច័ន្ទ
```
ចូរយើងមើលពីរបៀបដែលយើងសរសេរ functino ខាងលើជាមួយនឹង arrow function
```js
// syntax
// ប្រកាស a function
const functionName = (param = value) => {
//codes
}
// ហៅ function
functionName()
functionName(arg)
```
**ឧទាហរណ៍:**
```js
const greetings = (name = 'Peter') => {
let message = name + ', welcome to 30 Days Of JavaScript!'
return message
}
console.log(greetings())
console.log(greetings('Asabeneh'))
```
```js
const generateFullName = (firstName = 'Asabeneh', lastName = 'Yetayeh') => {
let space = ' '
let fullName = firstName + space + lastName
return fullName
}
console.log(generateFullName())
console.log(generateFullName('David', 'Smith'))
```
```js
const calculateAge = (birthYear, currentYear = 2019) => currentYear - birthYear
console.log('Age: ', calculateAge(1819))
```
```js
const weightOfObject = (mass, gravity = 9.81) => mass * gravity + ' N'
console.log('Weight of an object in Newton: ', weightOfObject(100)) // ទំនាញផែនដី ៩.៨១
console.log('Weight of an object in Newton: ', weightOfObject(100, 1.62)) // ទំនាញនៅលើផ្ទៃព្រះច័ន្ទ
```
### Function declaration និង Arrow function
វានឹងត្រូវបានគ្របដណ្តប់នៅក្នុងផ្នែកផ្សេងទៀត។
🌕 អ្នក​ជា​តារា​ដែល​កំពុង​រះ ឥឡូវ​អ្នក​ដឹង​អំពី function ហើយ។ អ្នកបានឈាន 7 ជំហាន ឆ្ពោះទៅរកភាពអស្ចារ្យ។ ឥឡូវធ្វើលំហាត់ខ្លះសម្រាប់ខួរក្បាល និងសាច់ដុំរបស់អ្នក។
## 💻 លំហាត់
### លំហាត់៖ កម្រិត ១
1. ប្រកាស function _fullName_ ហើយវាបោះពុម្ពឈ្មោះពេញរបស់អ្នក។
2. ប្រកាស function _fullName_ ហើយឥឡូវនេះវាយកឈ្មោះដំបូង ឈ្មោះចុងក្រោយជាប៉ារ៉ាម៉ែត្រ ហើយវាឲឈ្មោះពេញរបស់អ្នក។
3. ប្រកាសមុខងារ _addNumbers_ ហើយវាត្រូវការប៉ារ៉ាម៉ែត្រពីរ ហើយវាត្រឡប់ផលបូករបស់ប៉ារ៉ាម៉ែត្រនោះ។
4. ផ្ទៃដីនៃចតុកោណកែងត្រូវបានគណនាដូចខាងក្រោម៖ _area = បណ្តោយ x ទទឹង_។ សរសេរ function ដែលគណនា _areaOfRectangle_ ។
5. បរិវេណនៃចតុកោណកែងត្រូវបានគណនាដូចខាងក្រោម៖ _perimeter= 2x(បណ្តោយ + ទទឹង)_. សរសេរមុខងារដែលគណនា_perimeterOfRectangle_.
6. បរិមាណនៃព្រីសរាងចតុកោណត្រូវបានគណនាដូចខាងក្រោម៖ _volume = បណ្តោយ x ទទឹង x កំពស់ _ ។ សរសេរអនុគមន៍ដែលគណនា _volumeOfRectPrism_ ។
7. ផ្ទៃដីនៃរង្វង់ត្រូវបានគណនាដូចខាងក្រោម៖ _area = π x r x r_ ។ សរសេរអនុគមន៍ដែលគណនា _areaOfCircle_
8. រង្វង់រង្វង់ត្រូវបានគណនាដូចខាងក្រោម៖ _circumference = 2πr_ ។ សរសេរអនុគមន៍ដែលគណនា _circumOfCircle_
9. ដង់ស៊ីតេនៃសារធាតុត្រូវបានគណនាដូចខាងក្រោម៖ _ដង់ស៊ីតេ = ម៉ាស/បរិមាណ _។ សរសេរអនុគមន៍ដែលគណនា _ដង់ស៊ីតេ_។
10. ល្បឿនត្រូវបានគណនាដោយបែងចែកចម្ងាយសរុបដែលគ្របដណ្ដប់ដោយវត្ថុផ្លាស់ទីចែកនឹងចំនួនសរុបនៃពេលវេលាដែលបានយក សរសេរអនុគមន៍ដែលគណនាល្បឿននៃវត្ថុផ្លាស់ទី _speed_ ។
11. ទំងន់នៃសារធាតុមួយត្រូវបានគណនាដូចខាងក្រោម: _weight = mass x gravity_. សរសេរមុខងារដែលគណនា _weight_ ។
12. សីតុណ្ហភាពក្នុង oC អាចបំប្លែងទៅជា oF ដោយប្រើរូបមន្តនេះ៖ _oF = (oC x 9/5) + 32_ ។ សរសេរមុខងារដែលបំលែង oC ទៅជា oF _convertCelsiusToFahrenheit_ ។
13. Body Mass Index (BMI) ត្រូវបានគណនាដូចខាងក្រោម៖ _bmi = ទម្ងន់គិតជា Kg / (កម្ពស់ x កម្ពស់) ក្នុង m2_ ។ សរសេរអនុគមន៍ដែលគណនា _bmi_ ។ BMI ត្រូវបានប្រើដើម្បីកំណត់យ៉ាងទូលំទូលាយក្រុមទម្ងន់ផ្សេងៗគ្នាចំពោះមនុស្សពេញវ័យដែលមានអាយុចាប់ពី 20 ឆ្នាំឡើងទៅ។ ពិនិត្យមើលថាតើមនុស្សម្នាក់មានទម្ងន់ _ ក្រោម ធម្មតា លើសទម្ងន់ _ ឬ _ធាត់_ ដោយផ្អែកលើព័ត៌មានដែលបានផ្តល់ឱ្យខាងក្រោម។
- ក្រុមដូចគ្នាអនុវត្តចំពោះបុរសនិងស្ត្រី។
- _Underweight_: BMI តិចជាង 18.5
- _ទម្ងន់ធម្មតា_៖ BMI គឺ 18.5 ដល់ 24.9
- _លើសទម្ងន់_៖ BMI គឺ 25 ទៅ 29.9
- _Obese_: BMI is 30 or more
14. សរសេរមុខងារមួយហៅថា _checkSeason_ វាយកខែ ហើយត្រឡប់រដូវកាលវិញ៖ សរទរដូវ រដូវរងា និទាឃរដូវ ឬរដូវក្តៅ។
15. Math.max ត្រឡប់អាគុយម៉ង់ធំបំផុតរបស់វា។ សរសេរអនុគមន៍ findMax ដែលយកអាគុយម៉ង់បី ហើយត្រឡប់អតិបរមារបស់វាដោយមិនប្រើវិធីសាស្ត្រ Math.max ។
```js
console.log(findMax(0, 10, 5))
10
console.log(findMax(0, -10, -2))
0
```
### លំហាត់៖ កម្រិត ២
1. សមីការលីនេអ៊ែរត្រូវបានគណនាដូចខាងក្រោមៈ _ax + ដោយ + c = 0_ ។ សរសេរអនុគមន៍ដែលគណនាតម្លៃនៃសមីការលីនេអ៊ែរ _solveLinEquation_។
1. សមីការការ៉េត្រូវបានគណនាដូចខាងក្រោម៖ _ax2 + bx + c = 0_ ។ សរសេរអនុគមន៍ដែលគណនាតម្លៃនៃសមីការការ៉េ _solveQuadEquation_។
```js
console.log(solveQuadratic()) // {0}
console.log(solveQuadratic(1, 4, 4)) // {-2}
console.log(solveQuadratic(1, -1, -2)) // {2, -1}
console.log(solveQuadratic(1, 7, 12)) // {-3, -4}
console.log(solveQuadratic(1, 0, -4)) //{2, -2}
console.log(solveQuadratic(1, -1, 0)) //{1, 0}
```
1. ប្រកាសឈ្មោះមុខងារ _printArray_ ។ វាយកអារេជាប៉ារ៉ាម៉ែត្រ ហើយវាបោះពុម្ពចេញតម្លៃនីមួយៗនៃអារេ។
1. សរសេរឈ្មោះមុខងារ _showDateTime_ ដែលបង្ហាញពេលវេលាក្នុងទម្រង់នេះ៖ 08/01/2020 04:08 ដោយប្រើវត្ថុកាលបរិច្ឆេទ។
```sh
showDateTime()
08/01/2020 04:08
```
1. ប្រកាសឈ្មោះមុខងារ _swapValues_ ។ មុខងារនេះប្តូរតម្លៃនៃ x ទៅ y ។
```js
swapValues(3, 4) // x => 4, y=>3
swapValues(4, 5) // x = 5, y = 4
```
1. ប្រកាសឈ្មោះមុខងារ _reverseArray_ ។ វា​យក​អារេ​ជា​ប៉ារ៉ាម៉ែត្រ ហើយ​វា​ត្រឡប់​ការ​បញ្ច្រាស​នៃ​អារេ (កុំ​ប្រើ method)។
```js
console.log(reverseArray([1, 2, 3, 4, 5]))
//[5, 4, 3, 2, 1]
console.log(reverseArray(['A', 'B', 'C']))
//['C', 'B', 'A']
```
1. ប្រកាសឈ្មោះមុខងារ _capitalizeArray_ ។ វា​យក​អារេ​ជា​ប៉ារ៉ាម៉ែត្រ​មួយ​ហើយ​វា​ត្រឡប់​ - អក្សរធំ។
1. ប្រកាសឈ្មោះមុខងារ _addItem_ ។ វាត្រូវការប៉ារ៉ាម៉ែត្រធាតុមួយ ហើយវាត្រឡប់អារេមួយបន្ទាប់ពីបន្ថែមធាតុ
1. ប្រកាសឈ្មោះមុខងារ _removeItem_ ។ វាត្រូវការប៉ារ៉ាម៉ែត្រ index ហើយវាត្រឡប់អារេមួយបន្ទាប់ពីយកធាតុចេញ
1. ប្រកាសឈ្មោះអនុគមន៍ _sumOfNumbers_ ។ វាត្រូវការប៉ារ៉ាម៉ែត្រលេខ ហើយវាបូកលេខទាំងអស់នៅក្នុងជួរនោះ។
1. ប្រកាសឈ្មោះមុខងារ _sumOfOdds_ ។ វាត្រូវការប៉ារ៉ាម៉ែត្រលេខមួយ ហើយវាបន្ថែមលេខសេសទាំងអស់នៅក្នុងជួរនោះ។
1. ប្រកាសឈ្មោះមុខងារ _sumOfEven_ ។ វាត្រូវការប៉ារ៉ាម៉ែត្រលេខមួយ ហើយវាបន្ថែមលេខគូទាំងអស់ក្នុងជួរនោះ។
1. ប្រកាសឈ្មោះមុខងារ evensAndOdds ។ វាយកចំនួនគត់វិជ្ជមានជាប៉ារ៉ាម៉ែត្រ ហើយវារាប់ចំនួនគូ និងសេសក្នុងចំនួន។
```sh
evensAndOdds(100);
The number of odds are 50.
The number of evens are 51.
```
1. សរសេរអនុគមន៍ដែលយកចំនួនអាគុយម៉ង់ណាមួយ ហើយត្រឡប់ផលបូកនៃអាគុយម៉ង់
```js
sum(1, 2, 3) // -> 6
sum(1, 2, 3, 4) // -> 10
```
1. សរសេរ function ដែលបង្កើត _randomUserIp_ ។
1. សរសេរ function ដែលបង្កើត _randomMacAddress_
1. ប្រកាស functino ឈ្មោះ _randomHexaNumberGenerator_ ។ function ឲលេខគោលដប់ប្រាំមួយចៃដន្យ។
```sh
console.log(randomHexaNumberGenerator());
'#ee33df'
```
1. ប្រកាសឈ្មោះ function _userIdGenerator_ ។ នៅពេលដែលមុខងារនេះត្រូវបានគេហៅថា វាបង្កើតលេខសម្គាល់តួអក្សរប្រាំពីរ។ មុខងារបញ្ជូនលេខសម្គាល់មកវិញ។
```sh
console.log(userIdGenerator());
41XTDbE
```
### លំហាត់៖ កម្រិត ៣
1. កែប្រែ function _userIdGenerator_ ។ ប្រកាសឈ្មោះ function _userIdGeneratedByUser_ ។ វា​មិន​យក​ប៉ារ៉ាម៉ែត្រ​តែមួយ​ទេ ប៉ុន្តែ​វា​ត្រូវការ​បញ្ចូល​ពីរ​ដោយ​ប្រើ prompt() ។ ការបញ្ចូលមួយគឺចំនួនតួអក្សរ ហើយការបញ្ចូលទីពីរគឺជាចំនួនលេខសម្គាល់ដែលសន្មត់ថាត្រូវបានបង្កើត។
```sh
userIdGeneratedByUser()
'kcsy2
SMFYb
bWmeq
ZXOYh
2Rgxf
'
userIdGeneratedByUser()
'1GCSgPLMaBAVQZ26
YD7eFwNQKNs7qXaT
ycArC5yrRupyG00S
UbGxOFI7UXSWAyKN
dIV0SSUTgAdKwStr
'
```
1. សរសេរឈ្មោះ function _rgbColorGenerator_ ហើយវាបង្កើតពណ៌ rgb ។
```sh
rgbColorGenerator()
rgb(125,244,255)
```
1. សរសេរ functino **_arrayOfHexaColors_** ដែលត្រឡប់ចំនួនពណ៌គោលដប់ប្រាំមួយក្នុងអារេមួយ។
1. សរសេរមុខងារ **_arrayOfRgbColors_** ដែលត្រឡប់ចំនួនពណ៌ RGB ណាមួយនៅក្នុងអារេមួយ។
1. សរសេរមុខងារ **_convertHexaToRgb_** ដែលបំប្លែងពណ៌ hexa ទៅ rgb ហើយវាត្រឡប់ពណ៌ rgb ។
1. សរសេរមុខងារ **_convertRgbToHexa_** ដែលបំប្លែង rgb ទៅជាពណ៌គោលដប់ប្រាំមួយ ហើយវាត្រឡប់ពណ៌ hex មួយ។
1. សរសេរមុខងារ **_generateColors_** ដែលអាចបង្កើតចំនួនពណ៌ hex ឬ rgb ណាមួយ។
```js
console.log(generateColors('hexa', 3)) // ['#a3e12f', '#03ed55', '#eb3d2b']
console.log(generateColors('hexa', 1)) // '#b334ef'
console.log(generateColors('rgb', 3)) // ['rgb(5, 55, 175)', 'rgb(50, 105, 100)', 'rgb(15, 26, 80)']
console.log(generateColors('rgb', 1)) // 'rgb(33,79, 176)'
```
1. ហៅមុខងាររបស់អ្នក _shuffleArray_ វាយកអារេជាប៉ារ៉ាម៉ែត្រ ហើយវាត្រឡប់អារេដែលសាប់
1. ហៅទៅមុខងាររបស់អ្នក _factorial_ វាយកលេខទាំងមូលជាប៉ារ៉ាម៉ែត្រ ហើយវាត្រឡប់លេខហ្វាតូរីស
1. ហៅមុខងាររបស់អ្នក _isEmpty_ វាត្រូវការប៉ារ៉ាម៉ែត្រ ហើយវាពិនិត្យមើលថាតើវាទទេឬអត់
1. ហៅទៅអនុគមន៍ _sum_ របស់អ្នក វាយកចំនួនអាគុយម៉ង់ណាមួយ ហើយវាត្រឡប់ផលបូក។
1. សរសេរអនុគមន៍មួយហៅថា _sumOfArrayItems_ វាយកប៉ារ៉ាម៉ែត្រអារេមួយ ហើយត្រឡប់ផលបូកនៃធាតុទាំងអស់។ ពិនិត្យមើលថាតើធាតុអារេទាំងអស់ជាប្រភេទលេខឬអត់។ បើមិនផ្តល់មតិត្រឡប់សមហេតុផល។
1. សរសេរអនុគមន៍មួយហៅថា _average_ វាត្រូវការប៉ារ៉ាម៉ែត្រអារេមួយ ហើយត្រឡប់ជាមធ្យមនៃធាតុ។ ពិនិត្យមើលថាតើធាតុអារេទាំងអស់ជាប្រភេទលេខឬអត់។ បើមិនផ្តល់មតិត្រឡប់សមហេតុផល។
1. សរសេរអនុគមន៍មួយហៅថា _modifyArray_ ដែលយកអារេជាប៉ារ៉ាម៉ែត្រ ហើយកែប្រែធាតុទីប្រាំនៃអារេ ហើយត្រឡប់អារេ។ ប្រសិនបើប្រវែងអារេតិចជាងប្រាំ វាត្រឡប់ 'រកមិនឃើញធាតុ' ។
```js
console.log(modifyArray(['Avocado', 'Tomato', 'Potato','Mango', 'Lemon','Carrot']);
```
```sh
['Avocado', 'Tomato', 'Potato','Mango', 'LEMON', 'Carrot']
```
```js
console.log(modifyArray(['Google', 'Facebook','Apple', 'Amazon','Microsoft', 'IBM']);
```
```sh
['Google', 'Facebook','Apple', 'Amazon','MICROSOFT', 'IBM']
```
```js
console.log(modifyArray(['Google', 'Facebook','Apple', 'Amazon']);
```
```sh
'Not Found'
```
1. សរសេរមុខងារមួយហៅថា _isPrime_ ដែលពិនិត្យមើលថាតើលេខមួយគឺជាលេខបឋមឬអត់។
1.សរសេរមុខងារដែលពិនិត្យមើលថាតើធាតុទាំងអស់មានតែមួយគត់នៅក្នុងអារេ។
1. សរសេរមុខងារដែលពិនិត្យមើលថាតើធាតុទាំងអស់នៃអារេគឺជាប្រភេទទិន្នន័យដូចគ្នាឬអត់។
1. ឈ្មោះអថេរ JavaScript មិនគាំទ្រតួអក្សរ ឬនិមិត្តសញ្ញាពិសេស លើកលែងតែ \$ ឬ \_ ។ សរសេរមុខងារ **isValidVariable** ដែលពិនិត្យមើលថាតើអថេរមួយត្រឹមត្រូវ ឬអថេរអថេរ។
1. សរសេរអនុគមន៍ដែលត្រឡប់អារេនៃលេខចៃដន្យប្រាំពីរក្នុងជួរ 0-9 ។ លេខទាំងអស់ត្រូវតែមានតែមួយ។
```js
sevenRandomNumbers()
[(1, 4, 5, 7, 9, 8, 0)]
```
1. សរសេរអនុគមន៍មួយហៅថា reverseCountries វាយកប្រទេសអារេ ហើយដំបូងវាចម្លងអារេ ហើយត្រឡប់អារេបញ្ច្រាសដើម
🎉 អបអរសាទរ ! 🎉
[<< ថ្ងៃទី 6](../06_Day_Loops/06_day_loops.md) | [ថ្ងៃទី 8 >>](../08_Day_Objects/08_day_objects.md)

598
Khmer/08_Day_Objects/08_day_objects.md
Unescape View File

@ -0,0 +1,598 @@
<div align="center">
<h1> 30 ថ្ងៃនៃ JavaScript: Objects</h1>
<a class="header-badge" target="_blank" href="https://www.linkedin.com/in/asabeneh/">
<img src="https://img.shields.io/badge/style--5eba00.svg?label=LinkedIn&logo=linkedin&style=social">
</a>
<a class="header-badge" target="_blank" href="https://twitter.com/Asabeneh">
<img alt="Twitter Follow" src="https://img.shields.io/twitter/follow/asabeneh?style=social">
</a>
<sub>អ្នកនិពន្ធ:
<a href="https://www.linkedin.com/in/asabeneh/" target="_blank">Asabeneh Yetayeh</a><br>
<small> ខែមករា ឆ្នាំ ២០២០</small>
</sub>
</div>
[<< ថ្ងៃទី 7](../07_Day_Functions/07_day_functions.md) | [ថ្ងៃទី 9 >>](../09_Day_Higher_order_functions/09_day_higher_order_functions.md)
![Thirty Days Of JavaScript](../images/banners/day_1_8.png)
- [📔 ថ្ងៃទី 8](#-day-8)
- [Scope](#scope)
- [Window Global Object](#window-global-object)
- [Global scope](#global-scope)
- [Local scope](#local-scope)
- [📔 Object](#-object)
- [ការបង្កើត object ទទេ](#creating-an-empty-object)
- [ការបង្កើត object ជាមួយនឹងតម្លៃ](#creating-an-objecting-with-values)
- [ទាញតម្លៃពី object](#getting-values-from-an-object)
- [ការបង្កើត object methods](#creating-object-methods)
- [ការកំណត់ key សម្រាប់ object](#setting-new-key-for-an-object)
- [Object Methods](#object-methods)
- [ចាប់យក key ពី object ដោយប្រើ Object.keys()](#getting-object-keys-using-objectkeys)
- [ចាប់យកតម្លៃពី object ដោយប្រើ Object.values()](#getting-object-values-using-objectvalues)
- [ចាប់យក key និង តម្លៃ ពី object ដោយប្រើ Object.entries()](#getting-object-keys-and-values-using-objectentries)
- [ពិនិត្យមើល properties ដោយប្រើ hasOwnProperty()](#checking-properties-using-hasownproperty)
- [💻 លំហាត់](#-exercises)
- [លំហាត់៖ កម្រិត ១](#exercises-level-1)
- [លំហាត់៖ កម្រិត ២](#exercises-level-2)
- [លំហាត់៖ កម្រិត ៣](#exercises-level-3)
# 📔 ថ្ងៃទី 8
## Scope
variable គឺជាផ្នែកមូលដ្ឋានក្នុងការសរសេរកម្មវិធី។ យើងប្រកាស variable ដើម្បីរក្សាទុកប្រភេទទិន្នន័យផ្សេងៗគ្នា។ ដើម្បីប្រកាស variable យើងប្រើពាក្យគន្លឹះ _var_, _let_ និង _const_ ។ variable អាចត្រូវបានប្រកាសនៅ scope ផ្សេងៗគ្នា។ ក្នុង​ផ្នែក​នេះ យើង​នឹង​មើលលើ scope ​នៃ variable scope ​នៃ​អថេរ​ពេល​យើង​ប្រើ var ឬ let ។
variable scope អាចជា៖
- Global
- Local
variable អាចត្រូវបានប្រកាសជា global scope រឺក៏ local scope។
អ្វី​ដែល​បាន​ប្រកាស​ដោយ​មិនប្រើ let, var ឬ const ត្រូវ​បាន​កំណត់​ក្នុង​កម្រិត​សកល។
អនុញ្ញាតឱ្យយើងស្រមៃថាយើងមានឯកសារ scope.js ។
### Window Global Object
ដោយមិនប្រើ console.log() បើកកម្មវិធីរុករករបស់អ្នក ហើយពិនិត្យ អ្នកនឹងឃើញតម្លៃ a និង b ប្រសិនបើអ្នកសរសេរ a ឬ b នៅលើ browser ។ នោះមានន័យថា a និង b មានរួចហើយនៅក្នុង window។
```js
//scope.js
a = 'JavaScript' // ការប្រកាសអថេរដោយមិនប្រើ let ឬ const ធ្វើឱ្យវាមាននៅក្នុង window object ហើយអាចរកឃើញគ្រប់ទីកន្លែង
b = 10 // នេះគឺជា variable scope សកល ហើយបានរកឃើញនៅក្នុង window object
function letsLearnScope() {
console.log(a, b)
if (true) {
console.log(a, b)
}
}
console.log(a, b) // អាចចូលប្រើបាន
```
### Global scope
អថេរ​ដែល​បាន​ប្រកាស​ជា​សកល​អាច​ចូល​ប្រើ​បាន​គ្រប់​ទីកន្លែង​ក្នុង​ឯកសារ​តែមួយ។ ប៉ុន្តែពាក្យសកលគឺទាក់ទង។ វាអាចជាសកលសម្រាប់ឯកសារ ឬវាអាចជាសកលទាក់ទងនឹងប្លុកនៃកូដមួយចំនួន។
```js
//scope.js
let a = 'JavaScript' // គឺជា scope សកល វានឹងត្រូវបានរកឃើញគ្រប់ទីកន្លែងនៅក្នុងឯកសារនេះ។
let b = 10 // គឺជា scope សកល វានឹងត្រូវបានរកឃើញគ្រប់ទីកន្លែងនៅក្នុងឯកសារនេះ។
function letsLearnScope() {
console.log(a, b) // JavaScript 10, accessible
if (true) {
let a = 'Python'
let b = 100
console.log(a, b) // Python 100
}
console.log(a, b)
}
letsLearnScope()
console.log(a, b) // JavaScript 10, accessible
```
### Local scope
variable ដែលបានប្រកាសថាជា local អាចចូលប្រើបានតែនៅក្នុងកូដប្លុកជាក់លាក់ប៉ុណ្ណោះ។
- Block Scope
- Function Scope
```js
//scope.js
let a = 'JavaScript' // គឺជា scope សកល វានឹងត្រូវបានរកឃើញគ្រប់ទីកន្លែងនៅក្នុងឯកសារនេះ។
let b = 10 // គឺជា scope សកល វានឹងត្រូវបានរកឃើញគ្រប់ទីកន្លែងនៅក្នុងឯកសារនេះ។
// Function scope
function letsLearnScope() {
console.log(a, b) // JavaScript 10, accessible
let value = false
// block scope
if (true) {
// យើងអាចចូលប្រើបានពីមុខងារ និងនៅខាងក្រៅមុខងារ ប៉ុន្តែ
// variable ដែលបានប្រកាសនៅខាងក្នុង if នឹងមិនអាចប្រើនៅខាងក្រៅ if block
let a = 'Python'
let b = 20
let c = 30
let d = 40
value = !value
console.log(a, b, c, value) // Python 20 30 true
}
// យើងមិនអាចចូលប្រើ c ព្រោះ scope របស់ c គឺមានតែ if block ប៉ុណ្ណោះ។
console.log(a, b, value) // JavaScript 10 true
}
letsLearnScope()
console.log(a, b) // JavaScript 10, accessible
```
ឥឡូវនេះ អ្នកមានការយល់ដឹងអំពី scope។ variable ​ដែល​បាន​ប្រកាស​ដោយ *var* ដែល​មាន​ scope ​សម្រាប់​តែ​ function ប៉ុន្តែ​អថេរ​ដែលបាន​ប្រកាស​ដោយ *let* ឬ *const* គឺ​ជា block scope (function block, if block, loop block, etc)។ ប្លុកនៅក្នុង JavaScript គឺជាកូដមួយនៅចន្លោះតង្កៀបអង្កាញ់ពីរ ({})។
```js
//scope.js
function letsLearnScope() {
var gravity = 9.81
console.log(gravity)
}
// console.log(gravity), Uncaught ReferenceError: gravity is not defined
if (true){
var gravity = 9.81
console.log(gravity) // 9.81
}
console.log(gravity) // 9.81
for(var i = 0; i < 3; i++){
console.log(i) // 0, 1, 2
}
console.log(i) // 3
```
នៅក្នុង ES6 និងខ្ពស់ជាងនេះមាន *let* និង *const* ដូច្នេះអ្នកនឹងមិនទទួលរងពីភាពមិនច្បាស់លាស់នៃ *var* នោះទេ។ នៅពេលយើងប្រើ *let* អថេររបស់យើងត្រូវបានទប់ស្កាត់ ហើយវានឹងមិនឆ្លងផ្នែកផ្សេងទៀតនៃកូដរបស់យើងទេ។
```js
//scope.js
function letsLearnScope() {
// អ្នកអាចប្រើ let ឬ const ប៉ុន្តែទំនាញគឺថេរ ចឹងខ្ញុំនិងប្រើ const
const gravity = 9.81
console.log(gravity)
}
// console.log(gravity), Uncaught ReferenceError: gravity is not defined
if (true){
const gravity = 9.81
console.log(gravity) // 9.81
}
// console.log(gravity), Uncaught ReferenceError: gravity is not defined
for(let i = 0; i < 3; i++){
console.log(i) // 0, 1, 2
}
// console.log(i), Uncaught ReferenceError: i is not defined
```
The scope *let* and *const* are the same. The difference is only reassigning. We can not change or reassign the value of the `const` variable. I would strongly suggest you to use *let* and *const*, by using *let* and *const* you will write clean code and avoid hard to debug mistakes. As a rule of thumb, you can use *let* for any value which change, *const* for any constant value, and for an array, object, arrow function and function expression.
scope *let* និង *const* គឺដូចគ្នា។ ភាពខុសគ្នាគឺគ្រាន់តែជាការចាត់តាំងឡើងវិញប៉ុណ្ណោះ។ យើងមិនអាចផ្លាស់ប្តូរ ឬកំណត់តម្លៃនៃអថេរ `const` ឡើងវិញបានទេ។ ខ្ញុំសូមណែនាំអ្នកឱ្យប្រើ *let* និង *const* ដោយប្រើ *let* និង *const* អ្នកនឹងសរសេរកូដស្អាត ហើយជៀសវាងការលំបាកក្នុង debug កំហុស។ តាមក្បួន អ្នកអាចប្រើ *let* សម្រាប់តម្លៃណាមួយដែលផ្លាស់ប្តូរ *const* សម្រាប់តម្លៃថេរណាមួយ និងសម្រាប់អារេ object, arrow function និងកន្សោម function។
## 📔 Object
អ្វីគ្រប់យ៉ាងអាចជា object មួយ ហើយ object មានលក្ខណៈសម្បត្តិ ហើយលក្ខណៈសម្បត្តិមានតម្លៃ ដូច្នេះ object គឺជាគូ key និង value លំដាប់នៃ key មិនត្រូវបានបម្រុងទុកឬមិនមានលំដាប់។
ដើម្បីបង្កើត object literal យើងប្រើតង្កៀបអង្កាញ់ពីរ។
### ការបង្កើត object ទទេ
object ទទេ
```js
const person = {}
```
### ការបង្កើត object ជាមួយនឹងតម្លៃ
ឥឡូវនេះ person object មាន firstName, lastName, age, location, skills និង isMarried property។ តម្លៃនៃ property ឬ key អាចជា string, number, boolean, object, null, undefined រឺក៏ function
ចូរយើងមើលឧទាហរណ៍ខ្លះនៃ object។ key នីមួយៗមានតម្លៃនៅក្នុង object។
```js
const rectangle = {
length: 20,
width: 20
}
console.log(rectangle) // {length: 20, width: 20}
const person = {
firstName: 'Asabeneh',
lastName: 'Yetayeh',
age: 250,
country: 'Finland',
city: 'Helsinki',
skills: [
'HTML',
'CSS',
'JavaScript',
'React',
'Node',
'MongoDB',
'Python',
'D3.js'
],
isMarried: true
}
console.log(person)
```
### ទាញយកតម្លៃពី object
យើងអាចចូលប្រើតម្លៃនៃ object ដោយប្រើវិធីពីរយ៉ាង៖
- ការប្រើប្រាស់ . បន្តដោយឈ្មោះគន្លឹះ ប្រសិនបើ key-name គឺជាពាក្យតែមួយ
- ដោយប្រើតង្កៀបការ៉េ និង quote
```js
const person = {
firstName: 'Asabeneh',
lastName: 'Yetayeh',
age: 250,
country: 'Finland',
city: 'Helsinki',
skills: [
'HTML',
'CSS',
'JavaScript',
'React',
'Node',
'MongoDB',
'Python',
'D3.js'
],
getFullName: function() {
return `${this.firstName}${this.lastName}`
},
'phone number': '+3584545454545'
}
// ការចូលប្រើតម្លៃដោយប្រើ .
console.log(person.firstName)
console.log(person.lastName)
console.log(person.age)
console.log(person.location) // undefined
// តម្លៃអាចត្រូវបានចូលប្រើដោយប្រើតង្កៀបការ៉េ និងឈ្មោះ key
console.log(person['firstName'])
console.log(person['lastName'])
console.log(person['age'])
console.log(person['age'])
console.log(person['location']) // undefined
// ឧទាហរណ៍ ដើម្បីចូលប្រើលេខទូរស័ព្ទ យើងប្រើតែវិធីតង្កៀបការ៉េប៉ុណ្ណោះ។
console.log(person['phone number'])
```
### ការបង្កើត object methods
ឥឡូវនេះ person object មាន getFullName property។ getFullName គឺជា function ខាងក្នុងរបស់ person object ហើយយើងហៅវាថា object method។ ពាក្យគន្លឹះ _this_ សំដៅលើ object ខ្លួនឯង។ យើង​អាច​ប្រើ​ពាក្យ _this_ ដើម្បី​ចូល​ប្រើ​តម្លៃ​នៃ​លក្ខណៈ​សម្បត្តិ​ផ្សេងៗ​របស់​វត្ថុ។ យើងមិនអាចប្រើ arrow function ជា object method បានទេ ព្រោះពាក្យនេះសំដៅលើ window នៅខាងក្នុងមុខងារ arrow ជំនួសឱ្យ object ផ្ទាល់។ ឧទាហរណ៍នៃ object
```js
const person = {
firstName: 'Asabeneh',
lastName: 'Yetayeh',
age: 250,
country: 'Finland',
city: 'Helsinki',
skills: [
'HTML',
'CSS',
'JavaScript',
'React',
'Node',
'MongoDB',
'Python',
'D3.js'
],
getFullName: function() {
return `${this.firstName} ${this.lastName}`
}
}
console.log(person.getFullName())
// Asabeneh Yetayeh
```
### ការកំណត់ key ថ្មីសម្រាប់ object
វត្ថុគឺជារចនាសម្ព័ន្ធទិន្នន័យដែលអាចផ្លាស់ប្តូរបានហើយយើងអាចកែប្រែតម្លៃនៃ objectមួយបន្ទាប់ពីវាបង្កើតរួច។
ការកំណត់ key ថ្មីសម្រាប់ object
```js
const person = {
firstName: 'Asabeneh',
lastName: 'Yetayeh',
age: 250,
country: 'Finland',
city: 'Helsinki',
skills: [
'HTML',
'CSS',
'JavaScript',
'React',
'Node',
'MongoDB',
'Python',
'D3.js'
],
getFullName: function() {
return `${this.firstName} ${this.lastName}`
}
}
person.nationality = 'Ethiopian'
person.country = 'Finland'
person.title = 'teacher'
person.skills.push('Meteor')
person.skills.push('SasS')
person.isMarried = true
person.getPersonInfo = function() {
let skillsWithoutLastSkill = this.skills
.splice(0, this.skills.length - 1)
.join(', ')
let lastSkill = this.skills.splice(this.skills.length - 1)[0]
let skills = `${skillsWithoutLastSkill}, and ${lastSkill}`
let fullName = this.getFullName()
let statement = `${fullName} is a ${this.title}.\nHe lives in ${this.country}.\nHe teaches ${skills}.`
return statement
}
console.log(person)
console.log(person.getPersonInfo())
```
```sh
Asabeneh Yetayeh is a teacher.
He lives in Finland.
He teaches HTML, CSS, JavaScript, React, Node, MongoDB, Python, D3.js, Meteor, and SasS.
```
### Object Methods
មាន method ផ្សេងគ្នាដើម្បីរៀបចំ object។ អនុញ្ញាតឱ្យយើងមើល method យចំនួនដែលមាន។
_Object.assign_: ដើម្បីចម្លង object ដោយមិនកែប្រែ object ដើម
```js
const person = {
firstName: 'Asabeneh',
age: 250,
country: 'Finland',
city:'Helsinki',
skills: ['HTML', 'CSS', 'JS'],
title: 'teacher',
address: {
street: 'Heitamienkatu 16',
pobox: 2002,
city: 'Helsinki'
},
getPersonInfo: function() {
return `I am ${this.firstName} and I live in ${this.city}, ${this.country}. I am ${this.age}.`
}
}
//Object methods: Object.assign, Object.keys, Object.values, Object.entries
//hasOwnProperty
const copyPerson = Object.assign({}, person)
console.log(copyPerson)
```
#### ទាញយក object key ដោយប្រើ Object.keys()
_Object.keys_: ដើម្បីទទួលបាន key ឬ property របស់វត្ថុជាអារេ
```js
const keys = Object.keys(copyPerson)
console.log(keys) //['firstName', 'age', 'country','city', 'skills','title', 'address', 'getPersonInfo']
const address = Object.keys(copyPerson.address)
console.log(address) //['street', 'pobox', 'city']
```
#### ទាញយក object value ដោយប្រើ Object.keys()
_Object.values_:ដើម្បីទទួលបានតម្លៃនៃវត្ថុជាអារេ
```js
const values = Object.values(copyPerson)
console.log(values)
```
#### ទាញយក object value និង key ដោយប្រើ Object.entries()
_Object.entries_:ដើម្បីទទួលបាន key និងតម្លៃនៅក្នុងអារេមួយ។
```js
const entries = Object.entries(copyPerson)
console.log(entries)
```
#### ពិនិត្យ property ដោយប្រើ hasOwnProperty()
_hasOwnProperty_: ដើម្បី​ពិនិត្យ​មើល​ថា​តើ​ key ឬ​ property មាន​ក្នុង​វត្ថុ​ឬ​អត់
```js
console.log(copyPerson.hasOwnProperty('name'))
console.log(copyPerson.hasOwnProperty('score'))
```
🌕 អ្នកពិតជាគួរឲភ្ញាក់ផ្អើលណាស់។ អ្នកទើបតែបានបញ្ចប់ challenge ថ្ងៃទី 8 ហើយអ្នកបានឈាន 8 ជំហាន ឆ្ពោះទៅរកភាពអស្ចារ្យ។ ឥឡូវធ្វើលំហាត់ខ្លះសម្រាប់ខួរក្បាល និងសាច់ដុំរបស់អ្នក។
## 💻 លំហាត់
### លំហាត់៖ កម្រិត ១
1. បង្កើត object ទទេមួយហៅថាឆ្កែ
1. បង្ហាញ object ឆ្កែនៅលើកុងសូល។
1. បន្ថែមឈ្មោះ ជើង ពណ៌ អាយុ និងលក្ខណៈសម្បត្តិ bark សម្រាប់វត្ថុឆ្កែ។ លក្ខណសម្បត្តិ bark គឺជា method ដែលឲ _woof woof_
1. ទាញយកឈ្មោះ ជើង ពណ៌ អាយុ និងតម្លៃ bark ពី object ឆ្កែ
1. កំណត់លក្ខណៈសម្បត្តិថ្មីនៃ object ឆ្កែ៖ ពូជ getDogInfo
### លំហាត់៖ កម្រិត ២
1. ស្វែងរកមនុស្សដែលមានជំនាញជាច្រើននៅក្នុង object user
1. រាប់​អ្នក​ប្រើ​ដែល​ចូល រាប់​អ្នក​ប្រើ​ដែល​មាន​ចំនួន​ធំ​ជាង​ស្មើ​នឹង 50 ពិន្ទុ​ពី​ object ​ខាងក្រោម។
````js
const users = {
Alex: {
email: 'alex@alex.com',
skills: ['HTML', 'CSS', 'JavaScript'],
age: 20,
isLoggedIn: false,
points: 30
},
Asab: {
email: 'asab@asab.com',
skills: ['HTML', 'CSS', 'JavaScript', 'Redux', 'MongoDB', 'Express', 'React', 'Node'],
age: 25,
isLoggedIn: false,
points: 50
},
Brook: {
email: 'daniel@daniel.com',
skills: ['HTML', 'CSS', 'JavaScript', 'React', 'Redux'],
age: 30,
isLoggedIn: true,
points: 50
},
Daniel: {
email: 'daniel@alex.com',
skills: ['HTML', 'CSS', 'JavaScript', 'Python'],
age: 20,
isLoggedIn: false,
points: 40
},
John: {
email: 'john@john.com',
skills: ['HTML', 'CSS', 'JavaScript', 'React', 'Redux', 'Node.js'],
age: 20,
isLoggedIn: true,
points: 50
},
Thomas: {
email: 'thomas@thomas.com',
skills: ['HTML', 'CSS', 'JavaScript', 'React'],
age: 20,
isLoggedIn: false,
points: 40
},
Paul: {
email: 'paul@paul.com',
skills: ['HTML', 'CSS', 'JavaScript', 'MongoDB', 'Express', 'React', 'Node'],
age: 20,
isLoggedIn: false,
points: 40
}
}```
1. ស្វែងរកមនុស្សដែលជាអ្នកអភិវឌ្ឍន៍ MERN ពី object អ្នកប្រើប្រាស់
1. កំណត់ឈ្មោះរបស់អ្នកនៅក្នុង user object ដោយមិនកែប្រែវ user object ដើម
1. ទាញយក key ឬ property ទាំងអស់របស់វត្ថុអ្នកប្រើប្រាស់
1. ទទួលបានតម្លៃទាំងអស់នៃ object user
1. ប្រើវត្ថុប្រទេសដើម្បីបោះពុម្ពឈ្មោះប្រទេស រាជធានី ចំនួនប្រជាជន និងភាសា។
### លំហាត់៖ កម្រិត ៣
1. បង្កើត object literal ដែលហៅថា _personAccount_ ។ វាមាន _firstName, lastName, incomes, cost_ properties ហើយវាមាន _totalIncome, totalExpense, accountInfo, addIncome, addExpense_ និង _accountBalance_ method។ ប្រាក់ចំណូល គឺជាសំណុំនៃប្រាក់ចំណូល ហើយការពិពណ៌នា និងការចំណាយរបស់វា គឺជាសំណុំនៃប្រាក់ចំណូល និងការពិពណ៌នារបស់វា។
2. **** សំណួរ៖ 2, 3 និង 4 គឺផ្អែកលើអារេពីរខាងក្រោម៖ user និង product ()
```js
const users = [
{
_id: 'ab12ex',
username: 'Alex',
email: 'alex@alex.com',
password: '123123',
createdAt:'08/01/2020 9:00 AM',
isLoggedIn: false
},
{
_id: 'fg12cy',
username: 'Asab',
email: 'asab@asab.com',
password: '123456',
createdAt:'08/01/2020 9:30 AM',
isLoggedIn: true
},
{
_id: 'zwf8md',
username: 'Brook',
email: 'brook@brook.com',
password: '123111',
createdAt:'08/01/2020 9:45 AM',
isLoggedIn: true
},
{
_id: 'eefamr',
username: 'Martha',
email: 'martha@martha.com',
password: '123222',
createdAt:'08/01/2020 9:50 AM',
isLoggedIn: false
},
{
_id: 'ghderc',
username: 'Thomas',
email: 'thomas@thomas.com',
password: '123333',
createdAt:'08/01/2020 10:00 AM',
isLoggedIn: false
}
];
const products = [
{
_id: 'eedfcf',
name: 'mobile phone',
description: 'Huawei Honor',
price: 200,
ratings: [
{ userId: 'fg12cy', rate: 5 },
{ userId: 'zwf8md', rate: 4.5 }
],
likes: []
},
{
_id: 'aegfal',
name: 'Laptop',
description: 'MacPro: System Darwin',
price: 2500,
ratings: [],
likes: ['fg12cy']
},
{
_id: 'hedfcg',
name: 'TV',
description: 'Smart TV:Procaster',
price: 400,
ratings: [{ userId: 'fg12cy', rate: 5 }],
likes: ['fg12cy']
}
]
```
ស្រមៃថាអ្នកកំពុងទទួលបានអ្នកប្រើប្រាស់ខាងលើពីមូលដ្ឋានទិន្នន័យ MongoDB ។
a. បង្កើត functionមួយហៅថា signUp ដែលអនុញ្ញាតឱ្យបន្ថែមអ្នកប្រើទៅបណ្តុំ។ ប្រសិនបើមានអ្នកប្រើប្រាស់ហើយ សូមជូនដំណឹងដល់អ្នកប្រើប្រាស់ថាគាត់មានគណនីរួចហើយ។
b. បង្កើត function មួយហៅថា signIn ដែលអនុញ្ញាតឱ្យអ្នកប្រើចូលកម្មវិធី
3. អារេផលិតផលមានធាតុបី ហើយពួកវានីមួយៗមាន property ប្រាំមួយ។
a. បង្កើតមុខងារមួយហៅថា rateProduct ដែលវាយតម្លៃផលិតផល
b. បង្កើតមុខងារមួយហៅថា averageRating ដែលគណនាការវាយតម្លៃជាមធ្យមនៃផលិតផល
4. បង្កើតមុខងារមួយហៅថា likeProduct។ មុខងារ​នេះ​នឹង​ជួយ​ឱ្យ​ចូលចិត្ត​ផលិតផល​ប្រសិន​បើ​វា​មិន​ត្រូវ​បាន​គេ​ចូល​ចិត្ត​និង​លុប​ការ​ចូលចិត្ត​ប្រសិន​បើ​វា​ត្រូវ​បាន​គេ​ចូល​ចិត្តរួចហើយ​។
🎉 អបអរសាទរ ! 🎉
[<< ថ្ងៃទី 7](../07_Day_Functions/07_day_functions.md) | [ថ្ងៃទី 9 >>](../09_Day_Higher_order_functions/09_day_higher_order_functions.md)

704
Khmer/09_Day_Higher_order_functions/09_day_higher_order_functions.md
Unescape View File

@ -0,0 +1,704 @@
<div align="center">
<h1> 30 ថ្ងៃនៃ JavaScript: Higher Order Functions</h1>
<a class="header-badge" target="_blank" href="https://www.linkedin.com/in/asabeneh/">
<img src="https://img.shields.io/badge/style--5eba00.svg?label=LinkedIn&logo=linkedin&style=social">
</a>
<a class="header-badge" target="_blank" href="https://twitter.com/Asabeneh">
<img alt="Twitter Follow" src="https://img.shields.io/twitter/follow/asabeneh?style=social">
</a>
<sub>អ្នកនិពន្ធ:
<a href="https://www.linkedin.com/in/asabeneh/" target="_blank">Asabeneh Yetayeh</a><br>
<small> ខែមករា ឆ្នាំ ២០២០</small>
</sub>
</div>
[<< ថ្ងៃទី 8](../08_Day_Objects/08_day_objects.md) | [ថ្ងៃទី 10 >>](../10_Day_Sets_and_Maps/10_day_Sets_and_Maps.md)
![ថ្ងៃទី 9](../images/banners/day_1_9.png)
- [ថ្ងៃទី 9](#day-9)
- [Higher Order Function](#higher-order-function)
- [Callback](#callback)
- [ត្រឡប់ function ជាតម្លៃ](#returning-function)
- [ការកំណត់ពេលវេលា](#setting-time)
- [កំណត់ចន្លោះពេលដោយប្រើមុខងារ setInterval](#setting-interval-using-a-setinterval-function)
- [កំណត់ពេលវេលាដោយប្រើ setTimeout](#setting-a-time-using-a-settimeout)
- [Functional Programming](#functional-programming)
- [forEach](#foreach)
- [map](#map)
- [filter](#filter)
- [reduce](#reduce)
- [every](#every)
- [find](#find)
- [findIndex](#findindex)
- [some](#some)
- [sort](#sort)
- [ការតម្រៀបតម្លៃ string](#sorting-string-values)
- [ការតម្រៀបតម្លៃលេខ](#sorting-numeric-values)
- [ការតម្រៀប Object Arrays](#sorting-object-arrays)
- [💻 លំហាត់](#-exercises)
- [លំហាត់៖ កម្រិត ១](#exercises-level-1)
- [លំហាត់៖ កម្រិត ២](#exercises-level-2)
- [លំហាត់៖ កម្រិត ៣](#exercises-level-3)
# ថ្ងៃទី 9
## Higher Order Function
Higher order functions គឺជាអនុគមន៍ដែលយកអនុគមន៍ផ្សេងទៀតជាប៉ារ៉ាម៉ែត្រ ឬត្រឡប់អនុគមន៍ជាតម្លៃ។ អនុគមន៍​ដែល​បាន​បោះ​ជា​ប៉ារ៉ាម៉ែត្រ​ត្រូវ​បាន​ហៅ​ថា​ហៅថា callback។
### Callback
callback គឺជា function ដែលអាចត្រូវបានបញ្ជូនជាប៉ារ៉ាម៉ែត្រទៅ function ផ្សេងទៀត។ សូមមើលឧទាហរណ៍ខាងក្រោម។
```js
// function callback អាចជាឈ្មោះណាមួយ។
const callback = (n) => {
return n ** 2
}
​
// function ដែលយក function ផ្សេងទៀតជា callback
function cube(callback, n) {
return callback(n) * n
}
​
console.log(cube(callback, 3))
```
### ត្រឡប់ function ជាតម្លៃ
Higher order functions ត្រឡប់ function ជាតម្លៃ
​
```js
// Higher order function ត្រឡប់ function ជាតម្លៃ
const higherOrder = n => {
const doSomething = m => {
const doWhatEver = t => {
return 2 * n + 3 * m + t
}
return doWhatEver
}
return doSomething
}
console.log(higherOrder(2)(3)(10))
```
អនុញ្ញាតឱ្យយើងមើលការប្រើ callback function។ ឧទាហរណ៍វិធីសាស្ត្រ _forEach_ ប្រើ callback function។
```js
const numbers = [1, 2, 3, 4, 5]
const sumArray = arr => {
let sum = 0
const callback = function(element) {
sum += element
}
arr.forEach(callback)
return sum
}
console.log(sumArray(numbers))
```
```sh
15
```
ឧទាហរណ៍ខាងលើអាចត្រូវបានធ្វើឱ្យសាមញ្ញដូចខាងក្រោម:
```js
const numbers = [1, 2, 3, 4]
​
const sumArray = arr => {
let sum = 0
arr.forEach(function(element) {
sum += element
})
return sum
}
console.log(sumArray(numbers))
```
```sh
15
```
### ការកំណត់ពេលវេលា
នៅក្នុង JavaScript យើងអាចប្រតិបត្តិសកម្មភាពមួយចំនួនក្នុងចន្លោះពេលជាក់លាក់មួយ ឬយើងអាចកំណត់ពេល (រង់ចាំ) សម្រាប់ពេលខ្លះដើម្បីប្រតិបត្តិសកម្មភាពមួយចំនួន។
- setInterval
- setTimeout
#### កំណត់ចន្លោះពេលដោយប្រើមុខងារ setInterval
នៅក្នុង JavaScript យើងប្រើ higher order function setInterval ដើម្បីធ្វើសកម្មភាពមួយចំនួនជាបន្តបន្ទាប់ក្នុងចន្លោះពេលមួយចំនួន។ វិធីសាស្ត្រសកល setInterval យក callback function និងរយៈពេលជាប៉ារ៉ាម៉ែត្រ។ រយៈពេលគឺគិតជាមិល្លីវិនាទី ហើយ callback នឹងតែងតែត្រូវបានហៅក្នុងចន្លោះពេលនោះ។
```js
// syntax
function callback() {
// code goes here
}
setInterval(callback, duration)
```
```js
function sayHello() {
console.log('Hello')
}
setInterval(sayHello, 1000) // វាបោះពុម្ពជំរាបសួររៀងរាល់វិនាទី 1000ms គឺ 1s
```
#### កំណត់ពេលវេលាដោយប្រើ setTimeout
នៅក្នុង JavaScript យើងប្រើ higher order function setTimeout ដើម្បីប្រតិបត្តិសកម្មភាពមួយចំនួននៅពេលអនាគត។ វិធីសាស្ត្រសកល setTimeout យកមុខងារ callback និងរយៈពេលជាប៉ារ៉ាម៉ែត្រ។ ថិរវេលាគឺគិតជាមិល្លីវិនាទី ហើយការហៅត្រឡប់មកវិញរង់ចាំសម្រាប់ពេលវេលានោះ។
```js
// syntax
function callback() {
// code goes here
}
setTimeout(callback, duration) // រយៈពេលគិតជាមិល្លីវិនាទី
```
```js
function sayHello() {
console.log('Hello')
}
setTimeout(sayHello, 2000)
```
## Functional Programming
ជំនួសឱ្យការសរសេររង្វិលជុំធម្មតា កំណែចុងក្រោយបំផុតនៃ JavaScript បានណែនាំវិធីសាស្រ្តជាច្រើនដែលអាចជួយយើងក្នុងការដោះស្រាយបញ្ហាស្មុគស្មាញ។ រាល់វិធីសាស្រ្តដែលភ្ជាប់មកជាមួយ callback function។ នៅក្នុងផ្នែកនេះ យើងនឹងឃើញ _forEach_, _map_, _filter_, _reduce_, _find_, _every_, _some_, និង _sort_។
### forEach
_forEach_: iterate នូវធាតុអារេ។ យើងប្រើ _forEach_ តែជាមួយអារេ។ វាត្រូវការ callback function ជាមួយធាតុ ប៉ារ៉ាម៉ែត្រសន្ទស្សន៍ និងអារេខ្លួនឯង។ សន្ទស្សន៍ និងអារេជាជម្រើស។
```js
arr.forEach(function (element, index, arr) {
console.log(index, element, arr)
})
// កូដខាងលើអាចត្រូវបានសរសេរដោយប្រើ arrow function
arr.forEach((element, index, arr) => {
console.log(index, element, arr)
})
// កូដខាងលើអាចត្រូវបានសរសេរដោយប្រើ arrow function និងការត្រឡប់មកវិញយ៉ាងច្បាស់
arr.forEach((element, index, arr) => console.log(index, element, arr))
```
```js
let sum = 0;
const numbers = [1, 2, 3, 4, 5];
numbers.forEach(num => console.log(num))
console.log(sum)
```
```sh
1
2
3
4
5
```
```js
let sum = 0;
const numbers = [1, 2, 3, 4, 5];
numbers.forEach(num => sum += num)
console.log(sum)
```
```sh
15
```
```js
const countries = ['Finland', 'Denmark', 'Sweden', 'Norway', 'Iceland']
countries.forEach((element) => console.log(element.toUpperCase()))
```
```sh
FINLAND
DENMARK
SWEDEN
NORWAY
ICELAND
```
### map
_map_: iterate នូវធាតុអារេ និងកែប្រែធាតុអារេ។ វាត្រូវការ callback function ជាមួយធាតុ សន្ទស្សន៍ ប៉ារ៉ាម៉ែត្រអារេ ហើយត្រឡប់អារេថ្មី។
```js
const modifiedArray = arr.map(function (element, index, arr) {
return element
})
```
```js
/*Arrow function and explicit return
const modifiedArray = arr.map((element,index) => element);
*/
//ឧទាហរណ៍
const numbers = [1, 2, 3, 4, 5]
const numbersSquare = numbers.map((num) => num * num)
console.log(numbersSquare)
```
```sh
[1, 4, 9, 16, 25]
```
```js
const names = ['Asabeneh', 'Mathias', 'Elias', 'Brook']
const namesToUpperCase = names.map((name) => name.toUpperCase())
console.log(namesToUpperCase)
```
```sh
['ASABENEH', 'MATHIAS', 'ELIAS', 'BROOK']
```
```js
const countries = [
'Albania',
'Bolivia',
'Canada',
'Denmark',
'Ethiopia',
'Finland',
'Germany',
'Hungary',
'Ireland',
'Japan',
'Kenya',
]
const countriesToUpperCase = countries.map((country) => country.toUpperCase())
console.log(countriesToUpperCase)
/*
// Arrow function
const countriesToUpperCase = countries.map((country) => {
return country.toUpperCase();
})
//Explicit return arrow function
const countriesToUpperCase = countries.map(country => country.toUpperCase());
*/
```
```sh
['ALBANIA', 'BOLIVIA', 'CANADA', 'DENMARK', 'ETHIOPIA', 'FINLAND', 'GERMANY', 'HUNGARY', 'IRELAND', 'JAPAN', 'KENYA']
```
```js
const countriesFirstThreeLetters = countries.map((country) =>
country.toUpperCase().slice(0, 3)
)
```
```sh
 ["ALB", "BOL", "CAN", "DEN", "ETH", "FIN", "GER", "HUN", "IRE", "JAP", "KEN"]
```
### filter
_Filter_: ត្រងធាតុដែលបំពេញលក្ខខណ្ឌហើយត្រឡប់អារេថ្មី។
```js
//ត្រងប្រទេសដែលមាន land
const countriesContainingLand = countries.filter((country) =>
country.includes('land')
)
console.log(countriesContainingLand)
```
```sh
['Finland', 'Ireland']
```
```js
const countriesEndsByia = countries.filter((country) => country.endsWith('ia'))
console.log(countriesEndsByia)
```
```sh
['Albania', 'Bolivia','Ethiopia']
```
```js
const countriesHaveFiveLetters = countries.filter(
(country) => country.length === 5
)
console.log(countriesHaveFiveLetters)
```
```sh
['Japan', 'Kenya']
```
```js
const scores = [
{ name: 'Asabeneh', score: 95 },
{ name: 'Lidiya', score: 98 },
{ name: 'Mathias', score: 80 },
{ name: 'Elias', score: 50 },
{ name: 'Martha', score: 85 },
{ name: 'John', score: 100 },
]
const scoresGreaterEighty = scores.filter((score) => score.score > 80)
console.log(scoresGreaterEighty)
```
```sh
[{name: 'Asabeneh', score: 95}, { name: 'Lidiya', score: 98 },{name: 'Martha', score: 85},{name: 'John', score: 100}]
```
### reduce
_reduce_: ប្រើ callback function។ callback function យក accumulator, បច្ចុប្បន្ន និងតម្លៃដំបូងជាជម្រើសជាប៉ារ៉ាម៉ែត្រ ហើយត្រឡប់តម្លៃតែមួយ។ វាគឺជាការអនុវត្តដ៏ល្អក្នុងការកំណត់តម្លៃដំបូងសម្រាប់តម្លៃ accumulator ។ ប្រសិនបើយើងមិនបញ្ជាក់ប៉ារ៉ាម៉ែត្រនេះទេ តាមលំនាំដើម accumulator នឹងទទួលបានអារេ `តម្លៃដំបូង`។ ប្រសិនបើអារេរបស់យើងជា _empty array_ នោះ `Javascript` នឹងបោះកំហុស។
```js
arr.reduce((acc, cur) => {
// ប្រតិបត្តិការមួយចំនួនទៅទីនេះ មុនពេលត្រឡប់តម្លៃ
return
}, initialValue)
```
```js
const numbers = [1, 2, 3, 4, 5]
const sum = numbers.reduce((acc, cur) => acc + cur, 0)
console.log(sum)
```
```js
15
```
### every
_every_: ពិនិត្យមើលថាតើធាតុទាំងអស់ស្រដៀងគ្នានៅក្នុងទិដ្ឋភាពមួយ។ វាត្រឡប់ប៊ូលីន
```js
const names = ['Asabeneh', 'Mathias', 'Elias', 'Brook']
const areAllStr = names.every((name) => typeof name === 'string') // តើជា string ទាំងអស់ទេ?
console.log(areAllStr)
```
```sh
true
```
```js
const bools = [true, true, true, true]
const areAllTrue = bools.every((b) => b === true) // តើជា ពិត ទាំងអស់ទេ?
console.log(areAllTrue) // true
```
```sh
true
```
### find
_find_: ត្រឡប់ធាតុទីមួយដែលបំពេញលក្ខខណ្ឌ
```js
const ages = [24, 22, 25, 32, 35, 18]
const age = ages.find((age) => age < 20)
console.log(age)
```
```js
18
```
```js
const names = ['Asabeneh', 'Mathias', 'Elias', 'Brook']
const result = names.find((name) => name.length > 7)
console.log(result)
```
```sh
Asabeneh
```
```js
const scores = [
{ name: 'Asabeneh', score: 95 },
{ name: 'Mathias', score: 80 },
{ name: 'Elias', score: 50 },
{ name: 'Martha', score: 85 },
{ name: 'John', score: 100 },
]
const score = scores.find((user) => user.score > 80)
console.log(score)
```
```sh
{ name: "Asabeneh", score: 95 }
```
### findIndex
_findIndex_: ត្រឡប់ទីតាំងនៃធាតុទីមួយដែលបំពេញលក្ខខណ្ឌ
```js
const names = ['Asabeneh', 'Mathias', 'Elias', 'Brook']
const ages = [24, 22, 25, 32, 35, 18]
const result = names.findIndex((name) => name.length > 7)
console.log(result) // 0
const age = ages.findIndex((age) => age < 20)
console.log(age) // 5
```
### some
_some_: ពិនិត្យមើលថាតើធាតុមួយចំនួនស្រដៀងគ្នានៅក្នុងទិដ្ឋភាពមួយ។ វាត្រឡប់ប៊ូលីន
```js
const names = ['Asabeneh', 'Mathias', 'Elias', 'Brook']
const bools = [true, true, true, true]
const areSomeTrue = bools.some((b) => b === true)
console.log(areSomeTrue) //true
```
```js
const areAllStr = names.some((name) => typeof name === 'number') // តើ string ទាំងអស់ទេ?
console.log(areAllStr) // false
```
### sort
_sort_: method ​តម្រៀប​​ធាតុ​អារេ​តាម​លំដាប់​ឡើង​ឬ​ចុះ។ តាមលំនាំដើម វិធីសាស្ត្រ **_sort()_** តម្រៀបតម្លៃជា string។ វាដំណើរការល្អសម្រាប់ធាតុអារេ string ប៉ុន្តែមិនមែនសម្រាប់លេខទេ។ ប្រសិនបើតម្លៃលេខត្រូវបានតម្រៀបជាខ្សែ ហើយវាផ្តល់ឱ្យយើងនូវលទ្ធផលខុស។ វិធីសាស្ត្រតម្រៀប កែប្រែអារេដើម។ វាត្រូវបានណែនាំឱ្យចម្លងទិន្នន័យដើម មុនពេលអ្នកចាប់ផ្តើមប្រើវិធីសាស្ត្រ _sort_។
#### ការតម្រៀបតម្លៃ string
```js
const products = ['Milk', 'Coffee', 'Sugar', 'Honey', 'Apple', 'Carrot']
console.log(products.sort()) // ['Apple', 'Carrot', 'Coffee', 'Honey', 'Milk', 'Sugar']
//ឥឡូវនេះអារេផលិតផលដើមក៏ត្រូវបានតម្រៀបផងដែរ។
```
#### ការតម្រៀបតម្លៃលេខ
ដូចដែលអ្នកអាចឃើញនៅក្នុងឧទាហរណ៍ខាងក្រោម 100 បានមកជាលើកដំបូងបន្ទាប់ពីបានតម្រៀបតាមលំដាប់ឡើង។ តម្រៀបបំប្លែងធាតុទៅជាខ្សែអក្សរ ចាប់តាំងពី '100' និងលេខផ្សេងទៀតប្រៀបធៀប 1 ដែលការចាប់ផ្តើមនៃខ្សែអក្សរ '100' ក្លាយជាតូចបំផុត។ ដើម្បីជៀសវាងបញ្ហានេះ យើងប្រើ callback functio ប្រៀបធៀបនៅក្នុងវិធីតម្រៀប ដែលផ្តល់លទ្ធផលអវិជ្ជមាន សូន្យ ឬវិជ្ជមាន។
```js
const numbers = [9.81, 3.14, 100, 37]
// ការប្រើ sort method ដើម្បីតម្រៀបធាតុលេខផ្តល់លទ្ធផលខុស។ មើល​ខាង​ក្រោម
console.log(numbers.sort()) //[100, 3.14, 37, 9.81]
numbers.sort(function (a, b) {
return a - b
})
console.log(numbers) // [3.14, 9.81, 37, 100]
numbers.sort(function (a, b) {
return b - a
})
console.log(numbers) //[100, 37, 9.81, 3.14]
```
#### ការតម្រៀប Object Array
នៅពេលណាដែលយើងតម្រៀប object ក្នុងអារេមួយ យើងប្រើ key ដើម្បីប្រៀបធៀប។ ចូរយើងមើលឧទាហរណ៍ខាងក្រោម។
```js
objArr.sort(function (a, b) {
if (a.key < b.key) return -1
if (a.key > b.key) return 1
return 0
})
// or
objArr.sort(function (a, b) {
if (a['key'] < b['key']) return -1
if (a['key'] > b['key']) return 1
return 0
})
const users = [
{ name: 'Asabeneh', age: 150 },
{ name: 'Brook', age: 50 },
{ name: 'Eyob', age: 100 },
{ name: 'Elias', age: 22 },
]
users.sort((a, b) => {
if (a.age < b.age) return -1
if (a.age > b.age) return 1
return 0
})
console.log(users) // តម្រៀបឡើង
// [{…}, {…}, {…}, {…}]
```
🌕 អ្នក​កំពុង​ធ្វើ​បាន​ល្អ​។​ កុំ​បោះបង់​ចោល​ព្រោះ​រឿង​អស្ចារ្យ​ត្រូវ​ការ​ពេល​វេលា។ អ្នកទើបតែបានបញ្ចប់ការប្រកួតថ្ងៃទី 9 ហើយអ្នកបានឈាន 9 ជំហាន ឆ្ពោះទៅរកភាពអស្ចារ្យ។ ឥឡូវធ្វើលំហាត់ខ្លះសម្រាប់ខួរក្បាល និងសាច់ដុំរបស់អ្នក។
## 💻 លំហាត់
### លំហាត់៖ កម្រិត ១
```js
const countries = ['Finland', 'Sweden', 'Denmark', 'Norway', 'IceLand']
const names = ['Asabeneh', 'Mathias', 'Elias', 'Brook']
const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
const products = [
{ product: 'banana', price: 3 },
{ product: 'mango', price: 6 },
{ product: 'potato', price: ' ' },
{ product: 'avocado', price: 8 },
{ product: 'coffee', price: 10 },
{ product: 'tea', price: '' },
]
```
1. ពន្យល់ពីភាពខុសគ្នារវាង **_forEach map filter reduce**។
2. កំណត់ callback function មុនពេលដែលអ្នកប្រើវានៅក្នុង forEach, map, filter or reduce។
3. ប្រើ **_forEach_** ដើម្បី console.log ប្រទេសនីមួយៗក្នុងបណ្តាប្រទេសអារេ។
4. ប្រើ **_forEach_** ដើម្បី console.log ឈ្មោះនីមួយៗក្នុងអារេឈ្មោះ។
5. ប្រើ **_forEach_** ដើម្បី console.log លេខនីមួយៗក្នុងអារេលេខ។
6. ប្រើ **_map_** ដើម្បីបង្កើតអារេថ្មីដោយផ្លាស់ប្តូរប្រទេសនីមួយៗទៅជាអក្សរធំក្នុងប្រទេសអារេ។
7. ប្រើ **_map_** ដើម្បីបង្កើតអារេនៃប្រវែងប្រទេសពីអារេប្រទេស។
8. ប្រើ **_map_** ដើម្បីបង្កើតអារេថ្មីដោយផ្លាស់ប្តូរលេខនីមួយៗទៅជាការ៉េក្នុងអារេលេខ
9. ប្រើ **_map_** ដើម្បីប្តូរឈ្មោះនីមួយៗទៅជាអក្សរធំក្នុងអារេឈ្មោះ
10. ប្រើ **_map_** ដើម្បីគូសផែនទីអារេផលិតផលទៅនឹងតម្លៃដែលត្រូវគ្នារបស់វា។
11. ប្រើ **_filter_** ដើម្បីត្រងប្រទេសដែលមាន **_land_**។
12. ប្រើ **_filter_** ដើម្បីត្រងប្រទេសដែលមានតួអក្សរប្រាំមួយ។
13. ប្រើ **_filter_** ដើម្បីត្រងប្រទេសដែលមានអក្សរប្រាំមួយ និងច្រើនទៀតនៅក្នុងអារេប្រទេស។
14. ប្រើ **_filter_** ដើម្បីត្រងប្រទេសដែលចាប់ផ្តើមដោយ 'E';
15. ប្រើ **_filter_** ដើម្បីត្រងតែតម្លៃដែលមានតម្លៃប៉ុណ្ណោះ។
16. ប្រកាសមុខងារមួយហៅថា getStringLists ដែលយកអារេជាប៉ារ៉ាម៉ែត្រ ហើយបន្ទាប់មកត្រឡប់អារេតែជាមួយធាតុខ្សែអក្សរប៉ុណ្ណោះ។
17. ប្រើ **_reduce_** ដើម្បីបូកសរុបលេខទាំងអស់ក្នុងអារេលេខ។
18. ប្រើ **_reduce_** ដើម្បីភ្ជាប់ប្រទេសទាំងអស់ និងបង្កើតប្រយោគនេះ៖ **_Estonia, Finland, Sweden, Denmark, Norway, and IceLand are north European countries_**
19. ពន្យល់ពីភាពខុសគ្នារវាង **_some_** និង **_every_**
20. ប្រើ **_some_** ដើម្បីពិនិត្យមើលថាតើប្រវែងឈ្មោះខ្លះធំជាងប្រាំពីរនៅក្នុងអារេឈ្មោះ
21. ប្រើ **_every_** ដើម្បីពិនិត្យមើលថាតើប្រទេសទាំងអស់មានពាក្យថា land ឬអត់
22. ពន្យល់ពីភាពខុសគ្នារវាង **_find_** និង **_findIndex_** ។
23. ប្រើ **_find_** ដើម្បីស្វែងរកប្រទេសដំបូងដែលមានអក្សរតែប្រាំមួយក្នុងប្រទេសអារេ
24. ប្រើ **_findIndex_** ដើម្បីស្វែងរកទីតាំងនៃប្រទេសដំបូងដែលមានអក្សរតែប្រាំមួយនៅក្នុងបណ្តាប្រទេសអារេ
25. ប្រើ **_findIndex_** ដើម្បីស្វែងរកទីតាំងរបស់ **_Norway_** ប្រសិនបើវាមិនមាននៅក្នុងអារេ អ្នកនឹងទទួលបាន -1 ។
26. ប្រើ **_findIndex_** ដើម្បីស្វែងរកទីតាំងរបស់ **_Russia_** ប្រសិនបើវាមិនមាននៅក្នុងអារេ អ្នកនឹងទទួលបាន -1 ។
### លំហាត់៖ កម្រិត ២
1. ស្វែងរកតម្លៃសរុបនៃផលិតផលដោយដាក់ខ្សែសង្វាក់អារេពីរ ឬច្រើន (ឧ. arr.map(callback).filter(callback).reduce(callback))
1. ស្វែងរកផលបូកនៃតម្លៃផលិតផលដោយប្រើតែកាត់បន្ថយ(callback)
1. ប្រកាសមុខងារមួយហៅថា **_categorizeCountries_** ដែលត្រឡប់អារេនៃប្រទេសដែលមានលំនាំទូទៅមួយចំនួន (អ្នករកឃើញអារេប្រទេសនៅក្នុងឃ្លាំងនេះជា countries.js(ឧ. 'land', 'ia', 'island','stan' ))
1. បង្កើតមុខងារដែលត្រឡប់អារេនៃវត្ថុដែលជាអក្សរ និងចំនួនដងដែលអក្សរប្រើដើម្បីចាប់ផ្តើមជាមួយឈ្មោះប្រទេសមួយ។
1. ប្រកាសមុខងារ **_getFirstTenCountries_** ហើយត្រឡប់អារេនៃដប់ប្រទេស។ ប្រើកម្មវិធីមុខងារផ្សេងៗគ្នា ដើម្បីដំណើរការលើអារេ country.js
1. ប្រកាសមុខងារ **_getLastTenCountries_** ដែលត្រឡប់ប្រទេសទាំងដប់ចុងក្រោយនៅក្នុងអារេប្រទេស។
1. ស្វែងយល់ថាតើ _letter_ មួយណាត្រូវបានប្រើប្រាស់ច្រើនដង ជាដំបូងសម្រាប់ឈ្មោះប្រទេសពីអារេប្រទេស (ឧ. ហ្វាំងឡង់ ហ្វីជី បារាំង។ល។)
### លំហាត់៖ កម្រិត ៣
1. ប្រើព័ត៌មានប្រទេសនៅក្នុងថតទិន្នន័យ។ តម្រៀបប្រទេសតាម name, capital, និង population
1. \*\*\* ស្វែងរក 10 ភាសាដែលនិយាយច្រើនបំផុត:
````js
// លទ្ធផលរបស់អ្នកគួរតែមើលទៅដូចនេះ
console.log(mostSpokenLanguages(countries, 10))
[
{country: 'English',count:91},
{country: 'French',count:45},
{country: 'Arabic',count:25},
{country: 'Spanish',count:24},
{country:'Russian',count:9},
{country:'Portuguese', count:9},
{country:'Dutch',count:8},
{country:'German',count:7},
{country:'Chinese',count:5},
{country:'Swahili',count:4}
]
// លទ្ធផលរបស់អ្នកគួរតែមើលទៅដូចនេះ
console.log(mostSpokenLanguages(countries, 3))
[
{country: 'English',count: 91},
{country: 'French',count: 45},
{country: 'Arabic',count: 25},
]```
````
2. \*\*\* ប្រើឯកសារ country_data.js បង្កើតមុខងារដែលបង្កើតប្រទេសចំនួនដប់ដែលមានប្រជាជនច្រើនជាងគេ
````js
console.log(mostPopulatedCountries(countries, 10))
[
{country: 'China', population: 1377422166},
{country: 'India', population: 1295210000},
{country: 'United States of America', population: 323947000},
{country: 'Indonesia', population: 258705000},
{country: 'Brazil', population: 206135893},
{country: 'Pakistan', population: 194125062},
{country: 'Nigeria', population: 186988000},
{country: 'Bangladesh', population: 161006790},
{country: 'Russian Federation', population: 146599183},
{country: 'Japan', population: 126960000}
]
console.log(mostPopulatedCountries(countries, 3))
[
{country: 'China', population: 1377422166},
{country: 'India', population: 1295210000},
{country: 'United States of America', population: 323947000}
]
```
````
3. \*\*\* ព្យាយាមបង្កើតកម្មវិធីដែលគណនារង្វាស់នៃទំនោរកណ្តាលនៃគំរូ (mean, median, mode) និងរង្វាស់នៃភាពប្រែប្រួល (range, variance, standard deviation)។ បន្ថែមពីលើវិធានការទាំងនោះ រកឃើញ min, max, count, percentile, និង frequency distributionនៃគំរូ។ អ្នកអាចបង្កើតវត្ថុមួយហៅថាស្ថិតិ និងបង្កើតមុខងារទាំងអស់ដែលធ្វើការគណនាស្ថិតិជាវិធីសាស្ត្រសម្រាប់វត្ថុស្ថិតិ។ សូមពិនិត្យមើលលទ្ធផលខាងក្រោម។
```js
const ages = [31, 26, 34, 37, 27, 26, 32, 32, 26, 27, 27, 24, 32, 33, 27, 25, 26, 38, 37, 31, 34, 24, 33, 29, 26]
console.log('Count:', statistics.count()) // 25
console.log('Sum: ', statistics.sum()) // 744
console.log('Min: ', statistics.min()) // 24
console.log('Max: ', statistics.max()) // 38
console.log('Range: ', statistics.range()) // 14
console.log('Mean: ', statistics.mean()) // 30
console.log('Median: ',statistics.median()) // 29
console.log('Mode: ', statistics.mode()) // {'mode': 26, 'count': 5}
console.log('Variance: ',statistics.var()) // 17.5
console.log('Standard Deviation: ', statistics.std()) // 4.2
console.log('Variance: ',statistics.var()) // 17.5
console.log('Frequency Distribution: ',statistics.freqDist()) # [(20.0, 26), (16.0, 27), (12.0, 32), (8.0, 37), (8.0, 34), (8.0, 33), (8.0, 31), (8.0, 24), (4.0, 38), (4.0, 29), (4.0, 25)]
```
```sh
console.log(statistics.describe())
Count: 25
Sum: 744
Min: 24
Max: 38
Range: 14
Mean: 30
Median: 29
Mode: (26, 5)
Variance: 17.5
Standard Deviation: 4.2
Frequency Distribution: [(20.0, 26), (16.0, 27), (12.0, 32), (8.0, 37), (8.0, 34), (8.0, 33), (8.0, 31), (8.0, 24), (4.0, 38), (4.0, 29), (4.0, 25)]
```
🎉 អបអរសាទរ ! 🎉
[<< ថ្ងៃទី 8](../08_Day_Objects/08_day_objects.md) | [ថ្ងៃទី 10 >>](../10_Day_Sets_and_Maps/10_day_Sets_and_Maps.md)

440
Khmer/10_Day_Sets_and_Maps/10_day_Sets_and_Maps.md
Unescape View File

@ -0,0 +1,440 @@
<div align="center">
<h1> 30 ថ្ងៃនៃ JavaScript: Sets and Maps</h1>
<a class="header-badge" target="_blank" href="https://www.linkedin.com/in/asabeneh/">
<img src="https://img.shields.io/badge/style--5eba00.svg?label=LinkedIn&logo=linkedin&style=social">
</a>
<a class="header-badge" target="_blank" href="https://twitter.com/Asabeneh">
<img alt="Twitter Follow" src="https://img.shields.io/twitter/follow/asabeneh?style=social">
</a>
<sub>អ្នកនិពន្ធ:
<a href="https://www.linkedin.com/in/asabeneh/" target="_blank">Asabeneh Yetayeh</a><br>
<small> ខែមករា ឆ្នាំ ២០២០</small>
</sub>
</div>
[<< ថ្ងៃទី 9](../09_Day_Higher_order_functions/09_day_higher_order_functions.md) | [ថ្ងៃទី 11>>](../11_Day_Destructuring_and_spreading/11_day_destructuring_and_spreading.md)
![ថ្ងៃទី 10](../images/banners/day_1_10.png)
- [ថ្ងៃទី 10](#day-10)
- [Set](#set)
- [ការបង្កើតសំណុំទទេ](#creating-an-empty-set)
- [ការបង្កើតសំណុំពីអារេ](#creating-set-from-array)
- [ការបន្ថែមធាតុទៅសំណុំ](#adding-an-element-to-a-set)
- [ការលុបធាតុពីសំណុំ](#deleting-an-element-a-set)
- [ពិនិត្យធាតុនៅក្នុងសំណុំ](#checking-an-element-in-the-set)
- [ការរំលាយសំណុំ](#clearing-the-set)
- [ប្រជុំនៃសំណុំ](#union-of-sets)
- [ប្រសព្វនៃសំណុំ](#intersection-of-sets)
- [ភាពខុសគ្នានៃសំណុំ](#difference-of-sets)
- [Map](#map)
- [ការបង្កើត map ទទេ](#creating-an-empty-map)
- [ការបង្កើត map ពីអារេ](#creating-an-map-from-array)
- [ការបន្ថែមតម្លៃទៅ map](#adding-values-to-the-map)
- [ការទាញយកតម្លៃពី map](#getting-a-value-from-map)
- [ពិនិត្យ​មើល key ក្នុង​ map](#checking-key-in-map)
- [លំហាត់](#exercises)
- [លំហាត់៖ កម្រិត ១](#exerciseslevel-1)
- [លំហាត់៖ កម្រិត ២](#exerciseslevel-2)
- [លំហាត់៖ កម្រិត ៣](#exerciseslevel-3)
# ថ្ងៃទី 10
## Set
សំណុំគឺជាបណ្តុំនៃធាតុ។ សំណុំអាចមានធាតុតែមួយគត់។
ចូរយើងមើលពីរបៀបបង្កើតសំណុំនៅក្នុងផ្នែកខាងក្រោម។
### ការបង្កើតសំណុំទទេ
```js
const companies = new Set()
console.log(companies)
```
```sh
Set(0) {}
```
### ការបង្កើតសំណុំពីអារេ
```js
const languages = [
'English',
'Finnish',
'English',
'French',
'Spanish',
'English',
'French',
]
const setOfLanguages = new Set(languages)
console.log(setOfLanguages)
```
```sh
Set(4) {"English", "Finnish", "French", "Spanish"}
```
Set គឺជាវត្ថុដែលអាច iterate បាន ហើយយើងអាច iterate តាមរយៈធាតុនីមួយៗ។
```js
const languages = [
'English',
'Finnish',
'English',
'French',
'Spanish',
'English',
'French',
]
const setOfLanguages = new Set(languages)
for (const language of setOfLanguages) {
console.log(language)
}
```
```sh
English
Finnish
French
Spanish
```
### ការបន្ថែមធាតុទៅសំណុំ
```js
const companies = new Set() // បង្កើតសំណុំទទេ
console.log(companies.size) // 0
companies.add('Google') // បន្ថែមធាតុទៅសំណុំ
companies.add('Facebook')
companies.add('Amazon')
companies.add('Oracle')
companies.add('Microsoft')
console.log(companies.size) // 5 ធាតុនៅក្នុងសំណុំ
console.log(companies)
```
```sh
Set(5) {"Google", "Facebook", "Amazon", "Oracle", "Microsoft"}
```
យើងក៏អាចប្រើ loop ដើម្បីបន្ថែមធាតុទៅសំណុំមួយ។
```js
const companies = ['Google', 'Facebook', 'Amazon', 'Oracle', 'Microsoft']
setOfCompanies = new Set()
for (const company of companies) {
setOfCompanies.add(company)
}
```
```sh
Set(5) {"Google", "Facebook", "Amazon", "Oracle", "Microsoft"}
```
### ការលុបធាតុមួយឈុត
យើងអាចលុបធាតុចេញពីសំណុំដោយប្រើ delete method។
```js
console.log(companies.delete('Google'))
console.log(companies.size) // 4 ធាតុដែលនៅសល់ក្នុងឈុត
```
### ពិនិត្យធាតុនៅក្នុងសំណុំ
method នេះអាចជួយឱ្យដឹងថាតើមានធាតុជាក់លាក់ណាមួយនៅក្នុងសំណុំមួយ។
```js
console.log(companies.has('Apple')) // false
console.log(companies.has('Facebook')) // true
```
### ការរំលាយសំណុំ
វាដកធាតុទាំងអស់ចេញពីសំណុំ។
```js
companies.clear()
console.log(companies)
```
```sh
Set(0) {}
```
សូមមើលឧទាហរណ៍ខាងក្រោមដើម្បីរៀនពីរបៀបប្រើសំណុំ។
```js
const languages = [
'English',
'Finnish',
'English',
'French',
'Spanish',
'English',
'French',
]
const langSet = new Set(languages)
console.log(langSet) // Set(4) {"English", "Finnish", "French", "Spanish"}
console.log(langSet.size) // 4
const counts = []
const count = {}
for (const l of langSet) {
const filteredLang = languages.filter((lng) => lng === l)
console.log(filteredLang) // ["English", "English", "English"]
counts.push({ lang: l, count: filteredLang.length })
}
console.log(counts)
```
```js
[
{ lang: 'English', count: 3 },
{ lang: 'Finnish', count: 1 },
{ lang: 'French', count: 2 },
{ lang: 'Spanish', count: 1 },
]
```
ករណីប្រើប្រាស់ផ្សេងទៀតនៃសំណុំ។ ឧទាហរណ៍ដើម្បីរាប់ធាតុតែមួយគត់នៅក្នុងអារេមួយ។
```js
const numbers = [5, 3, 2, 5, 5, 9, 4, 5]
const setOfNumbers = new Set(numbers)
console.log(setOfNumbers)
```
```sh
Set(5) {5, 3, 2, 9, 4}
```
### ប្រជុំនៃសំណុំ
ដើម្បីស្វែងរកប្រជុំនៃពីរសំណុំយើងអាចប្រើ spread operator។ ចូរស្វែងរកប្រជុំនៃសំណុំ A និង សំណុំ B (A U B)
```js
let a = [1, 2, 3, 4, 5]
let b = [3, 4, 5, 6]
let c = [...a, ...b]
let A = new Set(a)
let B = new Set(b)
let C = new Set(c)
console.log(C)
```
```sh
Set(6) {1, 2, 3, 4, 5,6}
```
### ប្រសព្វនៃសំណុំ
ដើម្បីស្វែងរកចំនុចប្រសព្វនៃសំណុំពីរអាចត្រូវបានសម្រេចដោយប្រើ filter។ ចូរស្វែងរកចំនុចប្រសព្វនៃសំណុំ A និងកំណត់ B (A ∩ B)
```js
let a = [1, 2, 3, 4, 5]
let b = [3, 4, 5, 6]
let A = new Set(a)
let B = new Set(b)
let c = a.filter((num) => B.has(num))
let C = new Set(c)
console.log(C)
```
```sh
Set(3) {3, 4, 5}
```
### ភាពខុសគ្នានៃសំណុំ
ដើម្បីស្វែងរកភាពខុសគ្នារវាងសំណុំពីរអាចត្រូវបានសម្រេចដោយប្រើ filter។ ចូរស្វែងរកភាពខុសគ្នានៃសំណុំ A និងសំណុំ B (A \ B)
```js
let a = [1, 2, 3, 4, 5]
let b = [3, 4, 5, 6]
let A = new Set(a)
let B = new Set(b)
let c = a.filter((num) => !B.has(num))
let C = new Set(c)
console.log(C)
```
```sh
Set(2) {1, 2}
```
## Map
### ការបង្កើត map ទទេ
```js
const map = new Map()
console.log(map)
```
```sh
Map(0) {}
```
### ការបង្កើត map ពីអារេ
```js
countries = [
['Finland', 'Helsinki'],
['Sweden', 'Stockholm'],
['Norway', 'Oslo'],
]
const map = new Map(countries)
console.log(map)
console.log(map.size)
```
```sh
Map(3) {"Finland" => "Helsinki", "Sweden" => "Stockholm", "Norway" => "Oslo"}
3
```
### ការបន្ថែមតម្លៃទៅ map
```js
const countriesMap = new Map()
console.log(countriesMap.size) // 0
countriesMap.set('Finland', 'Helsinki')
countriesMap.set('Sweden', 'Stockholm')
countriesMap.set('Norway', 'Oslo')
console.log(countriesMap)
console.log(countriesMap.size)
```
```sh
Map(3) {"Finland" => "Helsinki", "Sweden" => "Stockholm", "Norway" => "Oslo"}
3
```
### ការទាញយកតម្លៃពី map
```js
console.log(countriesMap.get('Finland'))
```
```sh
Helsinki
```
### ​ពិនិត្យ​មើល​ key ក្នុង​ map
ពិនិត្យមើលថាតើ key មាននៅក្នុង map ដោយប្រើវិធីសាស្ត្រ _has_ ។ វាត្រឡប់ _true_ ឬ _false_ ។
```js
console.log(countriesMap.has('Finland'))
```
```sh
true
```
ទទួលបានតម្លៃទាំងអស់ពីផែនទីដោយប្រើ loop
```js
for (const country of countriesMap) {
console.log(country)
}
```
```sh
(2) ["Finland", "Helsinki"]
(2) ["Sweden", "Stockholm"]
(2) ["Norway", "Oslo"]
```
```js
for (const [country, city] of countriesMap){
console.log(country, city)
}
```
```sh
Finland Helsinki
Sweden Stockholm
Norway Oslo
```
🌕 អ្នក​បាន​បង្កើត​ព្រឹត្តិការណ៍​ដ៏​ធំ​មួយ អ្នក​មិន​អាច​ឈប់​បាន​ទេ។ បន្ត​ទៀត! អ្នកទើបតែបានបញ្ចប់ challenge 10 ថ្ងៃ ហើយអ្នកបានឈាន 10 ជំហានឆ្ពោះកាន់ភាពអស្ចារ្យ។ ឥឡូវធ្វើលំហាត់ខ្លះសម្រាប់ខួរក្បាល និងសាច់ដុំរបស់អ្នក។
## លំហាត់
### លំហាត់៖ កម្រិត ១
```js
const a = [4, 5, 8, 9]
const b = [3, 4, 5, 7]
const countries = ['Finland', 'Sweden', 'Norway']
```
1. បង្កើតសំណុំទទេ
2. បង្កើតសំណុំដែលមាន 0 ទៅ 10 ដោយប្រើរង្វិលជុំ
3. យកធាតុចេញពីសំណុំ
4. ជម្រះសំណុំមួយ។
5. បង្កើតសំណុំនៃធាតុ 5 string ពីអារេ
6. បង្កើត map នៃប្រទេស និងចំនួនតួអក្សរនៃប្រទេសមួយ។
### លំហាត់៖ កម្រិត ២
1. ស្វែងរក a ប្រជុំ b
2. ស្វែងរក a ប្រសព្វ b
3. ស្វែងរក a ជាមួយ b
### លំហាត់៖ កម្រិត ៣
1. តើមានភាសាប៉ុន្មាននៅក្នុងឯកសារ object country
1. \*\*\* ប្រើទិន្នន័យប្រទេសដើម្បីស្វែងរក 10 ភាសានិយាយច្រើនបំផុត:
```js
// លទ្ធផលរបស់អ្នកគួរតែមើលទៅដូចនេះ
console.log(mostSpokenLanguages(countries, 10))
[
{ English: 91 },
{ French: 45 },
{ Arabic: 25 },
{ Spanish: 24 },
{ Russian: 9 },
{ Portuguese: 9 },
{ Dutch: 8 },
{ German: 7 },
{ Chinese: 5 },
{ Swahili: 4 },
{ Serbian: 4 }
]
// លទ្ធផលរបស់អ្នកគួរតែមើលទៅដូចនេះ
console.log(mostSpokenLanguages(countries, 3))
[
{English:91},
{French:45},
{Arabic:25}
]
```
🎉 អបអរសាទរ ! 🎉
[<< ថ្ងៃទី 9](../09_Day_Higher_order_functions/09_day_higher_order_functions.md) | [ថ្ងៃទី 11 >>](../11_Day_Destructuring_and_spreading/11_day_destructuring_and_spreading.md)
Write Preview
Loading…
Cancel
Save