JavaScript replaceAll() – Thay thế tất cả các trường hợp của một chuỗi trong JS

Khi làm việc với một chương trình JavaScript, bạn có thể cần thay thế một ký tự hoặc từ bằng một ký tự hoặc từ khác.

Cụ thể, bạn có thể cần phải thay thế không chỉ một mà tất cả các lần xuất hiện của ký tự hoặc từ đó bằng một từ khác.

Có một số cách bạn có thể đạt được điều này với JavaScript.

Một trong những cách là sử dụng tích hợp sẵn replaceAll() phương pháp mà bạn sẽ học cách sử dụng trong bài viết này.

Đây là những gì chúng tôi sẽ đề cập:

1. Là gì replaceAll() trong JavaScript?
   1. replaceAll() cú pháp
2. replaceAll() với một chuỗi là tham số đầu tiên
3. replaceAll() với một biểu thức chính quy làm tham số đầu tiên
4. replaceAll() VS replace()

Là gì replaceAll() trong JavaScript?

Các replaceAll() method là một phần của thư viện chuẩn của JavaScript. Khi bạn sử dụng nó, bạn thay thế tất cả các trường hợp của một chuỗi.

Có nhiều cách khác nhau để bạn có thể thay thế tất cả các phiên bản của một chuỗi. Điều đó nói rằng, sử dụng replaceAll() là cách đơn giản nhất và nhanh nhất để làm như vậy.

Một điều cần lưu ý là chức năng này đã được giới thiệu với ES2021.

Mặc dù replaceAll() tương thích với tất cả các trình duyệt chính, nó không phải là giải pháp tốt nhất khi phát triển cho các phiên bản trình duyệt cũ hơn, vì các phiên bản cũ hơn này có thể không hiểu và không hỗ trợ nó.

Các replaceAll() Phương pháp – Phân tích cú pháp

Cú pháp chung cho replaceAll() phương pháp trông như thế này:

string.replaceAll(pattern, replacement)

Hãy chia nhỏ nó ra:

• string là chuỗi ban đầu bạn đang làm việc và chuỗi bạn sẽ gọi là replaceAll() phương pháp trên.
• Các replaceAll() phương thức nhận 2 tham số:
• pattern là tham số đầu tiên, có thể là chuỗi con hoặc biểu thức chính quy – tham số này đề cập đến mục bạn muốn thay đổi và thay thế bằng mục khác.
  • Nếu pattern là một biểu hiện thông thườngbạn cần bao gồm g cờ (ở đâu g viết tắt của gthùy) hoặc replaceAll() sẽ đưa ra một ngoại lệ – cụ thể, lỗi sẽ là một TypeError.
• replacement là tham số thứ hai, có thể là một chuỗi khác hoặc một hàm để thay thế pattern.

Một điều cần lưu ý ở đây là replaceAll() phương pháp không thay đổi chuỗi ban đầu. Thay vào đó, nó trả về một bản sao mới.

Tất cả các trường hợp của quy định pattern sẽ được thay thế bởi replacement.

Cách sử dụng replaceAll() với một chuỗi là ví dụ tham số đầu tiên

Trước đó, bạn đã thấy replaceAll() phương pháp chấp nhận hai tham số – pattern là tham số đầu tiên và replacement như thứ hai.

Bạn cũng thấy rằng pattern có thể là một chuỗi hoặc một biểu thức chính quy.

Bây giờ, hãy xem làm thế nào replaceAll() hoạt động khi nó mất một chuỗi như tham số đầu tiên.

Vì vậy, giả sử bạn có ví dụ sau:

const my_string = "I like dogs because dogs are adorable!";

let pattern = "dogs";
let replacement = "cats";

let my_new_string = my_string.replaceAll(pattern,replacement);

Tôi lưu trữ văn bản I like dogs because dogs are adorable! trong một biến có tên my_string.

Đây là chuỗi gốc mà tôi đang làm việc và tôi muốn sửa đổi một số nội dung của nó.

Cụ thể, tôi muốn thay đổi chuỗi con dogscái nào xuất hiện hai lần trong chuỗi gốc – đây sẽ là của tôi pattern.

Tôi lưu trữ chuỗi con này mà tôi muốn thay thế bằng một thứ khác trong một biến có tên pattern.

sau đó tôi lưu trữ chuỗi cats trong một biến gọi là replacement – đây là chuỗi sẽ thay thế dogs.

sau đó tôi gọi replaceAll() trên chuỗi ban đầu, chuyển hai chuỗi con dưới dạng tham số và lưu kết quả đó vào một biến có tên my_new_string.

console.log(my_new_string);

// I like cats because cats are adorable!

Các replaceAll() phương pháp sẽ thay thế tất cả các trường hợp của chuỗi con dogs trong chuỗi I like dogs because dogs are adorable! với cats.

Chuỗi ban đầu sẽ không thay đổi.

Một điều cần lưu ý ở đây là sự thay thế khi sử dụng một chuỗi làm tham số đầu tiên có phân biệt chữ hoa chữ thường. Điều này có nghĩa là chỉ chuỗi có cùng kiểu chữ mới khớp với pattern được thay thế.

const my_string = "I like Dogs because dogs are adorable!";

let pattern = "dogs";
let replacement = "cats";

let my_new_string = my_string.replaceAll(pattern,replacement);

console.log(my_new_string);

Trong ví dụ trên, có hai trường hợp dogsnhưng cái đầu tiên có vốn D.

Như bạn có thể thấy ở đầu ra, sự thay thế phân biệt chữ hoa chữ thường:

I like Dogs because cats are adorable!

Cách sử dụng replaceAll() với Biểu thức chính quy làm Ví dụ tham số đầu tiên

Như bạn đã thấy trước đó, bạn có thể chuyển một biểu thức chính quy (còn được gọi là biểu thức chính quy) làm tham số đầu tiên.

Biểu thức chính quy là một chuỗi ký tự tạo mẫu tìm kiếm.

Cú pháp chung để làm điều này tương tự như sau:

string.replaceAll(/pattern/g, replacement)

Hãy lấy ví dụ từ phần trước và thay vì một chuỗi, hãy sử dụng biểu thức chính quy làm tham số đầu tiên:

const my_string = "I like dogs because dogs are adorable!";

let pattern = /dogs/g;
let replacement = "cats";

let my_new_string = my_string.replaceAll(pattern,replacement);

console.log(my_new_string);

//output

// I like cats because cats are adorable!

Khi sử dụng biểu thức chính quy làm tham số đầu tiên, hãy đảm bảo sử dụng g lá cờ.

Nếu không, cuối cùng bạn sẽ gặp lỗi trong mã của mình:

const my_string = "I like dogs because dogs are adorable!";

let pattern = /dogs/;
let replacement = "cats";

let my_new_string = my_string.replaceAll(pattern,replacement);

console.log(my_new_string);

// output

// test.js:6 Uncaught TypeError: String.prototype.replaceAll called with a // non-global RegExp argument
//    at String.replaceAll (<anonymous>)
//   at test.js:6:31

Hãy tinh chỉnh chuỗi ban đầu một chút.

const my_string = "I like Dogs because dogs are adorable!";

let pattern = /dogs/g;
let replacement = "cats";

let my_new_string = my_string.replaceAll(pattern,replacement);

console.log(my_new_string);

Bây giờ tôi đã có hai trường hợp dogsnhưng một trong số đó là viết hoa D.

Tôi kết thúc với đầu ra sau:

I like Dogs because cats are adorable!

Từ đầu ra đó, bạn có thể biết rằng đó là một sự thay thế phân biệt chữ hoa chữ thường.

Để làm cho nó không phân biệt chữ hoa chữ thường, hãy đảm bảo thêm i cờ sau g cờ như vậy:

const my_string = "I like Dogs because dogs are adorable!";

let pattern = /dogs/gi;
let replacement = "cats";

let my_new_string = my_string.replaceAll(pattern,replacement);

console.log(my_new_string);

// output

// I like cats because cats are adorable!

Biểu thức chính quy /dogs/gi sẽ khớp với tất cả các trường hợp chứa chuỗi con đó và làm cho trường hợp thay thế không nhạy cảm.

Các replaceAll() so với replace() Phương pháp – Sự khác biệt là gì?

Sự khác biệt giữa replaceAll() và replace() phương pháp là replaceAll() thực hiện thay thế toàn cầu ngay lập tức.

Các replaceAll() phương pháp sẽ thay thế tất cả các thể hiện của chuỗi hoặc mẫu biểu thức chính quy mà bạn chỉ định, trong khi replace() phương pháp sẽ chỉ thay thế các đầu tiên tần suất xảy ra.

đây là cách replace() hoạt động với một chuỗi làm tham số đầu tiên:

const my_string = "I like dogs because dogs are adorable!";

let pattern = "dogs";
let replacement = "cats";

let my_new_string = my_string.replace(pattern,replacement);

console.log(my_new_string);

// output
// I like cats because dogs are adorable!

Và đây là cách replace() hoạt động với biểu thức chính quy làm tham số đầu tiên:

const my_string = "I like dogs because dogs are adorable!";

let pattern = /dogs/;
let replacement = "cats";

let my_new_string = my_string.replace(pattern,replacement);

console.log(my_new_string);

// output
// I like cats because dogs are adorable!

Cách duy nhất để thực hiện thay thế toàn cầu với replace() phương pháp là sử dụng một biểu thức chính quy với g lá cờ:

const my_string = "I like dogs because dogs are adorable!";

let pattern = /dogs/g;
let replacement = "cats";

let my_new_string = my_string.replace(pattern,replacement);

console.log(my_new_string);

// output

// I like cats because cats are adorable!

Phần kết luận

Và bạn có nó rồi đấy! Bây giờ bạn biết làm thế nào replaceAll() phương pháp hoạt động và một số cách bạn có thể sử dụng nó.

Để tìm hiểu thêm về JavaScript, hãy xem Chứng nhận cấu trúc dữ liệu và thuật toán JavaScript của freeCodeCamp.

Đó là một chương trình giảng dạy miễn phí, được cân nhắc kỹ lưỡng và có cấu trúc, nơi bạn sẽ học một cách tương tác. Cuối cùng, bạn cũng sẽ xây dựng 5 dự án để nhận chứng chỉ và củng cố kiến ​​thức của mình.

Cảm ơn vì đã đọc!