Computer >> บทช่วยสอนคอมพิวเตอร์ >  >> การเขียนโปรแกรม >> JavaScript

JavaScript: ทำไมตัวดำเนินการ % ทำงานกับสตริงได้? - (Type Coercion)

สมมติว่าเรามีโค้ดสนิปเพทที่ให้ผลลัพธที่น่าประหลาดใจ ก่อนอื่น ตัวดำเนินการโมดูลโลทำงานกับสตริงได้ (อย่างน่าประหลาด) สอง การต่อสตริงสองตัวให้ผลลัพธ์แปลกๆ

เราต้องอธิบายว่าทำไม JavaScript จึงทำเช่นนี้

โค้ดปัญหา

ตัวอย่าง

const numStr = '127';
const result = numStr % 5;
const firstName = 'Armaan';
const lastName = 'Malik';
const fullName = firstName + + lastName;
console.log('modulo result: ', result);
console.log('full name: ', fullName);

ผลลัพธ์

modulo result: 2
full name: ArmaanNaN

ก่อนจะเข้าโค้ด เรามาทำความเข้าใจเกี่ยวกับหัวข้อพื้นฐานสำคัญของ JavaScript คือ Type Coercion (การบังคับประเภท)

Type Coercion

โดยพื้นฐานแล้ว Type Coercion คือวิธีที่คอมไพเลอร์ JavaScript ใช้เปลี่ยนชนิดข้อมูลหนึ่งเป็นอีกชนิดหนึ่ง ตัวอย่างเช่น การเปลี่ยนสตริงเป็นบูลีน ตัวเลขเป็นสตริง ฯลฯ

Type Coercion เป็นหัวข้อกว้างมาก เพื่อจำกัดความยาว เราจะสำรวจเฉพาะสิ่งที่ใช้ในโค้ดนี้ ของสองประเภทของ Type Coercion ประเภทที่คอมไพเลอร์ทำโดยอัตโนมัติเรียกว่า Implicit Type Coercion (การบังคับประเภทโดยนัย)

มันปฏิบัติตามกฎดังนี้

  • ชนิดข้อมูลใดๆ (primitive หรือ non-primitive) จะถูกบังคับประเภทโดยนัยเป็น:
    • String (เมื่อใช้กับตัวดำเนินการบวกไบนารี +)
    • Number (เมื่อใช้กับตัวดำเนินการคณิตศาสตร์เช่น +, -, /, *, % และตัวดำเนินการบวกยูนารี + เท่านั้นที่กระตุ้นการบังคับเป็น Number ไม่ใช่บวกไบนารี) เมื่อใช้กับตัวดำเนินการเปรียบเทียบ ตัวดำเนินการบิตวายซ์ หรือตัวดำเนินการเท่ากับแบบ鬆散 ==
    • Boolean (เมื่อใช้กับตัวดำเนินการตรรกะ &&, ||, !)

*** สิ่งสำคัญอีกอย่างคือ ความสำคัญของตัวดำเนินการบวกยูนารี (+) สูงกว่าตัวดำเนินการบวกไบนารี (+)

การอธิบายโค้ด

เมื่อเข้าใจสิ่งเหล่านี้แล้ว มาดูโค้ดทีละบรรทัด

บรรทัด 2 → result = '127' % 5;

การบังคับประเภทโดยนัยเห็นตัวดำเนินการ % จึงแปลงสตริง '127' เป็นตัวเลข 127 และเก็บค่า 2 ไว้ใน result

บรรทัด 5 → fullName = firstName + + lastName;
fullName = firstName + (+lastName);

ในสถานการณ์ปกติ การคำนวณจะทำจากซ้ายไปขวา แต่เนื่องจากความสำคัญของตัวดำเนินการยูนารี มันถูกคำนวณเป็นตัวเลขก่อน และการดำเนินการกลายเป็น

fullName = firstName + NaN;

และจากนั้น

fullName = ArmaanNaN