Tìm hiểu String search() trong JavaScript

Javascript căn bản | by Học Javascript

Trong JavaScript, việc tìm kiếm một chuỗi con trong một đoạn văn bản là một thao tác quan trọng, đặc biệt khi xử lý dữ liệu văn bản hoặc kiểm tra đầu vào của người dùng. Phương thức search() là một công cụ hữu ích giúp tìm vị trí xuất hiện đầu tiên của một chuỗi con hoặc một biểu thức chính quy trong chuỗi gốc.

So với các phương thức tìm kiếm khác như indexOf()match(), search() có ưu điểm là hỗ trợ biểu thức chính quy (RegExp), giúp linh hoạt hơn trong việc tìm kiếm dữ liệu. Tuy nhiên, mỗi phương thức có cách hoạt động và mục đích sử dụng khác nhau. Trong bài viết này, chúng ta sẽ tìm hiểu chi tiết về phương thức search(), cách sử dụng, ưu nhược điểm, và so sánh với các phương thức tìm kiếm khác trong JavaScript.

Phương thức search() trong JavaScript là gì?

Phương thức search() trong JavaScript được sử dụng để tìm vị trí của một chuỗi con hoặc một mẫu biểu thức chính quy (RegExp) trong chuỗi gốc. Phương thức này giúp xác định xem chuỗi có chứa giá trị cần tìm hay không và trả về vị trí xuất hiện đầu tiên của kết quả tìm kiếm.

Không giống như indexOf(), search() có thể sử dụng với biểu thức chính quy, giúp linh hoạt hơn khi tìm kiếm dữ liệu. Tuy nhiên, nó chỉ trả về vị trí đầu tiên của kết quả tìm kiếm mà không trả về nội dung tìm thấy.

Cú pháp của search()

Cú pháp sử dụng phương thức search() trong JavaScript như sau:

string.search(pattern);

Trong đó:

  • string là chuỗi gốc cần tìm kiếm.
  • pattern có thể là một chuỗi hoặc một biểu thức chính quy (RegExp).

Giá trị trả về của search()

Phương thức search() trả về một số nguyên:

  • Nếu tìm thấy chuỗi con hoặc khớp với biểu thức chính quy, nó sẽ trả về vị trí xuất hiện đầu tiên của kết quả tìm kiếm (chỉ số bắt đầu từ 0).
  • Nếu không tìm thấy, phương thức trả về -1.

Ví dụ phương thức search()

Ví dụ 1: Tìm kiếm một chuỗi con

let text = "Hello, welcome to JavaScript!";
let position = text.search("welcome");

console.log(position); // Kết quả: 7

Ở đây, từ "welcome" bắt đầu từ vị trí số 7 trong chuỗi gốc, nên search() trả về 7.

Ví dụ 2: Sử dụng biểu thức chính quy (RegExp)

let text = "Hello, welcome to JavaScript!";
let position = text.search(/javascript/i); // Không phân biệt chữ hoa, chữ thường

console.log(position); // Kết quả: 19

Ở đây, biểu thức chính quy /javascript/i được sử dụng để tìm từ "JavaScript" mà không phân biệt chữ hoa, chữ thường (i là flag cho case-insensitive).

Ví dụ 3: Khi không tìm thấy chuỗi

let text = "Hello, welcome to JavaScript!";
let position = text.search("Python");

console.log(position); // Kết quả: -1

"Python" không có trong chuỗi gốc, nên search() trả về -1.

Lưu ý quan trọng về search()

  • Chỉ trả về vị trí đầu tiên: Không trả về tất cả vị trí của chuỗi con nếu xuất hiện nhiều lần.
  • Không trả về nội dung tìm thấy: Nếu cần lấy nội dung tìm thấy, bạn phải sử dụng phương thức match().
  • Không hỗ trợ tìm kiếm từ cuối chuỗi: Nếu cần tìm kiếm từ cuối lên, hãy sử dụng lastIndexOf().

Phương thức search() hữu ích khi bạn cần tìm một vị trí trong chuỗi với điều kiện linh hoạt bằng biểu thức chính quy. Tuy nhiên, nếu chỉ cần tìm kiếm một chuỗi con đơn giản, indexOf() có thể là lựa chọn tốt hơn.

Cách sử dụng search() trong JavaScript

Phương thức search() được sử dụng để tìm kiếm vị trí của một chuỗi con hoặc một mẫu biểu thức chính quy trong một chuỗi. Dưới đây là các cách sử dụng phổ biến của search(), kèm theo ví dụ minh họa.

Tìm kiếm với chuỗi đơn giản

Khi sử dụng search() với một chuỗi đơn giản, nó sẽ tìm vị trí đầu tiên mà chuỗi con xuất hiện trong chuỗi gốc. Nếu chuỗi con không tồn tại, search() trả về -1.

Ví dụ: Tìm vị trí của một từ trong chuỗi

let text = "JavaScript là một ngôn ngữ lập trình.";
console.log(text.search("ngôn ngữ")); // Kết quả: 14

Giải thích:

  • Trong chuỗi "JavaScript là một ngôn ngữ lập trình.", từ "ngôn ngữ" bắt đầu từ vị trí số 14.
  • search("ngôn ngữ") trả về 14 là vị trí xuất hiện đầu tiên của chuỗi con.

Sử dụng với biểu thức chính quy (Regular Expressions - RegExp)

Phương thức search() hỗ trợ biểu thức chính quy, giúp tìm kiếm linh hoạt hơn so với indexOf().

Ví dụ: Tìm kiếm không phân biệt hoa thường (i flag)

let text = "Học JavaScript rất thú vị!";
console.log(text.search(/javascript/i)); // Kết quả: 5

Giải thích:

  • Biểu thức /javascript/i giúp tìm kiếm từ "JavaScript" trong chuỗi mà không phân biệt chữ hoa, chữ thường (i là flag viết tắt của case-insensitive).
  • "JavaScript" xuất hiện ở vị trí 5, nên kết quả trả về là 5.

Ví dụ: Tìm kiếm số trong chuỗi (\d để tìm chữ số)

let text = "Tôi có 3 con mèo và 2 con chó.";
console.log(text.search(/\d/)); // Kết quả: 6 (số '3' xuất hiện ở vị trí 6)

Giải thích:

  • Biểu thức chính quy /\d/ dùng để tìm số (\d đại diện cho bất kỳ chữ số nào từ 0-9).
  • Số 3 xuất hiện đầu tiên ở vị trí 6, nên kết quả trả về là 6.

Tìm kiếm với các ký tự đặc biệt trong chuỗi

Nếu muốn tìm kiếm các ký tự đặc biệt như dấu chấm (.), dấu hỏi (?), dấu cộng (+), bạn cần sử dụng ký tự thoát (\) trong biểu thức chính quy.

Ví dụ: Tìm kiếm dấu chấm trong chuỗi

let text = "Học JavaScript rất thú vị.";
console.log(text.search(/\./)); // Kết quả: 24

Giải thích:

  • Dấu chấm (.) là một ký tự đặc biệt trong RegExp, nên cần đặt \. để tìm kiếm chính xác dấu chấm trong chuỗi.
  • Ký tự . xuất hiện ở vị trí 24, nên kết quả trả về là 24.

Khi search() không tìm thấy kết quả

Nếu không có kết quả nào phù hợp với điều kiện tìm kiếm, search() sẽ trả về -1.

Ví dụ: Tìm kiếm từ không tồn tại trong chuỗi

let text = "Lập trình JavaScript rất thú vị!";
console.log(text.search("Python")); // Kết quả: -1

Giải thích:

  • Vì từ "Python" không có trong chuỗi gốc, search() trả về -1 để biểu thị rằng không tìm thấy kết quả phù hợp.

Kết hợp search() với điều kiện if để kiểm tra chuỗi

Có thể dùng search() trong điều kiện if để kiểm tra xem một chuỗi có chứa một từ khóa hoặc mẫu nào đó hay không.

Ví dụ: Kiểm tra xem chuỗi có chứa số không

let text = "Hôm nay là ngày 23 tháng 2.";
if (text.search(/\d/) !== -1) {
    console.log("Chuỗi chứa số!");
} else {
    console.log("Chuỗi không chứa số!");
}
// Kết quả: Chuỗi chứa số!

Giải thích:

  • /\d/ tìm kiếm số trong chuỗi.
  • Nếu search() không trả về -1, nghĩa là chuỗi có chứa số.

Khi nào nên sử dụng search() thay vì indexOf()?

Tính năng search() indexOf()
Hỗ trợ biểu thức chính quy Không
Tìm vị trí xuất hiện đầu tiên
Không tìm thấy trả về -1
Chỉ tìm kiếm chuỗi đơn giản Không
  • Dùng search() khi cần tìm kiếm linh hoạt với biểu thức chính quy.
  • Dùng indexOf() khi chỉ cần tìm kiếm một chuỗi đơn giản mà không cần RegExp.

Ví dụ:

let text = "Hello JavaScript";
console.log(text.indexOf("JavaScript")); // 6
console.log(text.search(/javascript/i)); // 6
  • indexOf("JavaScript") chỉ chấp nhận chuỗi đơn giản.
  • search(/javascript/i) hỗ trợ tìm kiếm không phân biệt chữ hoa, chữ thường.

So sánh search() với indexOf() và match() trong JavaScript

Khi làm việc với chuỗi trong JavaScript, có nhiều phương thức tìm kiếm khác nhau, mỗi phương thức có cách hoạt động và mục đích sử dụng riêng. Dưới đây là bảng so sánh giữa ba phương thức phổ biến: search(), indexOf(), và match().

Bảng so sánh search(), indexOf() và match()

Phương thức Mô tả Hỗ trợ Regular Expressions (RegExp) Giá trị trả về
search() Tìm kiếm vị trí đầu tiên của một chuỗi con hoặc một biểu thức chính quy trong chuỗi chính. Có hỗ trợ Vị trí đầu tiên tìm thấy hoặc -1 nếu không tìm thấy.
indexOf() Tìm kiếm vị trí đầu tiên của một chuỗi con nhưng không hỗ trợ biểu thức chính quy. Không hỗ trợ Vị trí đầu tiên tìm thấy hoặc -1 nếu không tìm thấy.
match() Tìm kiếm và trả về một mảng chứa tất cả các kết quả khớp với mẫu tìm kiếm. Có hỗ trợ Một mảng chứa kết quả tìm thấy hoặc null nếu không tìm thấy.

Ví dụ so sánh search(), indexOf() và match()

let text = "Hello JavaScript! JavaScript rất hay!";

search() - Tìm vị trí của từ đầu tiên khớp

console.log(text.search("JavaScript")); // Kết quả: 6
console.log(text.search(/javascript/i)); // Kết quả: 6 (Không phân biệt hoa thường)
search() tìm vị trí xuất hiện đầu tiên của "JavaScript" trong chuỗi.
Nó hỗ trợ biểu thức chính quy (RegExp), giúp tìm kiếm linh hoạt hơn (ví dụ: /javascript/i không phân biệt hoa thường).
Kết quả trả về là 6, vị trí bắt đầu của "JavaScript" đầu tiên trong chuỗi.

indexOf() - Tìm vị trí của từ đầu tiên khớp (không hỗ trợ RegExp)

console.log(text.indexOf("JavaScript")); // Kết quả: 6
console.log(text.indexOf("Python")); // Kết quả: -1 (Không tìm thấy)

indexOf() cũng tìm vị trí xuất hiện đầu tiên của "JavaScript", giống như search().
Nhưng nó không hỗ trợ biểu thức chính quy (RegExp).
Kết quả trả về là 6, vị trí bắt đầu của "JavaScript" đầu tiên trong chuỗi.
Nếu không tìm thấy, kết quả trả về -1.

match() - Tìm tất cả các kết quả khớp và trả về mảng

console.log(text.match(/JavaScript/g)); // Kết quả: ["JavaScript", "JavaScript"]
console.log(text.match(/javaScript/gi)); // Kết quả: ["JavaScript", "JavaScript"]
console.log(text.match(/Python/g)); // Kết quả: null

match() tìm tất cả các kết quả khớp với biểu thức chính quy.
Kết quả trả về là một mảng chứa tất cả các từ khớp, không chỉ vị trí đầu tiên.
Nếu có cờ g (global), nó sẽ tìm tất cả các kết quả trong chuỗi.
Nếu không tìm thấy, match() trả về null thay vì -1.

Khi nào nên dùng search(), indexOf(), hay match()?

Trường hợp Nên dùng
Cần tìm vị trí đầu tiên của một từ hoặc một mẫu biểu thức chính quy trong chuỗi search()
Cần tìm vị trí đầu tiên của một chuỗi con mà không dùng biểu thức chính quy indexOf()
Cần lấy tất cả kết quả khớp với biểu thức chính quy dưới dạng mảng

Các lỗi thường gặp khi sử dụng search() trong JavaScript

Khi sử dụng search() để tìm kiếm chuỗi trong JavaScript, có một số lỗi phổ biến mà lập trình viên thường gặp. Dưới đây là những lỗi thường gặp và cách khắc phục chúng.

Nhầm lẫn giữa search() và indexOf()

Một trong những lỗi phổ biến nhất là sử dụng search() thay vì indexOf() hoặc ngược lại mà không hiểu rõ sự khác biệt giữa chúng.

Lỗi:

  • search() hỗ trợ biểu thức chính quy (RegExp), còn indexOf() chỉ hỗ trợ chuỗi đơn giản.
  • Một số lập trình viên dùng indexOf() để tìm kiếm với RegExp, dẫn đến lỗi.

Cách khắc phục:

  • Nếu chỉ cần tìm chuỗi đơn giản ➝ Dùng indexOf().
  • Nếu cần tìm biểu thức chính quy ➝ Dùng search().

Ví dụ sai:

let text = "Học lập trình JavaScript";

// Cố gắng dùng indexOf() với Regular Expression 
console.log(text.indexOf(/JavaScript/i)); // Lỗi: indexOf không hỗ trợ RegExp

Cách đúng:

let text = "Học lập trình JavaScript";

// Dùng search() khi cần Regular Expression 
console.log(text.search(/JavaScript/i)); // Kết quả: 14

Không kiểm tra giá trị trả về (-1 khi không tìm thấy)

Phương thức search() trả về vị trí của từ đầu tiên tìm thấy trong chuỗi, nếu không tìm thấy, nó trả về -1.
Một số lập trình viên quên kiểm tra giá trị này, dẫn đến lỗi logic khi xử lý chuỗi.

Lỗi:

  • Không kiểm tra -1, dẫn đến kết quả sai.

Cách khắc phục:

  • Luôn kiểm tra nếu kết quả của search() khác -1 trước khi thực hiện các thao tác tiếp theo.

Ví dụ sai:

let text = "Học lập trình JavaScript";

if (text.search("Python")) { // Lỗi: search() trả về -1, nhưng -1 vẫn được coi là 'true' trong điều kiện
  console.log("Tìm thấy!");
} else {
  console.log("Không tìm thấy!");
}

Kết quả sai: "Tìm thấy!" (do -1 là "truthy" trong JavaScript)

Cách đúng:

let text = "Học lập trình JavaScript";

if (text.search("Python") !== -1) { // Kiểm tra đúng cách
  console.log("Tìm thấy!");
} else {
  console.log("Không tìm thấy!");
}

Kết quả đúng: "Không tìm thấy!"

Dùng search() để tìm nhiều kết quả thay vì match()

Một lỗi phổ biến khác là dùng search() để tìm nhiều kết quả, trong khi search() chỉ trả về vị trí đầu tiên.
Nếu cần tìm tất cả các kết quả phù hợp trong chuỗi, nên dùng match() thay vì search().

Lỗi:

  • search() chỉ trả về vị trí đầu tiên, không phải danh sách các kết quả.
  • Dùng search() trong vòng lặp để tìm nhiều kết quả có thể dẫn đến hiệu suất kém.

Cách khắc phục:

  • Nếu cần tìm tất cả các kết quả, hãy dùng match() với cờ g (global).

Ví dụ sai:

let text = "JavaScript rất hay! JavaScript là ngôn ngữ mạnh mẽ.";

// Tìm nhiều kết quả bằng search() 
console.log(text.search(/JavaScript/g)); // Kết quả: 0 (chỉ trả về vị trí đầu tiên)

Cách đúng:

let text = "JavaScript rất hay! JavaScript là ngôn ngữ mạnh mẽ.";

// Tìm tất cả kết quả với match() 
console.log(text.match(/JavaScript/g)); // Kết quả: ["JavaScript", "JavaScript"]

Ứng dụng thực tế của search() trong JavaScript

Phương thức search() có nhiều ứng dụng thực tế trong việc xử lý chuỗi, đặc biệt khi kết hợp với biểu thức chính quy (RegExp). Dưới đây là một số ứng dụng phổ biến của search() và cách triển khai chúng trong JavaScript.

Tìm kiếm từ khóa trong nội dung văn bản

Một trong những ứng dụng phổ biến nhất của search() là tìm kiếm từ khóa trong một đoạn văn bản.

Ví dụ: Kiểm tra xem một bài viết có chứa từ khóa "JavaScript" hay không.

let article = "Học JavaScript giúp bạn phát triển kỹ năng lập trình.";
let keyword = "JavaScript";

// Kiểm tra từ khóa có tồn tại không
if (article.search(keyword) !== -1) {
  console.log(`Từ khóa "${keyword}" có trong bài viết.`);
} else {
  console.log(`Từ khóa "${keyword}" không có trong bài viết.`);
}

Kết quả:

Từ khóa "JavaScript" có trong bài viết.

Lưu ý:

  • search() chỉ trả về vị trí đầu tiên của từ khóa.
  • Nếu cần tìm tất cả vị trí, nên dùng match().

Kiểm tra xem chuỗi có chứa số hay không

Khi làm việc với mật khẩu, số điện thoại hoặc dữ liệu người dùng, chúng ta có thể dùng search() để kiểm tra xem chuỗi có chứa số hay không.

Ví dụ: Kiểm tra mật khẩu có chứa ít nhất một chữ số (\d) hay không.

let password = "abc123";

// Kiểm tra xem mật khẩu có chứa số không
let hasNumber = password.search(/\d/) !== -1;

console.log(hasNumber); // true

Kết quả:

true

Giải thích:

  • \d đại diện cho bất kỳ chữ số nào (0-9).
  • search(/\d/) sẽ tìm vị trí của chữ số đầu tiên, nếu có.
  • Nếu tìm thấy số, search() trả về vị trí (>= 0), nếu không thì trả về -1.

Kết bài

Phương thức search() trong JavaScript là một công cụ hữu ích giúp lập trình viên tìm kiếm và xác định vị trí của chuỗi hoặc mẫu dữ liệu trong văn bản. Với sự hỗ trợ của biểu thức chính quy (RegExp), search() trở nên linh hoạt hơn, cho phép tìm kiếm không phân biệt hoa thường, phát hiện số trong chuỗi, kiểm tra định dạng email, biển số xe, URL, và nhiều ứng dụng khác.

Mặc dù search() có thể giúp tìm vị trí chuỗi nhanh chóng, nhưng cần lưu ý rằng nó chỉ trả về vị trí đầu tiên tìm thấy và không thể trả về tất cả kết quả. Trong một số trường hợp, match() hoặc indexOf() có thể là lựa chọn phù hợp hơn.

Bài viết liên quan

  • 2