
Trong bài đăng này, ban sẽ tìm hiểu cách thay thế tất cả các lần xuất hiện chuỗi trong JavaScript bằng cách tách và nối một chuỗi, string.replace() kết hợp với biểu thức chính quy toàn cực và string.replaceAll().
Tách và nối một mảng
Nếu google cách thay thế tất cả các lần xuất hiện chuỗi trong JavaScript, cách tiếp cận đầu tiền bạn có thể tìm thấy là sử dụng một mảng trung gian:
Đây là cách hoạt động
1.Chia string
thành pieces
chuỗi search
:
2.Sau đó nối các mảnh đặt replace
chuỗi ở giữa:
Ví dụ: hãy thay thế tất cả khoảng trắng ' '
bằng dấu gạch nối '-'
trong 'duck duck go'
chuỗi:
'duck duck go'.split(' ')
chia chuỗi thành nhiều phần: ['duck', 'duck', 'go']
.
Sau đó, các mảnh ['duck', 'duck', 'go'].join('-')
được nối lại bằng cách chèn '-'
vào giữa chúng, tạo ra chuỗi 'duck-duck-go'
.
Đây là một hàm trợ giúp tổng quát sử dụng phương pháp chia tách và nối:
JS Mở bản demo.
Cách tiếp cận này yêu cầu chuyển đổi chuỗi thành một mảng và sau đó quay lại thành chuỗi. Hãy tiếp tục tìm kiếm những lựa chọn thay thế tốt hơn.
Thay thế () bằng biểu tượng thức chính quy toàn cục
Phương thức chuỗi string.replace(regExpSearch, replaceWith)
tìmkiếm và thay thế các lần xuất hiện của biểu thức chính quy regExpSearch
bằng replaceWith
chuỗi.
Để làm cho phương thức replace()
thay thế tất cả các lần xuất hiện của mẫu - bạn phải bật cờ chung trên biểu thức chính quy:
- Nối
g
vào cuối biểu thức chính quy theo nghĩa đen:/search/g
- Hoặc khi sử dụng hàm tạo biểu thức chính quy, hãy thêm
'g'
vào đối số thứ hai:new RegExp('search', 'g')
Hãy thay thế tất cả các lần xuất hiện của ' '
bằng '-'
:
Biểu thức chính quy /\s/g
(lưu ý g
cờ chung) khớp với khoảng trắng ' '
.
'duck duck go'.replace(/\s/g, '-')
thay thế tất cả các kết quả khớp /\s/g
bằng '-'
, dẫn đến 'duck-duck-go'
.
Bạn có thể dễ dàng thực hiện thay thế không phân biệt chữ hoa chữ thường bằng cách thêm i
cờ vào biểu thức chính quy:
Biểu thức chính quy /\s/g
(lưu ý g
cờ chung) khớp với khoảng trắng ' '
.
'duck duck go'.replace(/\s/g, '-')
thay thế tất cả các kết quả khớp /\s/g
bằng '-'
, dẫn đến 'duck-duck-go'
.
Bạn có thể dễ dàng thực hiện thay thế không phân biệt chữ hoa chữ thường bằng cách thêm i
cờ vào biểu thức chính quy:
Biểu thức chính quy /duck/gi
thực hiện tìm kiếm không phân biệt chữ hoa chữ thường (ghi chú i
và g
cờ). /duck/gi
trận đấu 'DUCK'
, cũng như 'Duck'
.
Việc gọi 'DUCK Duck go'.replace(/duck/gi, 'goose')
sẽ thay thế tất cả kết quả khớp của /duck/gi
chuỗi con bằng 'goose'
.
Biểu thức chính quy từ một chuỗi
Khi biểu thức chính quy được tạo từ một chuỗi, bạn phải thoát khỏi các ký tự - [ ] / { } ( ) * + ? . \ ^ $ |
vì chúng có ý nghĩa đặc biệt trong biểu thức chính quy.
Vì vậy, các ký tự đặc biệt là một vấn đề khi bạn muốn thực hiện thay thế mọi thao tác. Đây là một ví dụ:
Đoạn mã trên cố gắng chuyển chuỗi tìm kiếm '+'
thành một biểu thức chính quy. Nhưng '+'
là một biểu thức chính quy không hợp lệ nên sẽ SyntaxError: Invalid regular expression: /+/
bị loại bỏ.
Thoát khỏi nhân vật '\\+'
sẽ giải quyết được vấn đề. JS thử bản demo cố định
Thay thế() bằng một chuỗi
Nếu đối số đầu tiên search
của string.replace(search, replaceWith)
là một chuỗi thì phương thức này chỉ thay thế lần xuất hiện đầu tiên của search
:
'duck duck go'.replace(' ', '-')
chỉ thay thế sự xuất hiện đầu tiên của một khoảng trắng.
Phương thức thay thếAll()
Cuối cùng, phương thức này string.replaceAll(search, replaceWith)
thay thế tất cả sự xuất hiện của search
chuỗi bằng replaceWith
.
Hãy thay thế tất cả các lần xuất hiện của ' '
bằng '-'
:
'duck duck go'.replaceAll(' ', '-')
thay thế tất cả các lần xuất hiện của ' '
chuỗi bằng '-'
.
string.replaceAll(search, replaceWith)
là cách tốt nhất để thay thế tất cả các lần xuất hiện chuỗi trong một chuỗi
Lưu ý rằng trình duyệt hỗ trợ phương pháp này hiện bị hạn chế và bạn có thể yêu cầu polyfill .
Sự khác biệt giữa thay thếAll() và thay thế()
Các phương thức chuỗi replaceAll(search, replaceWith)
và replace(search, replaceWith)
cách hoạt động đều giống nhau, ngoại trừ 2 điều:
- Nếu
search
đối số là một chuỗi,replaceAll()
thay thế tất cả các lần xuất hiệnsearch
bằng ,replaceWith
trong khi chỉreplace()
thay thế lần xuất hiện đầu tiên - Nếu
search
đối số là một biểu thức chính quy không toàn cục thì sẽreplaceAll()
đưa ra mộtTypeError
ngoại lệ.

Devwork là Nền tảng TUYỂN DỤNG IT CẤP TỐC với mô hình kết nối Nhà tuyển dụng với mạng lưới hơn 30.000 headhunter tuyển dụng ở khắp mọi nơi.Với hơn 1800 doanh nghiệp IT tin dùng Devwork để :
Tag Cloud:
Tác giả: quyenntt
Việc làm tại Devwork
Bài viết liên quan

Prop là gì trong ReactJS? Cách sử dụng prop để truyền dữ liệu
Prop là gì trong ReactJS luôn là câu hỏi cơ bản nhưng quan trọng đối với mọi lập trình viên khi bắt đầu với thư viện này. Việc nắm vững các khái niệm nền tảng như props sẽ giúp bạn phát triển ứng dụng React một cách hiệu quả và chuyên nghiệp. Hãy cùng tìm hiểu chi tiết về cơ chế truyền dữ liệu quan trọng này trong bài viết sau....
Authentication là gì? 5 phương pháp bảo mật hiệu quả nhất hiện nay
Authentication là gì và tại sao nó lại đóng vai trò quan trọng trong thế giới số hóa ngày nay? Cùng Devwork tìm hiểu chi tiết về các phương pháp xác thực và cách triển khai hiệu quả để bảo vệ dữ liệu của bạn.

Elasticsearch là gì? Khái niệm, ứng dụng và cách sử dụng cơ bản
Elasticsearch là gì? Một công nghệ đang thay đổi cách doanh nghiệp quản lý và khai thác dữ liệu. Bài viết của Devwork sẽ giúp bạn hiểu rõ về công cụ mạnh mẽ này, từ cơ chế hoạt động đến các ứng dụng thực tế và hướng dẫn triển khai. Khám phá ngay để nâng cao hiệu suất hệ thống của bạn!

Product Placement là gì? 5 CHIẾN THUẬT quảng cáo ngầm hiệu quả nhất
Product placement là gì và tại sao nó lại trở thành công cụ quảng cáo được nhiều doanh nghiệp ưa chuộng? Hãy cùng Devwork khám phá hình thức quảng cáo tinh tế này - phương pháp giúp thương hiệu xuất hiện tự nhiên trong nội dung giải trí mà không làm gián đoạn trải nghiệm người dùng.


SMB là gì? Nguyên lý hoạt động và ứng dụng thực tế trong mạng máy tính
Trong thời đại số hóa, việc chia sẻ tài nguyên qua mạng trở nên thiết yếu đối với mọi tổ chức. Ở bài viết này, Devwork giới thiệu đến bạn bài viết đầy đủ về SMB là gì - giao thức mạng quan trọng được sử dụng rộng rãi trong doanh nghiệp và hộ gia đình.

Buffer là gì? Giải thích đơn giản & dễ hiểu cho người mới
Buffer là gì? Nếu bạn từng gặp cảnh video “loading” mãi không xong hay chương trình xử lý dữ liệu chậm trễ, rất có thể buffer – hay bộ đệm – đang hoạt động phía sau. Bài viết này sẽ giúp bạn hiểu rõ buffer là gì, hoạt động ra sao và vì sao nó quan trọng đến vậy.
