7 ม.ค. เวลา 05:48 • การศึกษา

Typescript The Type System: System of a Clown 1🔥

แบบฝึกหัดนี้เค้าจะให้เราแก้บัคที่แอบซ่อนไว้ในโจทย์ แต่ถ้าลองอ่านจริงๆ แล้วโจทย์นั้นสอนให้เราหาบัคจากการรันคำสั่ง
npm run tsc -- --*name of the folder's project* --watch
e.g.
npm run tsc -- --project 01-clowning-around --watch
ซึ่งคำสั่งนี้จะเป็น watch mode ก่อนที่เราจะทำการ compiler โค้ดซึ่งคำสั่งนี้จะรันเรื่อยๆ และจะทำการเช็คทุกครั้งที่มีการเซฟไฟล์
โดยถ้าเรารันคำสั่งที่กล่าวไปข้างต้นนี้ใน Terminal จะเห็นได้ว่าระบบจะทำการ compile ใน watch mode ซึ่งเส้นใต้สีแดงจะเป็นตัวบอกว่าบัคเกิดจากที่บรรทัดไหนของโค้ด ซึ่งในที่นี้คือ 34 ตรง i += capacity และ
สาเหตุของบัคเกิดจาก Operator '+=' cannot be applied to types 'number' and 'string | number'. ที่ไฮไลท์ไว้ ซึ่งก็คือ Operator += ไม่สามารถนำไปใช้ได้กับตัวแปรประเภท string หรือ number ได้
ซึ่งวิธีแก้ก็คือไปกำหนดให้ตัวแปร capacity เป็นประเภท number
โค้ดที่บัค ➡️ โค้ดที่แก้แล้ว
let capacity; ➡️ let capacity: number;
แล้วเมื่อกดเซฟ ให้สังเกตุในรูปด้านบนนี้ว่าวงกลมขาวที่อยู่ในวงสีแดงได้หายไปแล้ว ในรูปถัดไป
ซึ่งเมื่อเซฟแล้วจะเห็นว่าตัว watch mode นั้นจะทำการหาบัคตัวใหม่ซึ่งในที่นี้คือ บรรทัดที่18 ตัวแปรที่เป็น string จะนำมาใช้กับประเภท number ไม่ได้ ซึ่งวิธีแก้ของเราในส่วนนี้คือ
โค้ดที่บัค ➡️ โค้ดที่แก้แล้ว
capacity = "1"; ➡️ capacity = 1;
นำเอา Quotation mark ออก เพื่อให้ค่าที่มากำหนดให้ตัวแปร capacity นั้นมีค่าเป็นประเภท number
ซึ่งเราจะทำการแก้โค้ดแบบนี้ไปเรื่อยๆ จนไม่มีบัคเกิดขึ้น
ซึ่งเมื่อเราทำการแก้บัคเรื่อยๆ เสร็จแล้วจนชึ้น
Found 0 errors. Watching for file changes.
ก็ถือว่าเป็นอันจบของแบบฝึกหัดนี้
โฆษณา