TypeScript:
การแทรกค่าลงในสตริง
วิธีการ:
เพื่อแทรกสตริงใน TypeScript, คุณใช้เครื่องหมาย backticks `
และ syntax ${expression}
:
let user = 'Charlie';
let age = 27;
// การแทรกสตริง
let greeting = `Hi, I'm ${user} and I'm ${age} years old.`;
console.log(greeting); // ผลลัพธ์: Hi, I'm Charlie and I'm 27 years old.
ดำดิ่งลงไป:
การแทรกสตริงไม่ได้มีอยู่เฉพาะใน TypeScript; แต่ยังมีใน JavaScript ตั้งแต่ ES6 และหลายภาษาอื่นๆ ก่อนหน้านี้, เราใช้วิธีเชื่อมต่อสตริงด้วยเครื่องหมาย +
, ซึ่งดูเหมือนนี้:
let greeting = 'Hi, I\'m ' + user + ' and I\'m ' + age + ' years old.';
วิธีการ +
ใช้ได้, แต่มันยุ่งยากและอ่านยากขึ้น, เฉพาะอย่างยิ่งเมื่อมีตัวแปรหลายตัว. ด้วยการแทรก, โครงสร้างเทมเพลตจะสะอาดขึ้นและข้อผิดพลาดง่ายต่อการหลีกเลี่ยง
มันทำงานอย่างไรภายใต้ฮูด? สตริงที่ถูกแทรกคือ “syntactic sugar” - แบบที่ง่ายขึ้นในการใช้งานคุณสมบัติที่ซับซ้อนกว่าที่เรียกว่า “template literals”. เมื่อคอมไพล์, การแทรกที่เป็นมิตรและอ่านง่ายของคุณจะถูกแปลงไปเป็นรูปแบบที่เครื่องมือ JavaScript สามารถเข้าใจได้, บ่อยครั้งเกี่ยวข้องกับการใช้การเชื่อมต่อหรือวิธีการจัดการสตริงอื่นๆ
ทางเลือกในการแทรกนอกจากนี้อาจเป็นการใช้ฟังก์ชันเทมเพลตหรือไลบรารี่, แต่สำหรับกรณีส่วนใหญ่, การแทรกด้วย backticks เป็นเครื่องมือที่สะดวกที่สุดสำหรับงานนี้