Chuỗi là một loại kiểu dữ liệu quan trọng và thông dụng trong thực tế. Khi chúng ta cần lưu trữ các thông tin vào trong cơ sở dữ liệu thì hơn 90% các thông tin, dữ liệu này sẽ được lưu trữ dưới dạng text. Chính vì vậy bạn cần phải tìm hiểu thật kỹ về các thao tác cũng như những hàm xử lý chuỗi đang có sẵn trong js.

Trong các ví dụ ở các bài trước chúng ta đã thực hiện khá nhiều ví dụ có sử dụng chuỗi nhưng chúng ta chưa thực sự tìm hiểu kỹ về nó nên trong bài này chúng ta sẽ cùng nhau tìm hiểu về khái niệm chuỗi, qua đó chúng ta sẽ biết được cách tạo và nối chuỗi cũng sử dụng các hàm có sẵn trong Javascript để xử lý chuỗi

Chuỗi string trong Javascript là gì?

Chuỗi là một đoạn text có thể có một hoặc nhiều ký tự và thông thường chúng ta sẽ lưu trữ nó vào một biến, biến này ta sẽ gọi là biến có kiểu dữ liệu là String (chuỗi). Tất cả các chuỗi đều phải được bao quanh bằng cặp dấu nháy đơn ' hoặc nháy kép "

Ví dụ: Khai báo biến và gán chuỗi string JS

var website = "kynangso.edu.vn là website học kỹ năng số cho người mới bắt đầu";
var email = 'tuyensinh@kynangso.edu.vn';<br>

Trường hợp trong chuỗi cũng có xuất hiện dấu nháy đơn hoặc nháy đôi thì bắt buộc bạn phải thêm ký tự \ đằng trước dấu nháy đó, nếu không sẽ bị lỗi về cũ pháp.

Đọc thêm:   Hướng dẫn học lập trình Javascript

Ví dụ: Trong chuỗi string có dấu nháy

var message = "Kynangso.edu.vn\"là website học kỹ năng số\" cho người mới bắt đầu";
var domain = 'kynangso.edu.vn - Kỹ năng số cho người mời bắt đầu"

Ngoài ra còn nhiều ký hiệu kết hợp với dấu \ nữa như trong bảng dưới đây:

CodeKết quả
single quote
\”double quote
\\backslash
\nnew line
\rcarriage return
\ttab
\bbackspace
\fform feed

Cách nối chuỗi string trong Javascript

Để nối chuỗi string trong JS thì chúng ta sử dụng dấu + để gép hai chuỗi hoặc biến kiểu String Object lại với nhau.

Ví dụ: Ghép hai string lại rồi gán vào biến message.

var message = "Chào mừng bạn đến với "+ "Kynangso.edu.vn";

Hoặc:

var message1 = "Chào mừng bạn đến với";
var message2 = "kynangso.edu.vn";
// Nối hai chuỗi
var message = message1 + message2;

Xử lý string trên nhiều dòng trong Javascript

Khi bạn muốn Enter xuống hàng một chuỗi trong Javascript thì bắt buộc phải sử dụng dấu + để nối chuỗi, nếu không sẽ bị lỗi cú pháp.

Ví dụ: Dùng dấu + để nối chuỗi

// Cách viết Đúng
var message = "Chào mừng bạn đến với"
              + "kynangso.edu.vn";
 
// Cách viết Sai
var message = "Chào mừng bạn đến với
               kynangso.edu.vn";

Nếu bạn muốn viết gọn hơn thì sử dụng dấu \ để báo cho trình duyệt biết là có xuống dòng trong 1 chuỗi.

Ví dụ: Dùng ký tự \ để khai báo chuỗi trên nhiều dòng.

<html>
<body>
<h2>JavaScript Strings</h2>
<p>Sử dụng dấu gạch chéo ngược \ để ngắt chuỗi.</p>
<p id="demo"></p>
<script>
let text = "Chào mừng bạn \
đến với\
kynangso.edu.vn";
document.getElementById("demo").innerHTML = text; 
</script>
</body>
</html>

Hoặc bạn cũng có thể sử dụng dấu `nội dung chuỗi` để khai báo.

Đọc thêm:   Bài 1. Bắt đầu với ngôn ngữ lập trình Javascript

In các dấu nháy trong chuỗi

Vì chuỗi trong Javascript được viết trong cặp dấu nháy đơn hoặc nháy kép, nên khi chúng ta muốn in ra các dấu này rất có thể sẽ làm cho Javascript hiểu sai về cú pháp nếu chúng ta viết theo cách thông thường. Ví dụ bạn cần in ra “kynangso.edu.vn” trong 1 chuỗi theo cách dưới đây, Javascript sẽ hiểu sai cú pháp và không in được kết quả ra trình duyệt

let text = "Chào mừng bạn đến với "kynangso.edu.vn" - Địa chỉ học kỹ năng số cho người mới bắt đầu";

Giải pháp để tránh vấn đề này là sử dụng ký tự dấu gạch chéo ngược .

Ký tự dấu gạch chéo ngược ( \) sẽ biến các ký tự đặc biệt thành các ký tự chuỗi:

CodeKết quả in raMô tả
\’Single quote
\”Double quote
\\\Backslash

Hãy thử ví dụ sau:

<html>
<body>
<h2>JavaScript Strings</h2>
<p>Sử dụng dấu chéo ngược và nháy kép \" để chèn dấu nháy kép vào một chuỗi.</p>
<p id="demo"></p>
<script>
let text = "Chào mừng bạn đến với \"Kynangso.edu.vn\" - Địa chỉ học kỹ năng số cho người mới bắt đầu.";
document.getElementById("demo").innerHTML = text; 
</script>
</body>
</html>

Chuỗi \\  chèn một dấu gạch chéo ngược trong một chuỗi:

<html>
<body>
<h2>JavaScript Strings</h2>
<p>Sử dụng \\ để chèn một dấu gạch chéo ngược vào chuỗi.</p>
<p id="demo"></p>
<script>
let text = "Ký tự \\ được gọi là dấu gạch chéo ngược.";
document.getElementById("demo").innerHTML = text; 
</script>
</body>
</html>

Ép chuỗi string trong javascript

Nếu bạn muốn ép một giá trị nào đó sang kiểu chuỗi thì có thể sử dụng cú pháp string.toString().

// Trước khi chuyển đổi
var number = 12;
alert(typeof number);
 
// Sau khi chuyển đổi
number = number.toString();
alert(typeof number);

Từ khóa typeof vars sẽ trả về kiểu dữ liệu của biến vars.

Ngoài cách trên bạn có thể sử dụng đối tượng String để tạo hoặc ép chuỗi, và vì là đối tượng nên nó phải có từ khóa new đặt đằng trước.

Đọc thêm:   Bài 10. Sự kiện trong Javascript

Ví dụ: Sử dụng String object hoặc String function.

// String object            
var message = new String("chào mừng bạn đến với kynangso.edu.vn");
 
// String function
var message = String("chào mừng bạn đến với kynangso.edu.vn");

Lúc này dù bạn truyền vào là kiểu gì đi nữa thì kết quả nó vẫn trả về kiểu string. Tuy nhiên người ta không khuyến khích bạn sử dụng cách này bởi vì chương trình sẽ chạy chậm hơn.

5. Một số hàm xử lý string trong Javascript

Sau đây mình xin tổng hợp một số hàm / phương thức / thuộc tính dùng để xử lý chuỗi string trong JS.

Đếm số ký tự trong chuỗi

Để đếm tổng số ký tự trong chuỗi string thì ta sử dụng thuộc tính length.

var txt = "kynangso.edu.vn";
var sln = txt.length; // Kết quả in ra 15

Tìm kiếm chuỗi trong chuỗi

Nếu muốn tìm kiếm một chuỗi bên trong một chuỗi khác thì dùng hàm indexOf.

  • Nếu tìm thấy thì nó sẽ trả về vị trí xuất hiện đầu tiên của chuỗi con.
  • Nếu không tìm thấy thì tra về -1.
<html>
<body>
<script>
var str = "Chào mừng bạn đề với kynangso.edu.vn!";
var pos = str.indexOf("bạn"); // Kết quả trả về = 10
document.write(pos);
</script>
</body>
</html>

Nếu muốn tìm vị trí xuất hiện cuối cùng của chuỗi con thì dùng hàm lastIndexOf.

<html>
<body>
<script>
var str = "Chào mừng bạn đề với kynangso.edu.vn! Website này sẽ giúp bạn học kỹ năng số";
var pos = str.lastIndexOf("bạn"); // Kết quả trả về = 10
document.write(pos);
</script>
</body>
</html>

Ngoài ra bạn cũng có thể sử dụng hàm search, nó có công dụng giống như hàm indexOf.

<html>
<body>
<script>
var str = "Chào mừng bạn đến với kynangso.edu.vn!";
var pos = str.search("bạn"); // Kết quả trả về = 10
document.write(pos);
</script>
</body>
</html>

Tổng kết: Như vậy là chúng ta đã học xong cách xử lý chuỗi string trong Javascript, qua bày này hy vọng bạn hiểu cú pháp / cách tạo chuỗi / các thao tác thường dùng để xử lý chuỗi. Chúc bạn thành công!