កូអរដោនេ ធរណីមាត្រ និងការដាក់ទាំងអស់ចូលគ្នា

មាតិកា

1. តើអ្វីៗទាំងអស់នៅឯណាលើអេក្រង់?
2. Distance និង Pythagoras
3. ដឺក្រេ និង Radian
4. Point លើរង្វង់៖ sin និង cos
5. lerp៖ ការផ្លាស់ទីដោយរលូនរវាងតម្លៃពីរ
6. clamp និង mapRange
7. រូបមន្ត៖ Module geometry
8. Capstone៖ របាយការណ៍ mathlab
9. ស៊េរីទាំងមូលក្នុងតារាងតែមួយ
10. ទៅទីណាបន្ត
11. សាកល្បងដោយខ្លួនឯង

1. តើអ្វីៗទាំងអស់នៅឯណាលើអេក្រង់?

រាល់ pixel នៅលើអេក្រង់របស់អ្នកមានអាសយដ្ឋានដែលធ្វើពីលេខពីរ៖ x (ឆ្ងាយប៉ុនណាទៅចំហៀង) និង y (ឆ្ងាយប៉ុនណាទៅក្រោម)។ Point មួយត្រូវបានសរសេរជា (x, y)។ ប្រព័ន្ធនេះត្រូវបានហៅថា កូអរដោនេ ហើយអ្នកប្រើវារួចហើយនៅពេលណា ដែលអ្នកសរសេរ CSS ដូចជា left: 40px; top: 120px ឬគូរលើ canvas។

មានចំណុចខុសមួយបើប្រៀបធៀបនឹងក្រាហ្វដែលអ្នកបានគូរនៅសាលា។ នៅលើ អេក្រង់ ចំណុចដើម (0, 0) គឺជាជ្រុង ខាងលើឆ្វេង ហើយ y កើនទៅក្រោម៖

(0,0) ──────────► x grows right
  │
  │      (100, 50)
  │         •
  ▼
y grows DOWN

ដូច្នេះ point (100, 50) គឺនៅខាងស្តាំ 100 pixel និង ក្រោម គែមខាងលើ 50 pixel។ ក្នុងគណិតវិទ្យានៅសាលា "ឡើងលើ" គឺវិជ្ជមាន។ នៅលើអេក្រង់ "ចុះក្រោម" គឺវិជ្ជមាន។ ការពិតតែមួយនេះពន្យល់ពី bug ដែលបញ្ច្រាសក្បាលច្រើន ហើយវាសំខាន់ម្តងទៀត នៅពេលយើងប្រើមុំខាងក្រោម។

ក្នុង JavaScript point ជាធម្មជាតិគឺជា object៖

const a = { x: 10, y: 20 };
const b = { x: 40, y: 60 };

2. Distance និង Pythagoras

តើ a និង b នៅឆ្ងាយពីគ្នាប៉ុនណា? គិតអំពីត្រីកោណកែង។ ផ្លាស់ទីទៅចំហៀង dx = 40 - 10 = 30 និងចុះក្រោម dy = 60 - 20 = 40។ បន្ទាត់ត្រង់ពី a ទៅ b គឺជាជ្រុងវែងបំផុតនៃត្រីកោណនោះ។ ទ្រឹស្តីបទ Pythagoras ថា៖

distance = sqrt( dx*dx + dy*dy )

sqrt មានន័យថាឫសការ៉េ៖ ចំនួនដែលផ្តល់ dx*dx + dy*dy នៅពេល គុណនឹងខ្លួនវា។ សម្រាប់ point របស់យើង៖ sqrt(30*30 + 40*40) = sqrt(2500) = 50។

const dx = b.x - a.x;
const dy = b.y - a.y;
console.log(Math.sqrt(dx * dx + dy * dy)); // 50
console.log(Math.hypot(dx, dy));           // 50

Math.hypot ("hypotenuse") ធ្វើការងារដូចគ្នាក្នុងការហៅតែមួយ ហើយមានសុវត្ថិភាពជាងជាមួយ ចំនួនធំខ្លាំង ឬតូចខ្លាំង។ ប្រើវា។

កន្លែងដែលអ្នកនឹងត្រូវការ distance៖

• តើការចុចនៅក្នុងចម្ងាយ 20 pixel ពីចំណុចកណ្តាលរបស់ប៊ូតុងឬទេ?
• តើហាងណា ជិតបំផុត នឹងទីតាំងរបស់អ្នកប្រើ (លើផែនទីតូចមួយ)?
• តើវត្ថុពីរក្នុងល្បែងបុកគ្នាឬទេ?

ការបង្កើនល្បឿនតូចមួយ៖ ប្រសិនបើអ្នកគ្រាន់តែត្រូវការ ប្រៀបធៀប distance ("តើ A ជិតជាង B ឬ?") អ្នកអាចរំលងឫសការ៉េ ហើយប្រៀបធៀប dx*dx + dy*dy ដោយផ្ទាល់ ពីព្រោះឫសការ៉េមិនដែលប្តូរថាមួយណាធំជាងទេ។

3. ដឺក្រេ និង Radian

អ្នកស្គាល់មុំជា ដឺក្រេ៖ ការវិលពេញមួយជុំគឺ 360។ Math.sin និង Math.cos របស់ JavaScript រួមជាមួយ graphics API ភាគច្រើន ប្រើ radian ជំនួសវិញ។ Radian វាស់មុំដោយចម្ងាយដែលអ្នកធ្វើដំណើរតាមគែមរង្វង់ ហើយ ការវិលពេញមួយជុំគឺ 2 * Math.PI (ប្រហែល 6.2832) radian។

Math.PI គឺជាថេរ pi ប្រហែល 3.14159។ ការបំប្លែងប្រើការពិតថា 180 ដឺក្រេស្មើនឹង pi radian៖

function degToRad(degrees) {
  return (degrees * Math.PI) / 180;
}

function radToDeg(radians) {
  return (radians * 180) / Math.PI;
}

console.log(degToRad(180));          // 3.141592653589793
console.log(degToRad(90));           // 1.5707963267948966
console.log(radToDeg(Math.PI / 2));  // 90

Bug ដែលជួបញឹកញាប់បំផុតក្នុងផ្នែកនេះគឺការបញ្ចូល 90 ដោយផ្ទាល់ទៅ Math.sin ហើយ រំពឹងថាជាការវិលមួយភាគបួន។ JavaScript អានវាជា 90 radian ដែលជា ការវិលពេញជុំច្រើន។ បំប្លែងជាមុនជានិច្ច។ (CSS លាយឡំ៖ វាទទួលយក ទាំងពីរ ដូចជា rotate(90deg) ឬ rotate(1.57rad)។)

4. Point លើរង្វង់៖ sin និង cos

ស្រមៃរង្វង់មួយដែលមានចំណុចកណ្តាលនៅ (cx, cy) និងកាំ r។ មុំ ជ្រើសរើសកន្លែងមួយនៅលើគែមរបស់វា។ Point នៅមុំនោះគឺ៖

x = cx + r * cos(angle)
y = cy + r * sin(angle)

អ្នកមិនត្រូវការទ្រឹស្តីពេញលេញដើម្បីប្រើវាទេ។ cos និង sin យកមុំ (ជា radian) ហើយត្រឡប់លេខចន្លោះ -1 និង 1 ដែលប្រាប់អ្នកថាមុំនោះចង្អុលទៅចំហៀង ប៉ុនណា និងចុះក្រោមប៉ុនណា នៅលើរង្វង់កាំ 1។ គុណនឹង r ដើម្បីពង្រីក ហើយបូកចំណុចកណ្តាលដើម្បីរំកិលវាទៅកន្លែង។

const cx = 100;
const cy = 100;
const r = 50;

function pointAt(degrees) {
  const rad = degToRad(degrees);
  return { x: cx + r * Math.cos(rad), y: cy + r * Math.sin(rad) };
}

console.log(pointAt(0));   // { x: 150, y: 100 }  ខាងស្តាំចំណុចកណ្តាល
console.log(pointAt(90));  // { x: 100, y: 150 }  ខាងក្រោមចំណុចកណ្តាល
console.log(pointAt(180)); // { x: 50, y: 100 }   ខាងឆ្វេងចំណុចកណ្តាល

លទ្ធផល 90 ដឺក្រេគឺជាចំណុចខុសនៃកូអរដោនេអេក្រង់ពីផ្នែកទី 1៖ ពីព្រោះ y កើនទៅក្រោម ការបង្កើនមុំផ្លាស់ទី ស្របទិសនាឡិកា លើ អេក្រង់ ហើយ 90 ចង្អុលទៅ ក្រោម។ ក្នុងក្រាហ្វនៅសាលា វានឹងចង្អុលឡើងលើ។

ចំនួន floating-point ក៏ទុកកម្ទេចតូចៗដែរ។ pointAt(270) ផ្តល់ y: 50 និង x ជា 99.99999999999999 មិនមែន 100 ពិតប្រាកដទេ។ នេះគឺជា ឥទ្ធិពលនៃភាពជាក់លាក់ដូចគ្នាពី Integer, Overflow និងភាពជាក់លាក់។ បង្គត់ដោយ toFixed(1) ពេលបោះពុម្ព ឬប្រៀបធៀបដោយ nearlyEqual។

មុខនាឡិកាគឺជាការប្រើប្រាស់ដ៏ល្អ។ ដើម្បីដាក់សញ្ញាម៉ោង 12 ត្រូវរំកិលម្តង 30 ដឺក្រេ ជាប់ៗគ្នា (360 / 12)។ ដក 90 ដើម្បីឲ្យសញ្ញា 0 នៅខាងលើ មិនមែនខាងស្តាំ៖

for (let hour = 0; hour < 12; hour++) {
  const p = pointOnCircle(0, 0, 100, hour * 30 - 90);
  console.log(hour, p.x.toFixed(1), p.y.toFixed(1));
}
// 0  0.0 -100.0   (ម៉ោង 12 ខាងលើ)
// 3  100.0 0.0    (ម៉ោង 3 ខាងស្តាំ)
// 6  0.0 100.0    (ម៉ោង 6 ខាងក្រោម)
// 9  -100.0 0.0   (ម៉ោង 9 ខាងឆ្វេង)

(pointOnCircle គឺជា function ដែលយើងសរសេរក្នុងរូបមន្តខាងក្រោម។) Loop ដូចគ្នា ដាក់ទីតាំង loading spinner, radial menu, label របស់ pie chart និង animation ដែលវិលជុំវិញ។

5. lerp៖ ការផ្លាស់ទីដោយរលូនរវាងតម្លៃពីរ

Lerp មកពី linear interpolation ដែលជាឈ្មោះវែងសម្រាប់ គំនិតសាមញ្ញ៖ រកតម្លៃដែលជាប្រភាគមួយនៃផ្លូវរវាង a និង b។ អ្នកបញ្ចូលប្រភាគ t ពី 0 ដល់ 1៖

function lerp(a, b, t) {
  return a + (b - a) * t;
}

console.log(lerp(0, 100, 0));    // 0     (ចាប់ផ្តើម)
console.log(lerp(0, 100, 0.25)); // 25    (មួយភាគបួននៃផ្លូវ)
console.log(lerp(10, 20, 0.5));  // 15    (កណ្តាលផ្លូវ)
console.log(lerp(100, 0, 0.3));  // 70    (ដំណើរការទៅទិសចុះក្រោមដែរ)

របៀបដំណើរការ៖ b - a គឺជាចម្ងាយពេញ * t យកប្រភាគរបស់អ្នកនៃ វា ហើយ a + ចាប់ផ្តើមពីដើម។ នៅ t = 0 អ្នកនៅ a ហើយនៅ t = 1 អ្នកនៅ b។

គ្រប់កន្លែងដែលអ្វីមួយផ្លាស់ទីដោយរលូន មាន lerp៖ progress bar ដែលកំពុងពេញ ពណ៌ដែលកំពុងស្រអាប់ menu ដែលរអិលចូល កាមេរ៉ាដែលតាមអ្នកលេង។ ដើម្បីធ្វើ animation អ្នកបង្កើន t បន្តិចក្នុងមួយ frame៖

// រអិលពី x = 0 ទៅ x = 300 ក្នុង 5 ជំហាន។
for (let step = 0; step <= 5; step++) {
  console.log(lerp(0, 300, step / 5));
}
// 0, 60, 120, 180, 240, 300

វ៉ារ្យ៉ង់ដ៏និយមមួយហៅថា "smoothing" ធ្វើម្តងទៀត current = lerp(current, target, 0.5) រាល់ frame ដូច្នេះតម្លៃចូលជិតគោលដៅរហ័សនៅដំបូង ហើយបន្ទាប់មក ស្ងប់ដោយទន់ភ្លន់៖ 50, 75, 87.5, 93.75, 96.875 នៅពេលដេញតាម 100។

Lerp ក៏ដំណើរការលើពណ៌ដែរ។ ធ្វើវាលើ channel ក្រហម បៃតង និងខៀវនីមួយៗ ពី លេខ និងប្រព័ន្ធលេខ ហើយអ្នកនឹងទទួលបានការស្រអាប់រលូនរវាងពណ៌ hex ពីរ។

6. clamp និង mapRange

តម្លៃពិតជារឿយៗមិនស្តាប់បង្គាប់។ Drag handle អាចចេញពីអេក្រង់។ ភាគរយអាចឡើងដល់ 104% ដោយសារកំហុសបង្គត់។ clamp បង្ខំឲ្យ តម្លៃនៅក្នុងជួរមួយ៖

function clamp(value, min, max) {
  return Math.min(Math.max(value, min), max);
}

console.log(clamp(150, 0, 100)); // 100  (ធំពេក ទាញចុះមក max)
console.log(clamp(-5, 0, 100));  // 0    (តូចពេក ទាញឡើងមក min)
console.log(clamp(42, 0, 100));  // 42   (នៅក្នុងរួចហើយ មិនប្តូរ)

អានវាថា៖ ដំបូងធានាថាតម្លៃយ៉ាងហោចណាស់ min (Math.max) បន្ទាប់មក ធានាថាវាយ៉ាងច្រើន max (Math.min)។

mapRange បំប្លែងតម្លៃពីមាត្រដ្ឋានមួយទៅមួយទៀត។ វារកថាតម្លៃនោះនៅ ឆ្ងាយប៉ុនណាតាមជួរ input (ជាប្រភាគ ដូច t) បន្ទាប់មកប្រើ lerp ដើម្បី ដាក់ប្រភាគនោះលើជួរ output៖

function mapRange(value, inMin, inMax, outMin, outMax) {
  const t = (value - inMin) / (inMax - inMin);
  return lerp(outMin, outMax, t);
}

console.log(mapRange(30, 0, 60, 0, 100));    // 50   (30 ក្នុង 60 វិនាទី -> 50%)
console.log(mapRange(25, 0, 100, 200, 300)); // 225
console.log(mapRange(-40, -40, 0, 0, 1));    // 0

ប្រើវាសម្រាប់ progress bar (byte ដែលបានផ្ទុកឡើងទៅភាគរយ), slider (ទីតាំង ជា pixel ទៅតម្លៃដូចជាកម្រិតសំឡេង) និងការបំប្លែងឯកតារវាង មាត្រដ្ឋានលីនេអ៊ែរពីរ ដូចជាអង្សាសេទៅកម្ពស់នៃទែរម៉ូម៉ែត្រ។

ផ្សំទាំងពីរសម្រាប់ progress bar ដែលរឹងមាំ។ ប្រសិនបើ 500,000 ក្នុងចំណោម 2,000,000 byte ត្រូវបានផ្ទុកឡើង៖

const percent = clamp(mapRange(500000, 0, 2000000, 0, 100), 0, 100);
console.log(percent); // 25

ប្រសិនបើ counter ការផ្ទុកឡើងហួសដោយសារ retry clamp រក្សា bar មិនឲ្យគូរហួស 100%។

7. រូបមន្ត៖ Module geometry

បង្កើត src/geometry.js ក្នុង mathlab៖

// src/geometry.js — point, មុំ និងចលនារលូន។

export function distance(a, b) {
  return Math.hypot(b.x - a.x, b.y - a.y);
}

export function degToRad(degrees) {
  return (degrees * Math.PI) / 180;
}

export function radToDeg(radians) {
  return (radians * 180) / Math.PI;
}

// កូអរដោនេអេក្រង់៖ y កើនទៅក្រោម ដូច្នេះ 90 ដឺក្រេចង្អុលទៅ ក្រោម។
export function pointOnCircle(cx, cy, radius, degrees) {
  const rad = degToRad(degrees);
  return {
    x: cx + radius * Math.cos(rad),
    y: cy + radius * Math.sin(rad),
  };
}

export function lerp(a, b, t) {
  return a + (b - a) * t;
}

export function clamp(value, min, max) {
  return Math.min(Math.max(value, min), max);
}

export function mapRange(value, inMin, inMax, outMin, outMax) {
  const t = (value - inMin) / (inMax - inMin);
  return lerp(outMin, outMax, t);
}

បន្ថែម export ចុងក្រោយទៅ src/index.js ដើម្បីឲ្យវា re-export module ទាំងដប់មួយ៖

export * from "./geometry.js";

សាកល្បងវាក្នុង demo.js៖

import {
  distance, pointOnCircle, lerp, clamp, mapRange,
} from "./src/index.js";

console.log(distance({ x: 0, y: 0 }, { x: 3, y: 4 })); // 5
console.log(pointOnCircle(100, 100, 50, 0));           // { x: 150, y: 100 }
console.log(lerp(0, 100, 0.25));                       // 25
console.log(clamp(150, 0, 100));                       // 100
console.log(mapRange(30, 0, 60, 0, 100));              // 50

8. Capstone៖ របាយការណ៍ mathlab

ក្នុងដប់មួយជំពូក អ្នកបានសាងសង់ module មួយក្នុងមួយជំពូក។ ឥឡូវនាំវាមកជួបជុំគ្នា។ បង្កើត report.js នៅ root នៃ mathlab ជាប់នឹង demo.js។ វា import ពី src/index.js ដែល re-export អ្វីៗទាំងអស់ ហើយដំណើរការ demo ខ្លីៗនៃ module នីមួយៗក្រោមចំណងជើងមួយ។

// report.js — ដំណើរទស្សនកិច្ចតែមួយនៃអ្វីៗទាំងអស់ក្នុង mathlab។
import {
  // chapters 2-9
  toHex, nearlyEqual,
  READ, WRITE, EXEC, hasFlag, setFlag,
  union, intersection,
  mod, nextIndex,
  toCents, formatMoney,
  stepsToBinarySearch,
  linearSearch, binarySearch, time,
  // chapters 10-12
  permutations, combinations, passwordSpace, pageCount,
  randomInt, expectedValue, birthdayCollision,
  distance, pointOnCircle, lerp, clamp, mapRange,
} from "./src/index.js";

function section(title) {
  console.log(`\n== ${title} ==`);
}

section("2. Number systems");
console.log("255 in hex:", toHex(255));
console.log("0.1 + 0.2 nearly 0.3:", nearlyEqual(0.1 + 0.2, 0.3));

section("3. Bit flags");
let perms = READ;
perms = setFlag(perms, WRITE);
console.log("can write:", hasFlag(perms, WRITE));
console.log("can exec:", hasFlag(perms, EXEC));

section("5. Sets");
const a = new Set(["km", "en", "fr"]);
const b = new Set(["km", "zh"]);
console.log("union:", [...union(a, b)]);
console.log("intersection:", [...intersection(a, b)]);

section("6. Modular arithmetic");
console.log("mod(-1, 5):", mod(-1, 5));
console.log("next slide after the last of 4:", nextIndex(3, 4));

section("7. Money");
console.log("toCents('4.50'):", toCents("4.50"));
console.log("formatMoney:", formatMoney(450, "USD"));

section("8-9. Growth and searching");
console.log("steps to search 1,000,000 items:", stepsToBinarySearch(1_000_000));
const sorted = Array.from({ length: 1_000_000 }, (_, i) => i);
console.log("linear:", linearSearch(sorted, 999_999), "binary:", binarySearch(sorted, 999_999));
console.log("linear took more than binary:",
  time(() => linearSearch(sorted, 999_999)).ms >
    time(() => binarySearch(sorted, 999_999)).ms);

section("10. Counting");
console.log("PINs (4 digits):", passwordSpace(10, 4));
console.log("podiums from 8 runners:", permutations(8, 3));
console.log("lottery 6 of 49:", combinations(49, 6));
console.log("pages for 95 items:", pageCount(95, 10));

section("11. Probability");
const roll = randomInt(1, 6);
console.log("a die roll is 1 to 6:", roll >= 1 && roll <= 6);
console.log("expected die value:",
  expectedValue([1, 2, 3, 4, 5, 6].map((value) => ({ value, probability: 1 / 6 }))));
console.log("23 people share a birthday:", birthdayCollision(23).toFixed(3));

section("12. Geometry");
console.log("distance (0,0)->(3,4):", distance({ x: 0, y: 0 }, { x: 3, y: 4 }));
const p = pointOnCircle(100, 100, 50, 0);
console.log("point on circle at 0 degrees:", p.x, p.y);
console.log("lerp(0, 100, 0.25):", lerp(0, 100, 0.25));
console.log("clamp(150, 0, 100):", clamp(150, 0, 100));
console.log("mapRange(30, 0, 60, 0, 100):", mapRange(30, 0, 60, 0, 100));

ដំណើរការវាពី folder mathlab៖

node report.js

អ្នកគួរតែឃើញអ្វីមួយដូចនេះ។ បន្ទាត់សម្រាប់ជំពូក 2 ដល់ 9 ពឹងលើ របៀបដែលអ្នកសរសេរ module ទាំងនោះពិតប្រាកដ (ឧទាហរណ៍ ថាតើ toHex ត្រឡប់ "ff" ឬ "0xff") ដូច្នេះរបស់អ្នកអាចខុសបន្តិច។ ផ្នែកបួនចុងក្រោយ មកពីជំពូកនេះ និងជំពូកពីរមុន ហើយគួរតែត្រូវគ្នា៖

== 2. Number systems ==
255 in hex: ff
0.1 + 0.2 nearly 0.3: true

== 3. Bit flags ==
can write: true
can exec: false

== 5. Sets ==
union: [ 'km', 'en', 'fr', 'zh' ]
intersection: [ 'km' ]

== 6. Modular arithmetic ==
mod(-1, 5): 4
next slide after the last of 4: 0

== 7. Money ==
toCents('4.50'): 450
formatMoney: $4.50

== 8-9. Growth and searching ==
steps to search 1,000,000 items: 20
linear: 999999 binary: 999999
linear took more than binary: true

== 10. Counting ==
PINs (4 digits): 10000n
podiums from 8 runners: 336n
lottery 6 of 49: 13983816n
pages for 95 items: 10

== 11. Probability ==
a die roll is 1 to 6: true
expected die value: 3.5
23 people share a birthday: 0.507

== 12. Geometry ==
distance (0,0)->(3,4): 5
point on circle at 0 degrees: 150 100
lerp(0, 100, 0.25): 25
clamp(150, 0, 100): 100
mapRange(30, 0, 60, 0, 100): 50

ប្រសិនបើ import បរាជ័យដោយ does not provide an export named ... ឈ្មោះក្នុង report.js មិនត្រូវនឹងឈ្មោះដែល module របស់អ្នក export ទេ។ បើក module នោះ ពិនិត្យអក្ខរាវិរុទ្ធ ហើយកែផ្នែកណាដែលខុស។ ប្រសិនបើបន្ទាត់មួយបោះពុម្ព undefined ឬបោះ error សូមត្រឡប់ទៅរូបមន្តនៃជំពូកនោះ ហើយប្រៀបធៀប។ នោះ គឺជារបៀបធម្មតាក្នុងការរក bug ក្នុង library៖ ដំណើរការវា អានលទ្ធផល ហើយ តាមដានភាពខុសគ្នា។

ឥឡូវអ្នកមាន library ដែលដំណើរការបានជាមួយ module ដប់មួយ និង script មួយដែល សាកល្បងទាំងអស់។ នេះមានរូបរាងដូចគម្រោងពិតប្រាកដ៖ module តូចៗ entry point មួយ និង smoke test ដែលប្រាប់អ្នកយ៉ាងឆាប់រហ័សថាតើ អ្វីៗនៅតែដំណើរការឬអត់។

9. ស៊េរីទាំងមូលក្នុងតារាងតែមួយ

10. ទៅទីណាបន្ត

ឥឡូវអ្នកអាចអានកូដមួយបំណែក ហើយសួរសំណួរត្រឹមត្រូវ៖ តើនេះអំពី bit, សំណុំ, សំណល់, ការលូតលាស់, ការរាប់ ឬភាពអាចកើតឡើង? ការដាក់ឈ្មោះប្រភេទ គណិតវិទ្យាគឺជាពាក់កណ្តាលនៃសមរភូមិ។

នេះជារបៀបបន្តកសាង៖

• Roadmap ចាប់ផ្តើមនៅទីនេះ — មើលផ្លូវសិក្សាទាំងមូល និង ជ្រើសរើស track បន្ទាប់របស់អ្នក៖ frontend, backend, សុវត្ថិភាព និងច្រើនទៀត។
• Data Structures & Algorithms (បានគ្រោងទុក) — យកការគិតបែប Big-O ពី ជំពូក 8 និង 9 ហើយបំប្លែងវាទៅជាការអនុវត្ត៖ array, hash table, tree, ការតម្រៀប និងការស្វែងរក ដែល Big-O សម្រេចថាជម្រើសណាត្រឹមត្រូវ។
• Math for AI (បានគ្រោងទុក) — បន្តជាមួយប្រធានបទដែលបានទុកចោលដោយចេតនា នៅទីនេះ៖ vector, matrix និងការមើលស្រាលៗអំពី calculus ដែលជាគណិតវិទ្យា នៅពីក្រោយ machine learning។
• ពង្រីក mathlab។ បន្ថែមឯកសារតេស្តដោយ node --test ឬសរសេរឧបករណ៍ command-line តូចមួយដែលហៅ module របស់អ្នក។ គម្រោងតូចមួយដែលអ្នកបន្តប្រើ បង្រៀនច្រើនជាងមេរៀនមួយទៀត។

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

1. Point ជិតបំផុត។ សរសេរ nearest(origin, points) ដែលត្រឡប់ point ពី array ដែលនៅជិត origin បំផុត ដោយប្រើ distance។ តេស្តវាជាមួយ ហាងបី និងទីតាំងរបស់អ្នកប្រើ។
2. ម្ជុលនាឡិកា។ សរសេរ handPosition(minutes, length) ដែលត្រឡប់ ចំណុចចុងនៃម្ជុលនាទីសម្រាប់នាឡិកាដែលមានចំណុចកណ្តាលនៅ (0, 0)។ នៅ 0 នាទី វាគួរចង្អុលត្រង់ឡើងលើ (y អវិជ្ជមាន) ហើយនៅ 15 នាទីត្រង់ ទៅស្តាំ។ ចងចាំការប្តូរ 90 ដឺក្រេ និងថាមួយនាទីគឺ 6 ដឺក្រេ។
3. ការស្រអាប់ពណ៌។ សរសេរ lerpColor(c1, c2, t) ដែលស្រអាប់រវាង ពណ៌ { r, g, b } ពីរដោយ lerp channel នីមួយៗ ហើយបង្គត់។ ប្រើវាដើម្បីបោះពុម្ព ពណ៌ប្រាំរវាងខ្មៅ និងស។
4. Progress ដែលមានសុវត្ថិភាព។ សរសេរ progressPercent(done, total) ដោយប្រើ mapRange និង clamp។ វាគួរត្រឡប់ 0 នៅពេល total ជា 0 (គ្មានការភ្ញាក់ផ្អើលពីការចែកនឹងសូន្យ) ហើយមិនដែលហួស 100។ តេស្តជាមួយ (50, 200), (250, 200) និង (0, 0)។
5. បន្ថែមទៅរបាយការណ៍។ បន្ថែមផ្នែកមួយទៅ report.js ដែលប្រើគំនិត មួយពីជំពូក 4 (truthTable ឬការពិនិត្យ De Morgan) និងមួយពី ជំពូក 9 (ការវាស់ពេល Set.has ទល់នឹង array.includes)។ ដំណើរការវា ហើយបញ្ជាក់ថា គ្រប់ផ្នែកនៅតែបោះពុម្ព។
6. Helper របស់អ្នកផ្ទាល់។ ជ្រើសរើសគំនិតមួយពីតារាងសង្ខេបដែលអ្នកចង់ ចងចាំ ដូចជា wrap សម្រាប់ carousel ឬ birthday collision សម្រាប់ កូដ coupon ខ្លី ហើយសរសេរ function ពិតប្រាកដតូចមួយសម្រាប់គម្រោងរបស់ អ្នកផ្ទាល់ដោយប្រើវា។

សូមអបអរសាទរដែលបានបញ្ចប់ គណិតវិទ្យាសម្រាប់អ្នកសរសេរកម្មវិធី។ អ្នកបានចាប់ផ្តើមជាមួយ 0.1 + 0.2 !== 0.3 ហើយឥឡូវអ្នកអាចរាប់លទ្ធភាព វាយតម្លៃ algorithm ដាក់ point លើរង្វង់ និងសាងសង់ library ដែលបញ្ជាក់វា។ នៅពេលអ្នកត្រៀមខ្លួនរួច សូមត្រឡប់ទៅ Roadmap ចាប់ផ្តើមនៅទីនេះ ដើម្បី ជ្រើសរើសស៊េរីបន្ទាប់របស់អ្នក។ Data Structures & Algorithms និង Math for AI នឹង ពឹងលើអ្វីដែលអ្នកបានអនុវត្តនៅទីនេះដោយផ្ទាល់ ហើយអ្នកមានវាក្យសព្ទ សម្រាប់ទាំងពីររួចហើយ។