3 cách để thay thế tất cả các lần xuất hiện chuỗi trong JavaScript – thay thế tất cả bằng js

Bạn có thể thay thế tất cả các lần xuất hiện của một chuỗi bằng cách sử dụng cách tiếp cận tách và nối, thay thế () bằng một biểu thức chính quy và phương thức chuỗi ReplaceAll () mới.

Bạn đang xem : thay thế tất cả bằng js

Không có cách nào dễ dàng để thay thế tất cả các lần xuất hiện chuỗi trong JavaScript. Java, vốn là nguồn cảm hứng cho JavaScript trong những ngày đầu tiên, có phương thức ReplaceAll () trên chuỗi kể từ năm 1995!

Trong bài đăng này, bạn 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, đồng thời kết hợp string.replace () với một biểu thức chính quy chung.

Hơn nữa, bạn sẽ đọc về đề xuất mới string.replaceAll () (ở giai đoạn 4) mang phương thức thay thế tất cả thành chuỗi JavaScript. Đây là cách tiếp cận thuận tiện nhất.

1. Tách và nối một mảng

Nếu bạn google cách “thay thế tất cả các lần xuất hiện chuỗi trong JavaScript”, rất có thể cách tiếp cận đầu tiên bạn tìm thấy là sử dụng một mảng trung gian.

Đây là cách nó hoạt động:

  1. Tách chuỗi thành các phần theo chuỗi search :
 

javascript

const

phần

=

chuỗi

.

phần tách

(

tìm kiếm

);

  1. Sau đó, nối các phần đặt chuỗi thay thế ở giữa:
 

javascript

const

Chuỗi kết quả

=

các mảnh

.

tham gia

(

thay thế

);

Ví dụ: hãy thay thế tất cả dấu cách '' bằng dấu gạch ngang '-' trong chuỗi 'duck duck go' :

 

javascript

const

< / p>

tìm kiếm

=

''

;

< p> const

ReplaceWith

=

'-'

;

const

kết quả

=

'duck duck go'

.

tách

(

tìm kiếm

).

tham gia

(

thay thếWith

);

kết quả

;

// = & gt; 'duck-duck-go'

'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 bằng cách chèn '-' vào giữa chúng , dẫn đến chuỗi 'duck-duck-go' .

Đây là một chức năng trợ giúp tổng quát sử dụng phương pháp tách và nối:

 

javascript

hàm

ReplaceAll

(

chuỗi

,

tìm kiếm

,

thay thế

) {

trả lại

chuỗi

.

chia nhỏ

(

tìm kiếm

).

tham gia

(

thay thế

);

} < / p>

ReplaceAll

(

'abba' < / p>

,

'a'

,

'i'

);

// = & gt; 'ibbi'

ReplaceAll

(

'go go go!'

,

'đi'

,

'di chuyển'

);

// = & gt; 'di chuyển di chuyển di chuyển!'

ReplaceAll

(

'oops'

,

'z'

,

'y'

);

// = & gt; 'rất tiếc'

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 đó trở lại thành một chuỗi. Hãy tiếp tục tìm kiếm các giải pháp thay thế tốt hơn.

2. thay thế () bằng một biểu thức chính quy toàn cầu

Phương thức chuỗi string.replace (regExpSearch, ReplaceWith) tìm kiếm và thay thế các lần xuất hiện của biểu thức chính quy regExpSearch bằng chuỗi ReplaceWith . < / p>

Để thực hiện 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:

  1. Nối g sau vào cuối cụm từ thông dụng: / search / g
  2. 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 '-' :

 

javascript

const

searchRegExp

=

/ \ s /

g

;

const

ReplaceWith

=

'-'

;

const

kết quả

=

'duck duck go'

.

thay thế

(

searchRegExp

,

thay thếWith

);

kết quả

;

// = & gt; 'duck-duck-go'

Cụm từ thông dụng / \ s / g (lưu ý rằng cờ chung của g ) khớp với khoảng trắng '' .

'duck duck go'.replace (/ \ s / g,' - ') thay thế tất cả các kết quả phù hợp của / \ s / g bằng ' - ', kết quả là ' duck-duck-go '.

Bạn có thể dễ dàng thay thế phân biệt chữ hoa chữ thường bằng cách thêm cờ i vào biểu thức chính quy:

 

javascript

const

< / p>

searchRegExp

=

/ duck /

gi

;

< p class = "line dim">

const

ReplaceWith

=

'ngỗng'

< p>;

const

kết quả

=

'DUCK Duck go'

.

thay thế

(

< p> searchRegExp

,

thay thếWith

);

kết quả

;

// = & gt; 'ngỗng đi'

Biểu thức chính quy / duck / gi thực hiện tìm kiếm toàn cục không phân biệt chữ hoa chữ thường (lưu ý cờ i g ). / duck / gi khớp với 'DUCK' , cũng như 'Duck' .

Gọi 'DUCK Duck go'.replace (/ duck / gi,' ngỗng ') thay thế tất cả các kết quả phù hợp của chuỗi con / duck / gi bằng ' ngỗng '.

2.1 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.

Do đó, các ký tự đặc biệt là một vấn đề khi bạn muốn thực hiện thay thế tất cả các thao tác. Đây là một ví dụ:

 

javascript

const

< / p>

tìm kiếm

=

'+'

;

< / p>

const

searchRegExp

=

new

RegExp

(

tìm kiếm

,

'g'

);

// Ném SyntaxError

const

ReplaceWith

=

'-'

;

const

kết quả

=

'5 + 2 + 1'

.

thay thế

(

searchRegExp

,

thay thếWith

);

Đoạn mã trên cố gắng chuyển đổi 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ệ, do đó SyntaxError: Biểu thức chính quy không hợp lệ: / + / được ném ra.

Thoát ký tự '\\ +' sẽ giải quyết được vấn đề.

Tuy nhiên, có đáng để thoát chuỗi tìm kiếm bằng một hàm như EscapeRegExp () để được sử dụng như một biểu thức chính quy không? Nhiều khả năng là không.

2.2 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 chỉ thay thế lần xuất hiện đầu tiên của search :

 

javascript

const

< / p>

tìm kiếm

=

''

;

< p> const

thay thế

=

'-'

;

const

kết quả

=

'duck duck go'

.

thay thế

(

tìm kiếm

,

thay thế

);

kết quả

;

// = & gt; 'duck-duck go'

'duck duck go'.replace (' ',' - ') chỉ thay thế phần xuất hiện đầu tiên của dấu cách.

3. phương thức ReplaceAll ()

Cuối cùng, phương thức string.replaceAll (search, ReplaceWith) thay thế tất cả các lần xuất hiện của chuỗi search bằng ReplaceWith .

Hãy thay thế tất cả các lần xuất hiện của '' bằng '-' :

 

javascript

const

tìm kiếm

=

''

;

const

thay thếWith

=

'-'

;

const

kết quả

=

'duck duck go'

.

ReplaceAll

(

tìm kiếm

,

thay thế bằng

);

kết quả

;

// = & gt; 'duck-duck-go'

'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 hiện tại, phương thức hỗ trợ trong các trình duyệt còn hạn chế và bạn có thể yêu cầu polyfill .

3.1 Sự khác biệt giữa ReplaceAll () và Replace ()

Các phương thức chuỗi ReplaceAll (search, ReplaceWith) Replace (tìm kiếm, ReplaceWith) hoạt động theo cùng một cách, mong đợi 2 điều:

  1. Nếu đối số search là một chuỗi, thì ReplaceAll () sẽ thay thế tất cả các lần xuất hiện của search bằng ReplaceWith , trong khi Replace () chỉ lần xuất hiện đầu tiên
  2. Nếu đối số search là một biểu thức chính quy không phải toàn cục, thì ReplaceAll () ném một ngoại lệ TypeError .

4. Bài học chính

Phương pháp cơ bản để thay thế tất cả các lần xuất hiện là chia chuỗi thành nhiều phần theo chuỗi tìm kiếm, nối lại chuỗi đặt chuỗi thay thế giữa các phần: string.split (search) .join (ReplaceWith) . Cách tiếp cận này hiệu quả, nhưng nó khó hiểu.

Một cách tiếp cận khác là sử dụng string.replace (/ SEARCH / g, ReplaceWith) với một biểu thức chính quy có cờ chung được bật.

Rất tiếc, bạn không thể dễ dàng tạo biểu thức chính quy từ một chuỗi trong thời gian chạy, vì các ký tự đặc biệt của biểu thức chính quy phải được thoát ra. Và việc xử lý một biểu thức chính quy để thay thế các chuỗi đơn giản là quá sức.

Cuối cùng, phương thức chuỗi mới string.replaceAll (search, ReplaceWith) thay thế tất cả các lần xuất hiện của chuỗi. Phương pháp này là một đề xuất ở giai đoạn 4 và hy vọng rằng nó sẽ sớm xuất hiện trong một tiêu chuẩn JavaScript mới.

Đề xuất của tôi là sử dụng string.replaceAll () để thay thế các chuỗi.

Bạn biết những cách nào khác để thay thế tất cả các lần xuất hiện chuỗi? Hãy chia sẻ trong một bình luận bên dưới!


Xem thêm những thông tin liên quan đến chủ đề thay thế tất cả bằng js

Select, Remove, Replace and Clone DOM Elements with plain Javascript

  • Tác giả: Before Semicolon
  • Ngày đăng: 2017-12-15
  • Đánh giá: 4 ⭐ ( 6704 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Learn how to select remove replace or clone any element, any child node, parent node, any siblings node using plain Javascript.

    timeline:
    1:40 - Select any element
    9:45 - Select Parent element
    10:28 - Select any Children element
    15:58 - Select all Prev or Next Sibling element
    17:57 - Select all Siblings element
    23:05 - Remove any Element
    24:50 - Replace any Element
    26:10 - Clone any Element

    follow @:
    - Instagram = https://www.instagram.com/before_semicolon_/
    - twitter = https://twitter.com/BeforeSemicolon
    - facebook = https://www.facebook.com/beforesemicolon
    - codepen = https://codepen.io/beforesemicolon

    website = http://beforesemicolon.com

Cách thay thế tất cả các lần xuất hiện của một chuỗi trong JavaScript

  • Tác giả: tech-wiki.online
  • Đánh giá: 3 ⭐ ( 6131 lượt đánh giá )
  • Khớp với kết quả tìm kiếm:

Cách thay thế tất cả các phiên bản của một chuỗi trong JavaScript

  • Tác giả: s11.galaxyz.net
  • Đánh giá: 5 ⭐ ( 4529 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Thay thế văn bản trong chuỗi là một nhiệm vụ phổ biến trong JavaScript. Trong bài viết này, bạn sẽ xem xét việc sử dụng replace và biểu thức chính quy để thay thế văn bản.

Một số hàm hữu ích để xử lý mảng trong Javascript

  • Tác giả: viblo.asia
  • Đánh giá: 3 ⭐ ( 2181 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Đôi khi chúng ta bị cuốn theo những Framework, lib... được xây dững sẵn mà quên đi những kiến thức căn bản có thể đã từng tồn tại trong đầu của chúng ta.

Mảng trong JavaScript | JS ARRAY

  • Tác giả: hanoiict.edu.vn
  • Đánh giá: 5 ⭐ ( 7364 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Trong hướng dẫn tự học Javascript này, bạn sẽ tìm hiểu về Mảng (Hay còn gọi là Array), cách tạo và thao tác với Mảng trong JavaScript.

Thay thế phần tử trong mảng JavaScript (index, splice)

  • Tác giả: laptrinhcanban.com
  • Đánh giá: 3 ⭐ ( 9335 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Hướng dẫn cách thay thế phần tử trong mảng JavaScript. Bạn sẽ học được cách thay thế giá trị của một hoặc nhiều phần tử trong mảng JavaScript bằng cách sử dụng index hoặc splice() sau bài học này.

Cách thay thế tất cả các dấu chấm trong chuỗi bằng JavaScript

  • Tác giả: qastack.vn
  • Đánh giá: 3 ⭐ ( 8549 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: [Tìm thấy giải pháp!] Bạn cần phải thoát .vì nó có nghĩa là "một nhân vật tùy ý" trong một…

Xem thêm các bài viết khác thuộc chuyên mục: Kiến thức lập trình

Xem Thêm  MySQL HIỂN THỊ NGƯỜI DÙNG: Liệt kê tất cả người dùng trong cơ sở dữ liệu MySQL - mysql hiển thị người dùng hiện tại