Type coercionคือกระบวนการแปลงค่าจากประเภทหนึ่งไปยังอีกประเภทหนึ่ง (เช่นสตริงเป็นตัวเลขอ็อบเจ็กต์เป็นบูลีนและอื่น ๆ ) ประเภทใด ๆ ไม่ว่าจะเป็นแบบดั้งเดิมหรือวัตถุเป็นหัวเรื่องที่ถูกต้องสำหรับการบีบบังคับประเภท ในการเรียกคืน primitives ได้แก่ number, string, boolean, null, undefined + Symbol (เพิ่มใน ES6)
การบังคับขู่เข็ญโดยนัยและชัดแจ้ง
อาจเป็นการบังคับอย่างชัดเจนและโดยปริยาย
เมื่อนักพัฒนาแสดงความตั้งใจที่จะแปลงระหว่างประเภทโดยการเขียนโค้ดที่เหมาะสมเช่น Number(value)นี้เรียกว่าการบังคับประเภทอย่างชัดเจน (หรือการคัดเลือกประเภท)
เนื่องจาก JavaScript เป็นภาษาที่พิมพ์ไม่ชัดเจนจึงสามารถแปลงค่าระหว่างประเภทต่างๆได้โดยอัตโนมัติและเรียกว่าการบังคับประเภทโดยนัย มันมักจะเกิดขึ้นเมื่อคุณใช้ผู้ประกอบการค่าของชนิดที่แตกต่างกันเช่น
1 == null, 2/’5', null + new Date()หรือมันสามารถถูกเรียกโดยบริบทโดยรอบเช่นเดียวกับการif (value) {…}ที่ค่าบังคับให้บูล
ตัวดำเนินการหนึ่งที่ไม่ก่อให้เกิดการบีบบังคับประเภทโดยนัยคือ===ซึ่งเรียกว่าตัวดำเนินการความเท่าเทียมกันอย่างเข้มงวด ในทางกลับกันตัวดำเนินการความเท่าเทียมกันแบบหลวม==จะทำการเปรียบเทียบและบังคับประเภทหากจำเป็น
การบีบบังคับประเภทโดยนัยเป็นดาบสองคม: เป็นแหล่งที่มาของความยุ่งยากและข้อบกพร่อง แต่ยังเป็นกลไกที่มีประโยชน์ที่ช่วยให้เราเขียนโค้ดน้อยลงโดยไม่สูญเสียความสามารถในการอ่าน
การแปลงสามประเภท
กฎข้อแรกที่ควรทราบคือการแปลงใน JavaScript มีเพียงสามประเภท:
- เป็นสตริง
- เป็นบูลีน
- เป็นตัวเลข
ประการที่สองลอจิกการแปลงสำหรับวัตถุดั้งเดิมและวัตถุทำงานแตกต่างกัน แต่ทั้งดั้งเดิมและวัตถุสามารถแปลงได้ในสามวิธีดังกล่าวเท่านั้น
เริ่มกันที่ไพรเมอร์ก่อน
การแปลงสตริง
ในการแปลงค่าเป็นสตริงอย่างชัดเจนให้ใช้ฟังก์ชัน String () การบังคับโดยนัยถูกเรียกโดยตัวดำเนินการ binary + เมื่อตัวถูกดำเนินการใด ๆ เป็นสตริง:
String(123) // explicit
123 + '' // implicit
ค่าดั้งเดิมทั้งหมดจะถูกแปลงเป็นสตริงตามธรรมชาติอย่างที่คุณคาดหวัง:
String(123) // '123'
String(-12.3) // '-12.3'
String(null) // 'null'
String(undefined) // 'undefined'
String(true) // 'true'
String(false) // 'false'
การแปลงสัญลักษณ์เป็นเรื่องที่ยุ่งยากเล็กน้อยเนื่องจากสามารถแปลงได้อย่างชัดเจนเท่านั้น แต่ไม่สามารถแปลงโดยปริยายได้
String(Symbol('my symbol')) // 'Symbol(my symbol)'
'' + Symbol('my symbol') // TypeError is thrown
การแปลงบูลีน
หากต้องการแปลงค่าเป็นบูลีนอย่างชัดเจนให้ใช้Boolean()ฟังก์ชัน การแปลงโดยนัยเกิดขึ้นในบริบทเชิงตรรกะหรือถูกทริกเกอร์โดยตัวดำเนินการทางตรรกะ ( || && !)
Boolean(2) // explicit
if (2) { ... } // implicit due to logical context
!!2 // implicit due to logical operator
2 || 'hello' // implicit due to logical operator
หมายเหตุ:ตัวดำเนินการเชิงตรรกะเช่น|| and &&ทำการแปลงบูลีนภายใน แต่ส่งคืนค่าของตัวถูกดำเนินการดั้งเดิมแม้ว่าจะไม่ใช่บูลีนก็ตาม
// returns number 123, instead of returning true
// 'hello' and 123 are still coerced to boolean internally to calculate the expression
let x = 'hello' && 123; // x === 123
ทันทีที่มีผลลัพธ์เพียง 2 ผลลัพธ์ของการแปลงบูลีน: จริงหรือเท็จการจำรายการค่าที่เป็นเท็จก็ทำได้ง่ายขึ้น
Boolean('') // false
Boolean(0) // false
Boolean(-0) // false
Boolean(NaN) // false
Boolean(null) // false
Boolean(undefined) // false
Boolean(false) // false
ค่าใด ๆ ที่ไม่อยู่ในรายชื่อที่จะถูกแปลงเป็นtrueรวมทั้งobject, function, Array, Date, ผู้ใช้กำหนดชนิดและอื่น ๆ สัญลักษณ์เป็นค่าที่แท้จริง อ็อบเจ็กต์และอาร์เรย์ที่ว่างเปล่าเป็นค่าที่แท้จริงเช่นกัน:
Boolean({}) // true
Boolean([]) // true
Boolean(Symbol()) // true
!!Symbol() // true
Boolean(function() {}) // true
การแปลงตัวเลข
สำหรับการแปลงอย่างชัดเจนเพียงแค่ใช้Number()ฟังก์ชั่นเดียวกับที่คุณทำกับและBoolean()String()
การแปลงโดยนัยเป็นเรื่องยุ่งยากเนื่องจากมีการเรียกใช้ในหลายกรณี:
ตัวดำเนินการเปรียบเทียบ (>, <, <=,> =)
ตัวดำเนินการบิต (| & ^ ~)
ตัวดำเนินการเลขคณิต (- + * /%) โปรดทราบว่าไบนารี + ไม่ทริกเกอร์การแปลงตัวเลขเมื่อตัวถูกดำเนินการใด ๆ เป็นสตริง
ตัวดำเนินการ unary +
ตัวดำเนินการความเสมอภาคหลวม == (รวม! =)
โปรดทราบว่า == ไม่ทริกเกอร์การแปลงตัวเลขเมื่อตัวถูกดำเนินการทั้งสองเป็นสตริง
Number ('123') // Explicit + '123' // implicit 123! = '456' // implicit 4> '5' // implicit 5 / null // implicit true | 0 // นัย
วิธีการแปลงค่าดั้งเดิมเป็นตัวเลขมีดังนี้
Number(null) // 0
Number(undefined) // NaN
Number(true) // 1
Number(false) // 0
Number(" 12 ") // 12
Number("-12.34") // -12.34
Number("\n") // 0
Number(" 12s ") // NaN
Number(123) // 123
(true == 1) => true/(true === 1) => false.