การแทรกค่าลงในสตริง

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 เป็นเครื่องมือที่สะดวกที่สุดสำหรับงานนี้

ดูเพิ่มเติมที่: