Chữ viết mẫu JavaScript
Từ đồng nghĩa:
- Chữ mẫu
- Chuỗi mẫu
- Mẫu chuỗi
- Cú pháp Back-Tics
Cú pháp Back-Tics
Chữ mẫu sử dụng dấu tích (``) thay vì dấu ngoặc kép ("") để xác định một chuỗi:
Thí dụ
let text = `Hello World!`;
Trích dẫn Inside Strings
Với các ký tự mẫu , bạn có thể sử dụng cả dấu ngoặc kép và dấu ngoặc kép bên trong một chuỗi:
Thí dụ
let text = `He's often called "Johnny"`;
Chuỗi nhiều dòng
Các ký tự mẫu cho phép các chuỗi nhiều dòng:
Thí dụ
let text =
`The quick
brown fox
jumps over
the lazy dog`;
Phép nội suy
Các ký tự mẫu cung cấp một cách dễ dàng để nội suy các biến và biểu thức thành chuỗi.
Phương pháp này được gọi là nội suy chuỗi.
Cú pháp là:
${...}
Thay thế có thể thay thế
Các ký tự mẫu cho phép các biến trong chuỗi:
Thí dụ
let firstName = "John";
let lastName = "Doe";
let text = `Welcome ${firstName}, ${lastName}!`;
Việc thay thế tự động các biến bằng các giá trị thực được gọi là nội suy chuỗi .
Thay thế Biểu thức
Các ký tự mẫu cho phép các biểu thức trong chuỗi:
Thí dụ
let price = 10;
let VAT = 0.25;
let total = `Total: ${(price * (1 + VAT)).toFixed(2)}`;
Việc thay thế tự động các biểu thức bằng các giá trị thực được gọi là nội suy chuỗi .
Mẫu HTML
Thí dụ
let header = "Templates Literals";
let tags = ["template literals", "javascript", "es6"];
let html = `<h2>${header}</h2><ul>`;
for (const x of tags) {
html += `<li>${x}</li>`;
}
html += `</ul>`;
Hỗ trợ trình duyệt
Template Literalslà một tính năng của ES6 (JavaScript 2015).
Nó được hỗ trợ trong tất cả các trình duyệt hiện đại:
| Chrome | Edge | Firefox | Safari | Opera |
| Yes | Yes | Yes | Yes | Yes |
Template Literalskhông được hỗ trợ trong Internet Explorer.
Tham chiếu chuỗi hoàn chỉnh
Để tham khảo chuỗi đầy đủ, hãy truy cập:
Tham chiếu chuỗi JavaScript hoàn chỉnh .
Tham chiếu chứa các mô tả và ví dụ về tất cả các thuộc tính và phương thức của chuỗi.