Chủ đề nổi bật
03/08/2018, 09:59

Các hàm xử lý chuỗi trong Javascript

Bài trước chúng ta đã tìm hiểu về chuỗi trong javascript nhưng đó chỉ là những thao tác đơn giản như khởi tạo, gán giá trị và thực hiện toán tử ...

Bài trước chúng ta đã tìm hiểu về chuỗi trong javascript nhưng đó chỉ là những thao tác đơn giản như khởi tạo, gán giá trị và thực hiện toán tử nối chuỗi, vậy trong bài này mình sẽ giới thiệu những hàm xử lý chuỗi trong Javascript thường sử dụng nhất để các bạn sử dụng trong quá trình làm việc. Nói là hàm nhưng thực chất đó là những phương thức vì tất cả những hàm đó đều phải sử dụng thông qua đối tượng String và chi tiết thế nào thì chúng ta cùng tìm hiểu nhé.

1. Các hàm xử lý chuỗi trong Javascript

Mình không thể liệt kê hết các hàm được mà chỉ đưa ra những hàm hay sử dụng nhất để bài viết được ngắn gọn hơn.

Tìm kiếm chuỗi con

Chúng ta có ba hàm thường dùng để tìm kiếm chuỗi con trong Javascript như sau:

  • indexOf()
  • lastIndexOf()
  • search()

Hàm indexOf()

Để tìm kiếm chuỗi con thì ta sử dụng hàm String.indexOf(str), trong đó str là chuỗi con và String là chuỗi cha. Hàm này sẽ trả kết quả về kết quả là vị trí xuât hiện đầu tiên của chuỗi (bắt đầu là vị trí 0), nếu không tìm thấy chuỗi con thì nó sẽ trả về -1.

Ví dụ: XEM DEMO

var string = "Chào mừng bạn đến với code24h.com";
document.write("Vị trí xuất hiện chuỗi code24h.com là: " + string.indexOf("code24h.com"));<br>

Hàm lastIndexOf()

Trường hợp nếu chuỗi con xuất hiện nhiều lần trong chuỗi cha thì kết quả cũng trả về vị trí xuất hiện của chuỗi con đầu tiên. Vậy làm thế nào để lấy vị trí của chuỗi con cuối cùng trong chuỗi cha? Ta sẽ sử dụng hàm String.lastIndexOf(str), hàm này sẽ trả về vị trí xuất hiện của chuỗi con cuối cùng và trả về -1 nếu không tìm thấy.

Ví dụ: XEM DEMO

var string = "Website code24h.com - học lập trình miễn phí tại code24h.com";
document.write("Vị trí xuất hiện chuỗi code24h.com là: " + string.lastIndexOf("code24h.com"));

Hàm search()

Ngoài hai hàm trên bạn có thể sử dụng hàm string.search(str) để tìm kiếm, tác dụng của nó cũng giống như hàm string.indexOf(str).

Ví dụ: XEM DEMO

var string = "Chào mừng bạn đến với code24h.com";
document.write("Vị trí xuất hiện chuỗi code24h.com là: " + string.search("code24h.com"));<br>

Cắt chuỗi con

Nếu ban muốn cắt một chuỗi con từ chuỗi cha thì bạn có thể sử dụng ba hàm sau:

  • slice(start, end)
  • substring(start, end)
  • substr(start, length)

Note: tất cả các vị trí của chuỗi đều bắt đầu từ 0, vì vậy khi tính toán vị trí coi chừng bị nhầm lẫn nhé.

Hàm slice()

Hàm slide có hai tham số truyền vào:

  • start: vị trí bắt đầu
  • end: vị trí kết thúc

Ví dụ: XEM DEMO

var string = "Welcome to code24h.com";
document.write("Chuỗi cần lấy là: " + string.slice(11, 23));<br>

Nếu tham số truyền vào là số âm thì nó sẽ tính ngược lại, nghĩa là nó sẽ đếm từ cuối lên.

Ví dụ: XEM DEMO

var string = "Welcome to code24h.com";
document.write("Chuỗi cần lấy là: " + string.slice(-12, 23));

Nếu bạn chỉ truyền một tham số đầu tiên thì nó sẽ tự hiểu vị trí end là vị trí cuối cùng.

Ví dụ: XEM DEMO

var string = "Welcome to code24h.com";
document.write("Chuỗi cần lấy là: " + string.slice(5));

Hàm substring()

Hàm substring() có cách sử dụng giống với hàm slice(), tuy nhiên tham số truyền vào hàm substring() phải luôn luôn lớn hơn 0.

Ví dụ: XEM DEMO

var string = "Welcome to code24h.com";
document.write("Chuỗi cần lấy là: " + string.substring(11, 23));

Hàm substr()

Hàm substr() có hai tham số là start và length, trong đó start là vị trí bắt đầu và length là số ký tự muốn lấy bắt đầu từ vị trí start. Nếu bạn truyền tham số start là số âm thì nó sẽ tính từ cuối trở lên, còn tham số length phải luôn luôn là số dương.

Ví dụ: XEM DEMO

var string = "Welcome to code24h.com";
document.write("Chuỗi cần lấy là: " + string.substr(11, 12));

Tìm kiếm và lặp chuỗi

Để tìm kiếm và lặp một chuỗi con nào đó thì bạn sử dụng hàm replace(str_find, str_replace), trong đó str_find là chuỗi cần tìm và str_replace là chuỗi sẽ được thay thế chuỗi str_find.

Ví dụ: XEM DEMO

var string = "Welcome to code24h.com";
document.write(string.replace("code24h.com", "code24h.com"));

Chuyển thành chữ hoa và chữ thường

Để chuyển chuỗi thành chữ hoa ta dùng hàm toUpperCase() và chuyển thành chữ thường ta dùng hàm toLowerCase().

Ví dụ: XEM DEMO

var string = "Welcome to code24h.com";
document.write(string.toUpperCase() + "<br/>");
document.write(string.toLowerCase());

Nối thêm chuỗi

Để nối thêm chuỗi thông thường ta dùng toán tử +, ngoài ra bạn có thể dùng hàm concat() để thực hiện nối chuỗi.

Ví dụ: XEM DEMO

var string = "Welcome " + "to" + " code24h.com";
document.write(string + "<br/>");

// hoặc
var string = "Welcome ";
string = string.concat("to ", "code24h.com");
document.write(string + "<br/>");

Tìm ký tự hoặc mã ASCII của một ký tự

Để xem ký tự của một vị trí nào đó thì dùng hàm charAt(), còn xem mã ASCII thì dùng hàm charCodeAt(). Cả hai hàm này đều có tham số truyền vào là vị trí muốn xem.

Ví dụ: XEM DEMO

var string = "Welcome code24h.com";

document.write(string.charAt(1) + "<br/>");
document.write(string.charCodeAt(1) + "<br/>");

Chuyển đổi chuỗi sang mảng

Để chuyển một chuỗi sang mảng thì ta sử dụng hàm split() với tham số truyền vào là ký tự ngăn cách giữa các phần tử.

Ví dụ: XEM DEMO

string = "Welcome code24h.com";

// Tạo thành mảng với mỗi phần tử ngăn bởi khoảng trắng
// kết quả là mảng có hai phần tử gồm: welcome và feetuts.net
document.write(string.split(" ").length);

2. Lời kết

Trên là các hàm xử lý chuỗi thông dụng mà bạn nên biết để sử dụng khi cần thiết, các hàm này đang ở mức căn bản vì vẫn chưa đáp ứng được các yêu cầu xử lý phức tạp hơn, vấn đề này mình sẽ đề cập sau khi chúng ta tìm hiểu về Regex trong Javascript.

Nếu bạn cần thêm bài tập để thực hành thì có thể theo dõi ở serie bài tập Javascript, nơi này là tổng hợp các bài tập Javascript từ căn bản đến nâng cao.

BÀI KẾ SAU
BÀI KẾ TIẾP

Nguồn: code24h.com

Bài liên quan
Mới nhất

Image Map trong JavaScript

Bạn có thể sử dụng JavaScript để tạo Image map ở Client-Side. Các Image map được kích hoạt bởi thuộc tính usemap cho thẻ <img /> và được định nghĩa bởi các thẻ mở rộng đặc biệt <map> và <area>. Hình ảnh mà tạo bản đồ đó được chèn vào trong trang bởi sử dụng phần tử ...

Tài liệu tham khảo & Framework cho Javascript

Dưới đây chúng tôi liệt kê tất cả các nguồn tài liệu hữu ích và Framework cho JavaScript. Bạn nên sử dụng chúng để thực hành cũng như hiểu sâu hơn những chủ đề đã được đề cập trong loạt bài này. Các JavaScript Framework hàng đầu: Follow fanpage của ...

Xử lý lỗi trong JavaScript

Có 3 kiểu lỗi trong chương trình: (a) lỗi cú pháp (Syntax Error), (b) lỗi trong khi chạy chương trình (Runtime Error), và (c) lỗi về tính logic của cấu trúc chương trình (Logical Error). Syntax Error Lỗi cú pháp (Syntax Error), cũng được gọi là parsing error, xảy ra tại thời gian biên dịch ...

Đa phương tiện (Multimedia) trong JavaScript

Đối tượng navigator trong JavaScript bao gồm một đối tượng con gọi là plugins . Đối tượng này là một mảng, với một cổng vào (entry) cho mỗi plug-in được cài đặt trên trình duyệt. Đối tượng navigator.plugins chỉ được hỗ trợ bởi Netscape, Firefox và Mozilla. Ví dụ Dưới đây là ví dụ minh ...

Các hàm có sẵn trong JavaScript

Đối tượng Number chỉ chứa các phương thức mặc định mà là một phần của sự định nghĩa của mỗi đối tượng. Phương thức Miêu tả constructor() Trả về hàm mà tạo sự instance của đối tượng này. Theo mặc định, nó là đối tượng Number. toExponential() Làm một số hiển thị ở dạng số mũ, ...

Debug trong JavaScript

Trong khi mã hóa chương trình, các nhà lập trình có thể tạo ra các lỗi. Một lỗi trong một chương trình hoặc một script được xem như là một bug . Tiến trình tìm kiếm và sửa các bug được gọi là dubugging và là một phần bình thường của tiến trình lập trình. Chương này giới thiệu một số công ...

Document Object Model (DOM) trong JavaScript

Mỗi trang web cư ngụ bên trong một cửa sổ trình duyệt mà có thể xem như là một đối tượng. Một đối tượng Document biểu diễn tài liệu HTML được hiển thị trong cửa sổ đó. Đối tượng Document có nhiều thuộc tính đa dạng như các đối tượng khác mà cho phép truy cập và chỉnh sửa nội dung tài liệu. ...

Đối tượng Boolean trong JavaScript

Miêu tả Đối tượng Boolean biểu diễn hai giá trị, hoặc "true" hoặc "false". Nếu tham số value bị bỏ qua hoặc là 0, -0, null, false, NaN , undefined, hoặc một chuỗi trống (""), đối tượng có một giá trị khởi tạo là false. Cú pháp Sử dụng cú pháp sau để tạo một đối tượng Boolean . ...

Đối tượng String trong JavaScript

Đối tượng String giúp bạn làm việc với một dãy các ký tự; nó giúp xử lý các kiểu dữ liệu chuỗi gốc trong JavaScript với một số phương thức giúp đỡ. Khi JavaScript tự động biến đổi giữa chuỗi gốc và các đối tượng String, bạn có thể gọi bất kỳ phương thức giúp đỡ nào của đối tượng String ...

Điều hướng trang (Redirect) trong JavaScript

Điều hướng lại trang là gì? Bạn có thể gặp tình huống khi bạn click vào một URL để tới trang X nhưng bạn được điều hướng tới trang Y. Nó xảy ra là do Page Redirection – Điều hướng lại trang . Khái niệm này khác với: JavaScript – Refresh trang. Có nhiều lý do khác nhau để tại sao bạn muốn ...