Tôi không có tài năng gì cả. Tôi chỉ đam mê hiểu biết
Các Phương Thức String Javascript

Các Phương Thức String Javascript


Ngày 2 Tháng 2 Năm 2021

Hôm nay bạn hãy cùng mình đi vào tìm hiểu cách sử dụng các phương thức đối với chuỗi trong ngôn ngữ lập trình Javascript để phát triển web nhé.

Phương Thức concat() String Javascript

Phương thức concat() được sử dụng để trả về một chuỗi mới được ghép từ danh sách các chuỗi lại với nhau. Để hiểu rõ hơn bạn xem cú pháp nó nhé:

 (Chuỗi).concat(chuỗi 1, chuỗi 2, chuỗi 3... chuỗi n);

Ở đây bạn có thể ghép bao nhiêu chuỗi tùy ý nha. Bây giờ để hiểu rõ hơn bạn xem ví dụ sau đây nhé:

 let chuoi1 = 'Xin Chào';
let chuoi2 = chuoi1.concat(' Các Bạn');

console.log(chuoi2);

Bạn xem kết quả bên dưới nhé:

Sử dụng phương thức concat trong chuỗi js

Ở đây mình có lưu ý nhỏ là:

  • Đầu tiên chúng ta tạo một biến chuoi1 chứa giá trị chuỗi Xin Chào.
  • Tiếp theo ta sẽ tạo một biến chuoi2 dùng để lưu giá trị chuỗi mới trả về khi nối hai chuỗi 'Xin Chào'' Các Bạn' lại với nhau bằng phương thức concat().
  • Bạn có thể hiểu nôm na cách nó nối chuỗi sẽ y như ta sử dụng toán tử cộng: chuoi2 = chuoi1 + ' Các Bạn'.
  • Cuối cùng chúng ta có kết quả là 'Xin Chào Các Bạn' in ra màn hình.

Người ta khuyên chúng ta nên sử dụng toán tử + hay += để nối chuỗi ví nó sẽ giúp cải thiện hiệu suất hơn.

Đối với các tham số truyền vào trong phương thức concat() mà đang là kiểu dữ liệu khác chuỗi ví dụ như số, boolean... thì nó sẽ tự động chuyển sang kiểu chuỗi và nối lại với nhau. Để hiểu rõ hơn bạn xem đoạn code sau nhé:

 let boolean = false;
let number = 5;
let chuoi = "Chuyển đổi sang kiểu chuỗi: ";
let ketQua = chuoi.concat(boolean, number);

console.log(ketQua);
console.log(typeof ketQua);

Bạn xem kết quả bên dưới nhé:

Chuyển đối kiểu dữ liệu sang chuỗi JS bằng concat()

Nếu bạn không có biến nào lưu trữ giá trị chuỗi để thực hiện phương thức concat() thì ta có thể thay thế bằng dấu '' hoặc "". Để hiểu rõ hơn bạn xem ví dụ sau đây nhé:

 let chuoi = ''.concat(4,5,6);
console.log(chuoi);
console.log(typeof chuoi)

Bạn xem kết quả bên dưới nhé:

Sử dụng concat() với chuỗi trong javascript

Phương Thức toUpperCase() Và toLowerCase() String Javascript

Trong thực tế nhiều khi bạn muốn so sánh các chuỗi với nhau thì nên chuyển nó về trạng thái chung là chuỗi in hoa hoặc in thường. Trong Javascript cung cấp cho chúng ta hai phương thức là toLowerCase() để chuyển sang in thường và toUpperCase() để chuyển sang in hoa. Bây giờ để hiểu rõ hơn bạn xem đoạn code sau nhé:

 let chuoi = "Xin Chào Các Bạn";
let chuoiInHoa = chuoi.toUpperCase();
let chuoiInThuong = chuoi.toLowerCase();

console.log(chuoiInHoa);
console.log(chuoiInThuong);

Bạn xem kết quả bên dưới nhé:

Sử dụng toLowerCase() và toUpperCase() với chuỗi trong javascript

Phương Thức indexOf() String Javascript

Phương thức indexOf() giúp chúng ta trả về vị trí chỉ mục của chuỗi con xuất hiện đầu tiên trong chuỗi.

Bây giờ chúng ta sẽ đi vào cú pháp để hiểu rõ hơn nhé:

 let viTriChiMuc = (Chuỗi).indexOf(chuỗi con, Vị trí bắt đầu tìm kiếm);

Ở đây mình có một số lưu ý nhỏ là:

  • Phương thức indexOf() sẽ trả về giá trị -1 nếu như chuỗi chính không chứa chuỗi con.
  • Vị trí bắt đầu tìm kiếm có nghĩa là một tham số để bạn xác định phương thức indexOf() sẽ bắt đầu tìm kiếm từ vị trí chỉ mục nào trong chuỗi. Nếu bạn không sử dụng tham số này thì nó sẽ mặc định vị trí chỉ mục là 0, nghĩa là nó sẽ bắt đầu tìm kiếm từ ký tự đầu tiên của chuỗi.
  • Phương thức indexOf() sẽ phân biệt các ký tự chữ thường với chữ in hoa nhé. Ví dụ như tenTen sẽ là hai chuỗi con khác nhau.

Khi đã nắm sơ lược thì chúng ta sẽ đi vào ví dụ cụ thể là tìm vị trí của từ S đầu tiên trong chuỗi JAVASCRIPT. Ở bên dưới mình có minh họa để bạn có thể hiểu rõ hơn:

Ví dụ minh họa indexOf trong javascript

Như bạn thấy vị trí chỉ mục sẽ bắt đầu từ số 0 còn vị trí sẽ bắt đầu bằng số 1 nhé.

Bây giờ chúng ta sẽ đi vào đoạn code sử dụng phương thức indexOf() để tìm chữ S nhé:

 let chuoi = "JAVASCRIPT";
console.log(chuoi.indexOf('S'));
console.log(chuoi.indexOf('s'));

Bạn xem kết quả bên dưới nhé:

Sử dụng indexOf() với chuỗi trong javascript

Như ví dụ trên thì ta có được vị trí chỉ mục của từ S là 4 (Bạn nhớ là vị trí chỉ mục bắt đầu từ số 0 nhé). Còn trả về giá trị -1 thì nó không tồn tại trong chuỗi, do chữ sS sẽ khác nhau trong phương thức indexOf().

Vậy có cách nào giúp ta tìm được vị trí chỉ mục của chuỗi con mà không cần phân biệt in hoa và in thường không?
Chúng ta có thể sử dụng phương thức đã học là toLowerCase() hoặc toUpperCase() để đưa chuỗi con và chuỗi chính về trạng thái chung rồi sau đó ta mới bắt đầu sử dụng phương thức indexOf(). Để hiểu rõ hơn bạn xem đoạn code sau nhé:

 let chuoi = ("JAVASCRIPT").toLowerCase();
let chuoiCon = ("s").toLowerCase();

console.log(chuoi.indexOf(chuoiCon));

Bạn xem kết quả bên dưới nhé:

Sử dụng indexOf() và toLowerCase() với chuỗi trong javascript

Bây giờ chúng ta sẽ đi vào ví dụ tìm kiếm ký tự trong chuỗi bằng cách sử dụng tham số Vị trí bắt đầu tìm kiếm. Để hiểu rõ hơn bạn xem ví dụ sau nhé:

 let chuoi = 'JAVASCRIPT';
let chuoiCon = chuoi.indexOf('A', 2);

console.log(chuoiCon);

Bạn xem kết quả bên dưới nhé:

Sử dụng indexOf() với tham số trong chuỗi javascript

Mình có một số lưu ý nhỏ trong đoạn code trên là:

  • Đầu tiên chúng ta sẽ gọi một biến chuoi lưu giá trị chuỗi là "JAVASCRIPT".
  • Tiếp theo ta sẽ sử dụng phương thức indexOf() để tìm chuỗi con.
  • ký tự ta muốn tìm là 'A' trong chuỗi và phương thức sẽ tìm kiếm từ vị trí chỉ mục thứ hai tức là bắt đầu từ chữ V.
  • Như vậy bạn thấy nó sẽ xuất hiện vị trí chỉ mục của chuỗi con là số 3.

Phần này chúng ta sẽ đi vào sử dụng với việc tìm kiếm vị trí của chuỗi con chứa nhiều ký tự bằng phương thức indexOf() trong ví dụ dưới đây nhé:

 let chuoi = "Vì mình thích javascript nên mình chia sẻ các kiến thức liên quan đến javascript!";
chuoiCon = chuoi.indexOf("javascript");

console.log(chuoiCon);

Bạn xem kết quả bên dưới nhé:

Sử dụng indexOf() với nhiều ký tự trong chuỗi javascript

Qua ví dụ ta thấy được là phương thức indexOf() sẽ trả về vị trí của chuỗi con xuất hiện đầu tiên trong chuỗi. Vậy có cách nào để tìm được vị trí xuất hiện cuối cùng của chuỗi con trong chuỗi không?

Trong Javascript có cung cấp cho chúng ta một phương thức là lastIndexOf() giúp ta tìm được vị trí xuất hiện cuối cùng của chuỗi con trong chuỗi. Bây giờ cùng là ví dụ trên nhưng chúng ta thử tìm vị trí cuối cùng của chuỗi con "javascript" trong biến chuoi để xem nó hoạt động sao nhé:

 let chuoi = "Vì mình thích javascript nên mình chia sẻ các kiến thức liên quan đến javascript!";
chuoiCon = chuoi.lastIndexOf("javascript");

console.log(chuoiCon);

Bạn xem kết quả bên dưới nhé:

Sử dụng lastIndexOf() với nhiều ký tự trong chuỗi javascript

Bạn có thể sử dụng vòng lặp để xuất ra tất cả các vị trí chỉ mục xuất hiện của chuỗi con hay đếm có bao nhiêu chuỗi con ở trong chuỗi... Bây giờ mình sẽ sử dụng vòng lặp với ví dụ trên và xuất ra tất cả các vị trí chỉ mục của chuỗi con xuất hiện ở trong chuỗi.

  let chuoi = 'Vì mình thích javascript nên mình chia sẻ các kiến thức liên quan đến javascript!';
 let chuoiCon = 'javascript';
 let viTriChiMuc = chuoi.indexOf(chuoiCon);

 while(viTriChiMuc !== -1) {
    console.log('Vị trí xuất hiện chuỗi con là ' + viTriChiMuc);
    viTriChiMuc = chuoi.indexOf(chuoiCon , viTriChiMuc + 1);
 }

Bạn xem kết quả bên dưới nhé:

Sử dụng vòng lặp và IndexOf() với nhiều ký tự trong chuỗi javascript

Ở đây mình có một số lưu ý sau là:

  • Đầu tiên chúng ta sẽ lấy vị trí xuất hiện đầu tiên của chuỗi con trong chuỗi bằng chuoi.indexOf(chuoiCon).
  • Biểu thức viTriChiMuc !== -1 giúp chúng ta kiểm tra chuỗi con có xuất hiện trong chuỗi hay không?
  • Khi đã kiểm tra xong thì xuất ra màn hình và tiếp theo chúng ta sẽ tăng vị trí chỉ mục lên 1 đơn vị.
  • Ở đây có nghĩa là vị trí chỉ mục xuất hiện đầu tiên của chuỗi con "javascript" là 14.
    Để tìm chuỗi con "javascript" tiếp theo trong chuỗi thì chúng ta sẽ tăng biến vị trí chỉ mục lên 1 tức là 15.
    Lúc này ta sẽ có chuoi.indexOf(chuoiCon , 15) nghĩa là nó sẽ bắt đầu tìm kiếm từ vị trí chỉ mục 15 trong chuỗi.
  • Vòng lặp cứ như vậy đến khi không còn thỏa mãn biểu thức viTriChiMuc !== -1 thì sẽ dừng lại.

Tổng kết:

Qua đây mình mong bài viết sẽ giúp bạn hiểu được cách sử dụng các phương thức đối với chuỗi trong ngôn ngữ Javascript và nếu có thắc mắc gì cứ gửi email mình sẽ phản hồi sớm nhất có thể. Rất mong bạn tiếp tục ủng hộ trang web để mình có thể viết nhiều bài hay hơn nữa nhé. Chúc bạn có một ngày vui vẻ!

Load WooCommerce Stores in 249ms!