Hình ảnh: Xuất chuỗi trong JavaScript
Giới thiệu
Trong JavaScript, chuỗi là một chuỗi bao gồm một hoặc nhiều ký tự có thể bao gồm chữ cái, số hoặc ký hiệu. Chuỗi trong JavaScript là kiểu dữ liệu nguyên thủy và không thể thay đổi, có nghĩa là chúng không thay đổi.
Vì chuỗi là cách chúng ta hiển thị và làm việc với văn bản, và văn bản là cách chúng ta chủ yếu giao tiếp và hiểu thông qua máy tính, chuỗi là một trong những khái niệm cơ bản nhất của lập trình mà chúng ta nên quen thuộc.
Trong bài viết này, chúng ta sẽ tìm hiểu cách tạo và xem kết quả của chuỗi, cách ghép nối chuỗi, cách lưu trữ chuỗi trong biến và quy tắc sử dụng dấu ngoặc kép, dấu nháy đơn và xuống dòng trong chuỗi trong JavaScript.
Tạo và Xem kết quả của Chuỗi
Trong JavaScript, có ba cách để viết một chuỗi - có thể được viết bên trong dấu nháy đơn (' '), dấu nháy kép (" ") hoặc dấu nháy lùn (` `). Loại dấu nháy sử dụng phải khớp với cả hai phía, tuy nhiên có thể sử dụng tất cả ba kiểu trong cùng một đoạn mã.
Chuỗi sử dụng dấu nháy kép và dấu nháy đơn hiệu quả là như nhau. Vì không có quy ước hoặc sự ưu tiên chính thức cho chuỗi sử dụng dấu nháy đơn hay dấu nháy kép, quan trọng là duy trì sự nhất quán trong các tệp chương trình dự án.
'This string uses single quotes.'; "This string uses double quotes.";Cách tạo chuỗi thứ ba và mới nhất được gọi là template literal. Template literals sử dụng dấu nháy lùn (còn được gọi là dấu huyền) và hoạt động giống như chuỗi thông thường nhưng có một số lợi ích bổ sung, chúng ta sẽ tìm hiểu trong bài viết này.
`This string uses backticks.`;Cách đơn giản nhất để xem kết quả của một chuỗi là in nó ra console, sử dụng console.log():
console.log("This is a string in the console.");Một cách đơn giản khác để xuất giá trị là hiển thị một cửa sổ cảnh báo trên trình duyệt với alert():
alert("This is a string in an alert.");Chạy dòng mã trên sẽ tạo ra kết quả sau trên giao diện người dùng của trình duyệt:
alert() là một phương pháp kiểm tra và xem kết quả ít phổ biến hơn, vì nó có thể trở nên nhàm chán khi phải đóng các cửa sổ cảnh báo liên tiếp.
Lưu trữ một Chuỗi trong Biến
Biến trong JavaScript là các đối tượng được đặt tên để lưu trữ một giá trị, sử dụng các từ khóa var, const hoặc let. Chúng ta có thể gán giá trị của một chuỗi cho một biến đã đặt tên.
const newString = "This is a string assigned to a variable.";Bây giờ mà biến newString chứa chuỗi của chúng ta, chúng ta có thể tham chiếu đến nó và in ra console.
console.log(newString);Điều này sẽ xuất giá trị chuỗi.
Ghép nối Chuỗi
Ghép nối có nghĩa là kết hợp hai hoặc nhiều chuỗi để tạo ra một chuỗi mới. Để ghép nối, chúng ta sử dụng toán tử ghép nối, biểu thị bằng ký hiệu +. Ký hiệu + cũng là toán tử cộng khi được sử dụng với các phép toán số học.
Hãy tạo một ví dụ đơn giản về ghép nối giữa "Sea" và "horse".
"Sea" + "horse";Ghép nối sẽ kết hợp hai chuỗi và xuất kết quả là một chuỗi mới. Nếu chúng ta muốn có một khoảng trống giữa các từ Sea và horse, chúng ta cần bao gồm một ký tự khoảng trắng trong một trong các chuỗi:
"Sea " + "horse";Chúng ta kết hợp các chuỗi và biến chứa giá trị chuỗi bằng cách ghép nối.
const poem = "The Wide Ocean"; const author = "Pablo Neruda"; const favePoem = "My favorite poem is " + poem + " by " + author + ".";Khi chúng ta kết hợp hai hoặc nhiều chuỗi thông qua việc ghép nối, chúng ta đang tạo ra một chuỗi mới mà chúng ta có thể sử dụng trong toàn bộ chương trình của chúng ta.
Biến trong Chuỗi với Template Literals
Một tính năng đặc biệt của template literal là khả năng chèn biểu thức và biến vào trong một chuỗi. Thay vì phải sử dụng ghép nối, chúng ta có thể sử dụng cú pháp ${} để chèn một biến.
const poem = "The Wide Ocean"; const author = "Pablo Neruda"; const favePoem = `My favorite poem is ${poem} by ${author}.`;Như chúng ta có thể thấy, việc chèn biểu thức vào template literal là một cách khác để đạt được cùng kết quả. Trong trường hợp này, việc sử dụng template literals có thể dễ viết hơn và thuận tiện hơn.
Chuỗi Biểu tượng và Giá trị Chuỗi
Bạn có thể nhận thấy rằng các chuỗi chúng ta viết trong mã nguồn được bao bọc bằng dấu ngoặc, nhưng kết quả in ra thực tế không bao gồm bất kỳ dấu ngoặc nào.
"Beyond the Sea";Có một sự khác biệt khi đề cập đến mỗi chuỗi này. Chuỗi nguyên thủy là chuỗi như nó được viết trong mã nguồn, bao gồm dấu ngoặc. Giá trị chuỗi là những gì chúng ta thấy trong kết quả, và không bao gồm dấu ngoặc.
Trong ví dụ trên, "Beyond the Sea" là chuỗi nguyên thủy và Beyond the Sea là giá trị chuỗi.
Tránh dấu ngoặc kép và dấu nháy đơn trong Chuỗi
Do việc sử dụng dấu ngoặc kép để chỉ ra chuỗi, phải có những quy định đặc biệt khi sử dụng dấu nháy đơn và dấu ngoặc kép trong chuỗi. Thử sử dụng dấu nháy đơn trong một chuỗi được đặt trong dấu nháy đơn, ví dụ như I'm, sẽ kết thúc chuỗi và JavaScript sẽ cố gắng phân tích cú pháp phần còn lại của chuỗi như mã.
Chúng ta có thể thấy điều này thông qua việc sử dụng dấu nháy đơn trong việc viết tắt I'm sau đây:
const brokenString = 'I'm a broken string'; console.log(brokenString); Điều tương tự cũng xảy ra khi cố gắng sử dụng dấu nháy kép trong một chuỗi được đặt trong dấu nháy kép.
Để tránh việc gây ra lỗi trong những tình huống như vậy, chúng ta có một số lựa chọn mà chúng ta có thể sử dụng:
- Cú pháp chuỗi đối lập
- Ký tự thoát
- Template literals
Chúng ta sẽ tìm hiểu các lựa chọn này dưới đây.
Sử dụng Cú pháp Chuỗi đối lập
Một cách dễ dàng để vượt qua các trường hợp đặc biệt của chuỗi có thể bị hỏng là sử dụng cú pháp chuỗi đối lập của chuỗi hiện tại.
Ví dụ, dấu nháy đơn trong chuỗi được xây dựng bằng dấu nháy kép.
"We're safely using an apostrophe in double quotes."Dấu ngoặc kép trong chuỗi được xây dựng bằng dấu nháy đơn.
'Then he said, "Hello, World!"';Theo cách kết hợp những dấu ngoặc kép và nháy đơn, chúng ta có thể kiểm soát việc hiển thị dấu ngoặc kép và dấu nháy đơn trong các chuỗi của chúng ta. Tuy nhiên, khi chúng ta làm việc để sử dụng cú pháp nhất quán trong các tệp chương trình dự án, điều này có thể khó duy trì trên toàn bộ codebase.
Sử dụng Ký tự thoát
Chúng ta có thể sử dụng ký tự thoát (\) để ngăn JavaScript hiểu một dấu ngoặc là kết thúc của chuỗi.
Cú pháp của ' luôn là dấu nháy đơn, và cú pháp của " luôn là dấu nháy kép, mà không có bất kỳ sự lo ngại nào về việc hỏng chuỗi.
Sử dụng phương pháp này, chúng ta có thể sử dụng dấu nháy đơn trong chuỗi được xây dựng bằng dấu nháy kép.
'We\'re safely using an apostrophe in single quotes.'Chúng ta cũng có thể sử dụng dấu nháy kép trong chuỗi được xây dựng bằng dấu nháy kép.
"Then he said, \"Hello, World!\"";Phương pháp này trông hơi lộn xộn hơn, nhưng có thể bạn cần sử dụng cả một dấu nháy đơn và một dấu nháy kép trong cùng một chuỗi, điều này làm cho việc thoát cần thiết.
Sử dụng Template Literals
Template literals được xác định bằng dấu nháy lùn, do đó và dấu nháy đơn và dấu ngoặc kép có thể được sử dụng an toàn mà không cần bất kỳ sự thoát hoặc xem xét bổ sung nào.
`We're safely using apostrophes and "quotes" in a template literal.`Ngoài việc ngăn chặn việc cần phải thoát ký tự và cho phép chèn các biểu thức, template literals cũng cung cấp hỗ trợ cho nhiều dòng, mà chúng ta sẽ thảo luận trong phần tiếp theo.
Với cách sử dụng chuỗi ký tự đối lập, ký tự thoát và template literals, có nhiều cách để an toàn tạo một chuỗi.
Chuỗi Dài và Dòng Mới
Có những lúc bạn có thể muốn chèn một ký tự xuống dòng hoặc xuống dòng trong chuỗi của bạn. Các ký tự n hoặc r escape có thể được sử dụng để chèn ký tự xuống dòng vào kết quả của mã.
const threeLines = "This is a string\nthat spans across\nthree lines.";Kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuậtày kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuậtày kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này
kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuậtầy kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật này kỹ thuật ày kỹ thuậtến
Rất quan trọng là nhận thức về tất cả các cách tạo ra các dòng mới và các chuỗi trải dài trên nhiều dòng, do các mã nguồn khác nhau có thể sử dụng các tiêu chuẩn khác nhau.
Kết luận
Trong bài viết này, chúng ta đã tìm hiểu cơ bản về làm việc với chuỗi trong JavaScript, từ việc tạo ra và hiển thị chuỗi nguyên thủy bằng cách sử dụng dấu nháy đơn và kép, tạo ra template literals, ghép nối, thoát và gán giá trị chuỗi vào biến.
