เทคนิคการแปลงชนิดอย่างชัดเจน
แปลงชนิดโดยเจตนาด้วย Number, String และ Boolean
เทคนิคการแปลงชนิดอย่างชัดเจน เป็นบทเรียน JavaScript Academy ฟรีบน CoddyKit นี่คือบทเรียนที่ 4 จากทั้งหมด 4 บทเรียน คุณสามารถอ่านบทเรียนทั้งหมดด้านล่างฟรี — จากนั้นลองปฏิบัติด้วยตัวคุณเองในเบราว์เซอร์พร้อมตัวแก้ไขโค้ดในตัวและติวเตอร์ AI ตลอด 24/7 บทเรียนนี้เป็นส่วนหนึ่งของเส้นทางการเรียน JavaScript Academy และความก้าวหน้าของคุณจะซิงค์ข้ามเว็บและแอป CoddyKit คอร์ส JavaScript Academy มีบทเรียนทั้งหมด 4 บทเรียน
การแปลงอย่างชัดเจน
การแปลงอย่างชัดเจนหมายถึงการเปลี่ยนชนิดของค่าโดยตั้งใจด้วยฟังก์ชัน แทนการปล่อยให้ตัวดำเนินการบังคับแปลงชนิด วิธีนี้ทำให้โค้ดชัดเจนและปลอดภัยยิ่งขึ้น
console.log(Number("42"))
console.log(String(42))ฟังก์ชันแปลงเป็นตัวเลข
ฟังก์ชันแปลงเป็นตัวเลขจะแปลงค่าให้เป็นตัวเลข สตริงที่เป็นตัวเลขจะแปลงได้อย่างถูกต้อง ส่วนสตริงที่ไม่ใช่ตัวเลขจะกลายเป็น NaN
console.log(Number("3.14"))
console.log(Number(" 10 "))
console.log(Number("abc"))กรณีขอบของการแปลงเป็นตัวเลข
ฟังก์ชันแปลงเป็นตัวเลขจะถือว่าสตริงว่างและค่าว่างมีค่าเป็นศูนย์ แต่ค่าที่ไม่กำหนดจะกลายเป็น NaN การรู้กรณีขอบเหล่านี้ช่วยป้องกันข้อผิดพลาด
console.log(Number(""))
console.log(Number(null))
console.log(Number(undefined))parseInt
parseInt อ่านจำนวนเต็มจากจุดเริ่มต้นของสตริง และหยุดที่อักขระตัวแรกที่ไม่ใช่ตัวเลข โดยจะละเว้นข้อความที่อยู่ต่อท้าย
console.log(parseInt("42px"))
console.log(parseInt("3.99"))
console.log(parseInt("abc"))ฐานของ parseInt
ส่งฐานตัวเลขให้ parseInt เสมอเพื่อระบุฐานที่ใช้ ให้ใช้ 10 สำหรับการแยกวิเคราะห์เลขฐานสิบตามปกติ เพื่อหลีกเลี่ยงความกำกวม
console.log(parseInt("0x1F", 16))
console.log(parseInt("101", 2))
console.log(parseInt("08", 10))parseFloat
parseFloat อ่านเลขทศนิยมจากจุดเริ่มต้นของสตริง โดยเก็บส่วนทศนิยมที่ parseInt จะตัดทิ้งไว้
console.log(parseFloat("3.14m"))
console.log(parseFloat("1.5e3"))ฟังก์ชันแปลงเป็นข้อความ
ฟังก์ชันแปลงเป็นข้อความจะแปลงค่าใด ๆ ให้เป็นรูปแบบข้อความของค่านั้น รวมถึงค่าว่างและค่าที่ไม่กำหนด ซึ่งจะกลายเป็นคำที่สื่อความหมายถึงค่าว่างและค่าที่ไม่กำหนด
console.log(String(123))
console.log(String(true))
console.log(String(null))วิธีการ toString
ค่าส่วนใหญ่มีวิธีการ toString ซึ่งรับฐานตัวเลขได้สำหรับตัวเลข เพื่อสร้างข้อความในรูปเลขฐานสองหรือเลขฐานสิบหก
console.log((255).toString(16))
console.log((5).toString(2))ฟังก์ชันแปลงเป็นค่าบูลีน
ฟังก์ชันแปลงเป็นค่าบูลีนจะแปลงค่าตามกฎของค่าที่ถือว่าเป็นจริงและเป็นเท็จ แล้วคืนค่าเป็นจริงหรือเป็นเท็จอย่างชัดเจน
console.log(Boolean(1))
console.log(Boolean(""))
console.log(Boolean("no"))การเลือกเครื่องมือที่เหมาะสม
ใช้ฟังก์ชันแปลงเป็นตัวเลขสำหรับการแปลงสตริงทั้งค่า ใช้ parseInt หรือ parseFloat สำหรับดึงตัวเลขออกจากข้อความปะปน และใช้ฟังก์ชันแปลงเป็นข้อความหรือ toString สำหรับผลลัพธ์ที่เป็นข้อความ
console.log(Number("100"))
console.log(parseInt("100 dollars", 10))การตรวจสอบการแปลง
หลังจากแปลงเป็นตัวเลขแล้ว ให้ตรวจสอบด้วย Number.isNaN เพื่อยืนยันว่าการแปลงสำเร็จก่อนนำผลลัพธ์ไปใช้
const raw = "x9"
const n = Number(raw)
if (Number.isNaN(n)) {
console.log("invalid number")
}ตรวจสอบความเข้าใจอย่างรวดเร็ว
ทดสอบความรู้เรื่องการแปลงชนิดของคุณ
ทบทวน
ทบทวน: แปลงชนิดอย่างชัดเจนเพื่อให้โค้ดชัดเจน
- ฟังก์ชันแปลงเป็นตัวเลขแปลงสตริงทั้งค่า ส่วนค่าที่ไม่ใช่ตัวเลขจะกลายเป็น NaN
- parseInt และ parseFloat ดึงตัวเลขที่อยู่ด้านหน้า
- ส่งฐานตัวเลขให้ parseInt เสมอ
- ฟังก์ชันแปลงเป็นข้อความและฟังก์ชันแปลงเป็นค่าบูลีนจะแปลงเป็นข้อความและค่าจริงเท็จ
console.log(Number("7"))
console.log(String(7))คำถามที่พบบ่อย
บทเรียน “เทคนิคการแปลงชนิดอย่างชัดเจน” ฟรีหรือไม่
ใช่ — ข้อความเต็มของ “เทคนิคการแปลงชนิดอย่างชัดเจน” ฟรีให้อ่านที่นี่บนเว็บ เพื่อปฏิบัติแบบโต้ตอบ (ตัวแก้ไขโค้ดในตัวและติวเตอร์ AI ตลอด 24/7) และปลดล็อคส่วนที่เหลือของคอร์ส JavaScript Academy ให้อัปเกรดเป็น CoddyKit PRO คอร์ส JavaScript Academy มีบทเรียนทั้งหมด 4 บทเรียน
คุณจะเรียนรู้อะไรในบทเรียน “เทคนิคการแปลงชนิดอย่างชัดเจน”
แปลงชนิดโดยเจตนาด้วย Number, String และ Boolean คุณปฏิบัติ JavaScript Academy ด้วยโค้ดที่ใช้งานได้จริงที่คุณเรียกใช้โดยตรงในเบราว์เซอร์ และติวเตอร์ AI ตลอด 24/7 ตอบคำถามของคุณขณะที่คุณไปผ่านบทเรียน
คุณต้องมีประสบการณ์ก่อนที่จะเริ่มเรียน JavaScript Academy หรือไม่
ไม่จำเป็นต้องมีประสบการณ์มาก่อน JavaScript Academy บน CoddyKit ออกแบบมาสำหรับผู้เริ่มต้นไปจนถึงผู้เรียนขั้นสูง คุณสามารถเริ่มต้นที่นี่หรือเริ่มจากตัวแรกและเรียนด้วยความเร็วของคุณเอง นี่คือบทเรียนที่ 4 จากทั้งหมด 4 บทเรียน
บทเรียน “เทคนิคการแปลงชนิดอย่างชัดเจน” ใช้เวลานานแค่ไหน
บทเรียน CoddyKit ส่วนใหญ่ใช้เวลาประมาณ 5–10 นาที แต่ละบทเรียนจึงสั้นและเป็นแบบโต้ตอบ คุณสามารถก้าวหน้าอย่างต่อเนื่องและกลับมาเรียนต่อจากตรงที่เพิ่งหยุดบนเว็บและแอปได้เลย
ฉันเขียนและรันโค้ดในบทเรียน JavaScript Academy นี้ได้ไหม
ได้ บทเรียน JavaScript Academy ทุกบทมีตัวแก้ไขโค้ดในตัว คุณจึงเขียนและรันโค้ดจริงได้เลยในเบราว์เซอร์ และได้รับข้อเสนอแนะจาก AI ในทันที — ไม่ต้องติดตั้งในเครื่องของคุณ
บทเรียนทั้งหมดในหลักสูตรนี้
- ค่า Truthy และ Falsy
- ความเท่ากันแบบหลวมเทียบกับแบบเคร่งครัด
- การบังคับแปลงชนิดโดยนัยในการดำเนินการ
- เทคนิคการแปลงชนิดอย่างชัดเจน