JavaScript 文字列メソッド
基本的な文字列メソッドについて説明します。JavaScriptの文字列はプリミティブであり、イミュータブルです。すべての文字列メソッドは元の文字列を変更せず、新しい文字列を生成します。
目次
文字列の長さ
lengthプロパティは文字列の長さを返します:
let text = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
let length = text.length;
文字の抽出
文字を抽出するための4つのメソッドがあります:
at()メソッドcharAt()メソッドcharCodeAt()メソッド- 配列と同様にプロパティアクセス
[]
charAt() メソッド
charAt() メソッドは指定したインデックス(位置)の文字を返します:
let text = "HELLO WORLD";
let char = text.charAt(0);
charCodeAt() メソッド
charCodeAt() メソッドは指定したインデックスの文字のUTF-16コードを返します:
let text = "HELLO WORLD";
let char = text.charCodeAt(0);
at() メソッド
ES2022で追加されたat() メソッドの使用例:
const name = "W3Schools";
let letter = name.at(2);
at() メソッドは指定したインデックス(位置)の文字を返します。
ヒント: at() メソッドは2022年3月以降のすべての現代ブラウザでサポートされています。
プロパティアクセス []
例:
let text = "HELLO WORLD";
let char = text[0];
プロパティアクセスは予測可能性が少し低い場合があります:
- 文字列を配列のように見せますが(実際には配列ではありません)
- 文字が見つからない場合、
[]はundefinedを返し、charAt()は空の文字列を返します。 - 読み取り専用です。
str[0] = "A"はエラーを発生させませんが、機能しません!
文字列の一部の抽出
文字列の一部を抽出するための3つのメソッドがあります:
slice(start, end)substring(start, end)substr(start, length)
slice() メソッド
slice() メソッドは文字列の一部を抽出して新しい文字列として返します:
let text = "Apple, Banana, Kiwi";
let part = text.slice(7, 13);
ヒント: マイナスのパラメータを使用すると、文字列の末尾からの位置を指定できます。
substring() メソッド
substring() メソッドもslice() と似ていますが、負の値が指定された場合は0として扱います:
let str = "Apple, Banana, Kiwi";
let part = str.substring(7, 13);
substr() メソッド
substr() メソッドはslice() と似ていますが、2番目のパラメータは抽出する部分の長さを指定します:
let str = "Apple, Banana, Kiwi";
let part = str.substr(7, 6);
大文字と小文字への変換
大文字に変換するには toUpperCase() メソッドを使用します:
let text1 = "Hello World!";
let text2 = text1.toUpperCase();
小文字に変換するには toLowerCase() メソッドを使用します:
let text1 = "Hello World!";
let text2 = text1.toLowerCase();
文字列の結合
concat() メソッドは2つ以上の文字列を結合します:
let text1 = "Hello";
let text2 = "World";
let text3 = text1.concat(" ", text2);
concat() メソッドはプラス演算子の代わりに使用することもできます。
空白の削除
trim() メソッドは文字列の両端から空白を削除します:
let text1 = " Hello World! ";
let text2 = text1.trim();
先頭の空白の削除
trimStart() メソッドは文字列の先頭からの空白を削除します:
let text1 = " Hello World! ";
let text2 = text1.trimStart();
ヒント: trimStart() メソッドは2020年1月以降のすべての現代ブラウザでサポートされています。
末尾の空白の削除
trimEnd() メソッドは文字列の末尾からの空白を削除します:
let text1 = " Hello World! ";
let text2 = text1.trimEnd();
ヒント: trimEnd() メソッドは2020年1月以降のすべての現代ブラウザでサポートされています。
文字列のパディング
ECMAScript 2017には、文字列の先頭および末尾にパディングするためのpadStart() および padEnd() という2つの新しい文字列メソッドが追加されました。
padStart() メソッド
padStart() メソッドは文字列の先頭からパディングします。
let text = "5";
let padded = text.padStart(4, "0");
ヒント: padStart() メソッドは2017年9月以降のすべての現代ブラウザでサポートされています。
padEnd() メソッド
padEnd() メソッドは文字列の末尾からパディングします。
let text = "5";
let padded = text.padEnd(4, "0");
ヒント: padEnd() メソッドは2017年9月以降のすべての現代ブラウザでサポートされています。
文字列の繰り返し
repeat() メソッドは指定された回数分、文字列を繰り返して新しい文字列を返します。
let text = "Hello world!";
let result = text.repeat(2);
ヒント: repeat() メソッドは2017年6月以降のすべての現代ブラウザでサポートされています。
文字列の置換
replace() メソッドは文字列内の指定された値を別の値に置換します。
let text = "Please visit Microsoft!";
let newText = text.replace("Microsoft", "W3Schools");
ヒント: replace() メソッドは最初の一致のみを置換します。すべての一致を置換するには正規表現と /g フラグを使用します。
JavaScript 2021での置換の改善
JavaScript 2021では、replaceAll() メソッドが導入されました:
text = text.replaceAll("Cats", "Dogs");
replaceAll() メソッドは正規表現を指定できますが、グローバルフラグ(g)が必要です。さもなければ TypeError がスローされます。
文字列の配列への変換
文字列を配列として扱うには、split() メソッドを使用します:
text.split(",") // カンマで分割
text.split(" ") // スペースで分割
text.split("|") // パイプで分割
区切り文字が省略された場合、戻り値の配列には文字列全体がインデックス [0] に含まれます。
text.split("")