大文字と小文字はもう気にしない！JavaScriptで大文字・小文字区別しない検索をマスターしよう

2024-04-06

JavaScript での大文字と小文字を区別しない検索 (Case-insensitive Search)

JavaScript で文字列検索を行う際、デフォルトでは大文字と小文字が区別されます。つまり、「JavaScript」と「javascript」は異なる文字列とみなされます。しかし、場合によっては大小文字を区別せずに検索したいことがあります。

方法

JavaScript で大文字と小文字を区別せずに検索するには、以下の 2 つの方法があります。

String.prototype.toLowerCase() または String.prototype.toUpperCase() メソッドを使う

検索対象の文字列と検索文字列の両方を、すべて小文字またはすべて大文字に変換してから比較します。

const str = "JavaScript";
const searchTerm = "javascript";

// 検索対象の文字列をすべて小文字に変換
const lowerStr = str.toLowerCase();

// 検索文字列をすべて小文字に変換
const lowerSearchTerm = searchTerm.toLowerCase();

// 大小文字を区別せずに検索
console.log(lowerStr.includes(lowerSearchTerm)); // true

RegExp オブジェクトの ignoreCase フラグを設定することで、大文字と小文字を区別せずに検索できます。

const str = "JavaScript";
const searchTerm = "javascript";

// RegExp オブジェクトを作成
const regex = new RegExp(searchTerm, "i");

// 大小文字を区別せずに検索
console.log(regex.test(str)); // true

検索対象の文字列または検索文字列が長い場合、RegExp オブジェクトを使う方が効率的です。

上記の 2 つの方法以外にも、大文字と小文字を区別せずに検索を行う方法はいくつかあります。

ライブラリを使う
自作の関数を使う

JavaScript で大文字と小文字を区別せずに検索するには、いくつかの方法があります。状況に合わせて適切な方法を選びましょう。

String.prototype.toLowerCase() または String.prototype.toUpperCase() メソッドを使う

const str = "JavaScript";
const searchTerm = "javascript";

// 検索対象の文字列をすべて小文字に変換
const lowerStr = str.toLowerCase();

// 検索文字列をすべて小文字に変換
const lowerSearchTerm = searchTerm.toLowerCase();

// 大小文字を区別せずに検索
console.log(lowerStr.includes(lowerSearchTerm)); // true

RegExp オブジェクトを使う

const str = "JavaScript";
const searchTerm = "javascript";

// RegExp オブジェクトを作成
const regex = new RegExp(searchTerm, "i");

// 大小文字を区別せずに検索
console.log(regex.test(str)); // true

// Lodash を使用
const _ = require("lodash");

const str = "JavaScript";
const searchTerm = "javascript";

// 大小文字を区別せずに検索
console.log(_.includes(str.toLowerCase(), searchTerm.toLowerCase())); // true

function caseInsensitiveSearch(str, searchTerm) {
  return str.toLowerCase().includes(searchTerm.toLowerCase());
}

const str = "JavaScript";
const searchTerm = "javascript";

// 大小文字を区別せずに検索
console.log(caseInsensitiveSearch(str, searchTerm)); // true

JavaScript で大文字と小文字を区別せずに検索するその他の方法

String.prototype.localeCompare() メソッドは、ロケールに基づいて文字列を比較します。ロケールを指定することで、大文字と小文字を区別せずに比較することができます。

const str = "JavaScript";
const searchTerm = "javascript";

// ロケールを指定して比較
console.log(str.localeCompare(searchTerm, "en-US", { ignoreCase: true })); // 0

// 0 が返ってきた場合は一致
if (str.localeCompare(searchTerm, "en-US", { ignoreCase: true }) === 0) {
  console.log("一致");
} else {
  console.log("不一致");
}

const str = "JavaScript";
const searchTerm = "javascript";

// 正規表現を使って大文字と小文字を区別せずに検索
const regex = new RegExp(searchTerm, "i");
const match = str.match(regex);

if (match) {
  console.log("一致");
} else {
  console.log("不一致");
}

Lodash などのライブラリには、大文字と小文字を区別せずに検索を行うための関数があります。

// Lodash を使用
const _ = require("lodash");

const str = "JavaScript";
const searchTerm = "javascript";

// 大小文字を区別せずに検索
console.log(_.includes(str, searchTerm, { ignoreCase: true })); // true

以下のコードは、大文字と小文字を区別せずに検索を行う自作関数の例です。

function caseInsensitiveSearch(str, searchTerm) {
  return str.toLowerCase().includes(searchTerm.toLowerCase());
}

const str = "JavaScript";
const searchTerm = "javascript";

// 大小文字を区別せずに検索
console.log(caseInsensitiveSearch(str, searchTerm)); // true