Xoá khoảng trắng trong chuỗi JavasSript (trim, trimStart, trimEnd) | Laptrinhcanban.com

Xoá khoảng trắng trong chuỗi JavasSript (trim, trimStart, trimEnd)

Hướng dẫn cách xoá khoảng trắng trong chuỗi JavasSript. Bạn sẽ học được cách xóa khoảng trắng thừa trong chuỗi JavaScript bằng các phương thức trim(), trimStart() và trimEnd() sau bài học này.

Xoá khoảng trắng ở đầu và cuối chuỗi JavaScript | phương thức trim()

trim() trong JavaScript là một phương thức của đối tượng String, có tác dụng xoá các khoảng trắng ở đầu và cuối chuỗi JavaScript và tạo ra chuỗi mới. Phép xoá này không làm thay đổi chuỗi ban đầu.

Phương thức trim() trong JavaScript

Chúng ta sử dụng phương thức trim() trong JavaScript với cú pháp sau đây:

str.trim()

Trong đó str là chuỗi ban đầu cần xoá các khoảng trắng ở đầu và cuối chuỗi JavaScript.

Kết quả của strim() sẽ là một chuỗi mới được tạo ra từ chuỗi cũ với các khoảng trắng ở đầu và cuối chuỗi đã được loại bỏ. Lưu ý là phương thức trim() chỉ loại bỏ khoảng trắng trong chuỗi JavasSript ở đầu và cuối chuỗi, chứ không xoá đi các khoảng trắng ở giữa chuỗi nhé.

Và khoảng trắng mà strim() có thể xoá ở đây bao gồm khoảng trắng bình thường (tạo bởi phím cách) lẫn các khoảng trắng tạo bởi dấu tab hoặc xuống dòng.

Sau đây hãy cùng xem các ví dụ cụ thể sử dụng phương thức trim() để xoá khoảng trắng ở đầu và cuối chuỗi JavaScript như sau:

Ví dụ 1: Xoá khoảng trắng ở đầu và cuối chuỗi JavaScript

let str = " LOVE YOU ";
console.log("'"+ str +"'");
console.log("'"+ str.trim() +"'");
//> ' LOVE YOU '
//> 'LOVE YOU'

Ví dụ 2: Xoá khoảng trắng liên tiếp ở đầu và cuối chuỗi JavaScript

let str = "      LOVE YOU  ";
console.log("'"+ str +"'");
console.log("'"+ str.trim() +"'");
//> ' LOVE YOU '
//> 'LOVE YOU'

Ví dụ 3: Xoá dấu tab ở đầu và cuối chuỗi JavaScript

let str = "\tLOVE YOU\t";
console.log("'"+ str +"'");
console.log("'"+ str.trim() +"'");
//> ' LOVE YOU '
//> 'LOVE YOU'

Ví dụ 4: Xoá dấu xuống dòng ở đầu và cuối chuỗi JavaScript

let str = "\nLOVE YOU\n";
console.log("'"+ str +"'");
console.log("kết quả:'"+ str.trim() +"'");

Kết quả:

'
LOVE YOU
'
kết quả:'LOVE YOU'

Từ các ví dụ trên, bạn có thể thấy các khoảng trắng ở đầu chuỗi và cuối chuỗi đã được xoá, trong khi khoảng trắng giữa chuỗi thì vẫn được giữ lại rồi phải không nào?

Lưu ý là phép xoá khoảng trắng trong JavaScript sử dụng phương thức trim() sẽ KHÔNG làm thay đổi chuỗi ban đầu mà lưu kết quả dưới dạng một chuỗi mới. Do đó hãy gán kết quả của phép xoá vào một biến để có thể sử dụng nhiều lần trong chương trình nhé.

let str = " LOVE YOU ";

console.log("'"+ str +"'");
//> ' LOVE YOU '

//Lưu kết quả phép xoá khoảng trắng vào biến để sử dụng nhiều lần
let newstr = str.trim();
console.log("'"+ newstr +"'");
//> 'LOVE YOU'

//Phép xoá khoảng trắng không làm thay đổi chuỗi ban đầu
console.log("'"+ str +"'");
//> ' LOVE YOU '

Xoá khoảng trắng đầu chuỗi JavaScript

trimStart() trong JavaScript là một phương thức của đối tượng String, có tác dụng xoá các khoảng trắng ở đầu chuỗi JavaScript và tạo ra chuỗi mới. Phép xoá này không làm thay đổi chuỗi ban đầu.

Phương thức trimStart() trong JavaScript

Chúng ta sử dụng phương thức trimStart() trong JavaScript với cú pháp sau đây:

str.trimStart()

Trong đó str là chuỗi ban đầu cần xoá các khoảng trắng ở đầu JavaScript.

Kết quả của trimStart() sẽ là một chuỗi mới được tạo ra từ chuỗi cũ với các khoảng trắng ở đầu chuỗi đã được loại bỏ. Lưu ý là phương thức trimStart() chỉ loại bỏ khoảng trắng trong chuỗi JavasSript ở đầu, chứ không xoá đi các khoảng trắng ở giữa và cuối chuỗi nhé.

Và khoảng trắng mà trimStart() có thể xoá ở đây bao gồm khoảng trắng bình thường (tạo bởi phím cách) lẫn các khoảng trắng tạo bởi dấu tab hoặc xuống dòng.

Sau đây hãy cùng xem các ví dụ cụ thể sử dụng phương thức trimStart() để xoá khoảng trắng ở đầu JavaScript như sau:

Ví dụ 1: Xoá khoảng trắng ở đầu chuỗi JavaScript

let str = " LOVE YOU ";
console.log("'"+ str +"'");
console.log("'"+ str.trimStart() +"'");
//> ' LOVE YOU '
//> 'LOVE YOU '

Ví dụ 2: Xoá khoảng trắng liên tiếp ở đầu chuỗi JavaScript

let str = "      LOVE YOU  ";
console.log("'"+ str +"'");
console.log("'"+ str.trimStart() +"'");
//> ' LOVE YOU '
//> 'LOVE YOU '

Ví dụ 3: Xoá dấu tab ở đầu chuỗi JavaScript

let str = "\tLOVE YOU\t";
console.log("'"+ str +"'");
console.log("'"+ str.trimStart() +"'");
//> ' LOVE YOU '
//> 'LOVE YOU '

Ví dụ 4: Xoá dấu xuống dòng ở đầu chuỗi JavaScript

let str = "\nLOVE YOU\n";
console.log("'"+ str +"'");
console.log("kết quả:'"+ str.trimStart() +"'");

Kết quả:

'
LOVE YOU
'
kết quả:'LOVE YOU
'

Từ các ví dụ trên, bạn có thể thấy chỉ có khoảng trắng ở đầu chuỗi được xoá thôi phải không nào?

Lưu ý là tương tự như phương thức trim() thì phép xoá khoảng trắng trong JavaScript sử dụng phương thức trimStart() cũng sẽ KHÔNG làm thay đổi chuỗi ban đầu mà lưu kết quả dưới dạng một chuỗi mới. Do đó hãy gán kết quả của phép xoá vào một biến để có thể sử dụng nhiều lần trong chương trình nhé.

Xoá khoảng trắng cuối chuỗi JavaScript

trimEnd() trong JavaScript là một phương thức của đối tượng String, có tác dụng xoá các khoảng trắng ở cuối chuỗi JavaScript và tạo ra chuỗi mới. Phép xoá này không làm thay đổi chuỗi ban cuối.

Phương thức trimEnd() trong JavaScript

Chúng ta sử dụng phương thức trimEnd() trong JavaScript với cú pháp sau đây:

str.trimEnd()

Trong đó str là chuỗi ban cuối cần xoá các khoảng trắng ở cuối JavaScript.

Kết quả của trimEnd() sẽ là một chuỗi mới được tạo ra từ chuỗi cũ với các khoảng trắng ở cuối chuỗi đã được loại bỏ. Lưu ý là phương thức trimEnd() chỉ loại bỏ khoảng trắng trong chuỗi JavasSript ở cuối, chứ không xoá đi các khoảng trắng ở đầu và giữa chuỗi nhé.

Và khoảng trắng mà trimEnd() có thể xoá ở đây bao gồm khoảng trắng bình thường (tạo bởi phím cách) lẫn các khoảng trắng tạo bởi dấu tab hoặc xuống dòng.

Sau đây hãy cùng xem các ví dụ cụ thể sử dụng phương thức trimEnd() để xoá khoảng trắng ở cuối JavaScript như sau:

Ví dụ 1: Xoá khoảng trắng ở cuối chuỗi JavaScript

let str = " LOVE YOU ";
console.log("'"+ str +"'");
console.log("'"+ str.trimEnd() +"'");
//> ' LOVE YOU '
//> ' LOVE YOU'

Ví dụ 2: Xoá khoảng trắng liên tiếp ở cuối chuỗi JavaScript

let str = "      LOVE YOU  ";
console.log("'"+ str +"'");
console.log("'"+ str.trimEnd() +"'");
//> ' LOVE YOU '
//> ' LOVE YOU'

Ví dụ 3: Xoá dấu tab ở cuối chuỗi JavaScript

let str = "\tLOVE YOU\t";
console.log("'"+ str +"'");
console.log("'"+ str.trimEnd() +"'");
//> ' LOVE YOU '
//> ' LOVE YOU'

Ví dụ 4: Xoá dấu xuống dòng ở cuối chuỗi JavaScript

let str = "\nLOVE YOU\n";
console.log("'"+ str +"'");
console.log("kết quả:'"+ str.trimEnd() +"'");

Kết quả:

'
LOVE YOU
'
kết quả:'
LOVE YOU'

Từ các ví dụ trên, bạn có thể thấy chỉ có khoảng trắng ở cuối chuỗi được xoá thôi phải không nào?

Lưu ý là tương tự như phương thức trim() thì phép xoá khoảng trắng trong JavaScript sử dụng phương thức trimEnd() cũng sẽ KHÔNG làm thay đổi chuỗi ban cuối mà lưu kết quả dưới dạng một chuỗi mới. Do đó hãy gán kết quả của phép xoá vào một biến để có thể sử dụng nhiều lần trong chương trình nhé.

Xoá toàn bộ khoảng trắng trong chuỗi JavaScript

Có nhiều phương pháp để xoá toàn bộ khoảng trắng trong chuỗi JavaScript. Bạn có thể chọn một trong các cách sau đây để hoàn thành được việc này.

Xoá toàn bộ khoảng trắng trong chuỗi JavaScript bằng split() và join()

Trong các bài trước chúng ta đã biết phương thức split() giúp chia một chuỗi thành các chuỗi nhỏ bằng một ký tự phân tách và phương thức join() giúp nối các phần tử trong một mảng thành một chuỗi cũng bằng một ký tự phân tách.

Ý tưởng ở đây là, chúng ta sẽ dùng split() để tách chuỗi ban đầu ra bằng khoảng trắng và thu về kết quả dưới một mảng. Sau đó thì dùng phương thức join() với đối số là ký tự trắng '' nhằm nối các phần tử trong mảng mà không dùng ký tự phân tách, qua đó có thể loại bỏ đi toàn bộ khoảng trắng có trong chuỗi ban đầu.

Cụ thể chúng ta viết:

let str = " I Love You So Much ";
myarr = str.split(" "); // [ '', 'I', 'Love', 'You', 'So', 'Much', '']
newstr = myarr.join('');

console.log(newstr); //ILoveYouSoMuch

Hoặc chúng ta có thể viết gọn trên một dòng code như sau:

let str = " I Love You So Much ";
newstr = str.split(" ").join("");

console.log(newstr); //ILoveYouSoMuch

Xoá toàn bộ khoảng trắng trong chuỗi JavaScript bằng phương thức replace() và biểu thức chính quy RegEx

Một cách đơn giản khác giúp chúng ta Xoá toàn bộ khoảng trắng trong chuỗi JavaScript, đó chính là sử dụng tới phương thức replace() với đối số là một biểu thức chính quy RegEx dưới định dạng glocal flag.

Trong các bài trước chúng ta đã biết phương thức replace() có tác dụng thay thế ký tự trong chuỗi JavaScript bằng một chuỗi khác.

Ứng dụng chức năng này, chúng ta có thể dùng replace() để thay thế các khoảng trắng trong chuỗi bằng ký tự trống và qua đó hoàn thành việc xoá toàn bộ khoảng trắng trong chuỗi ban đầu.

Lại nữa, do phương thức replace() thông thường chỉ có tác dụng thay thế ký tự đầu tiên tìm thấy, do đó chúng ta cần sử dụng nó kèm với một biểu thức chính quy (regular expression) dưới dạng glocal flag để có thể tiến hành thay thế toàn bộ ký tự trong chuỗi.

Ví dụ cụ thể, chúng ta sử dụng RegEx để biểu thị khoảng trắng dưới dạng glocal flag là /\s/g và xoá toàn bộ khoảng trắng trong chuỗi như sau:

let str = " I Love You So Much ";
newstr = str.replace(/\s/g, '');

console.log(newstr); //ILoveYouSoMuch

Tổng kết

Trên đây Kiyoshi đã hướng dẫn bạn các cách xoá khoảng trắng trong chuỗi JavasSript rồi. Để nắm rõ nội dung bài học hơn, bạn hãy thực hành viết lại các ví dụ của ngày hôm nay nhé.

Và hãy cùng tìm hiểu những kiến thức sâu hơn về JavaScript trong các bài học tiếp theo.

HOME>> >>

Profile
きよしです!笑

Tác giả : Kiyoshi (Chis Thanh)

Kiyoshi là một cựu du học sinh tại Nhật Bản. Sau khi tốt nghiệp đại học Toyama năm 2017, Kiyoshi hiện đang làm BrSE tại Tokyo, Nhật Bản.