JavaScriptで文字列にインデックスを付け、分割し、操作する方法
序章
文字列は、文字、数字、または記号で構成される1つ以上の文字のシーケンスです。 JavaScript文字列の各文字にはインデックス番号でアクセスでき、すべての文字列にはメソッドとプロパティがあります。
このチュートリアルでは、文字列プリミティブとString
オブジェクトの違い、文字列のインデックス作成方法、文字列内の文字へのアクセス方法、および文字列で使用される一般的なプロパティとメソッドについて学習します。
文字列プリミティブと文字列オブジェクト
まず、2種類の文字列を明確にします。 JavaScriptは、不変のデータ型である文字列プリミティブとString
オブジェクトを区別します。
2つの違いをテストするために、文字列プリミティブと文字列オブジェクトを初期化します。
// Initializing a new string primitive const stringPrimitive = "A new string."; // Initializing a new String object const stringObject = new String("A new string.");
typeof
演算子を使用して、値のタイプを判別できます。 最初の例では、変数に文字列を割り当てるだけです。
typeof stringPrimitive;
Outputstring
2番目の例では、new String()
を使用して文字列オブジェクトを作成し、それを変数に割り当てました。
typeof stringObject;
Outputobject
ほとんどの場合、文字列プリミティブを作成します。 JavaScriptは、作成した文字列プリミティブを実際にオブジェクトに変更することなく、String
オブジェクトラッパーの組み込みプロパティとメソッドにアクセスして利用できます。
この概念は最初は少し難しいですが、プリミティブとオブジェクトの違いに注意する必要があります。 基本的に、すべての文字列で使用できるメソッドとプロパティがあり、バックグラウンドでは、JavaScriptは、メソッドまたはプロパティが呼び出されるたびに、オブジェクトへの変換を実行し、プリミティブに戻ります。
文字列のインデックス付け方法
文字列内の各文字は、0
で始まるインデックス番号に対応しています。
実例を示すために、値How are you?
の文字列を作成します。
H | o | w | a | r | e | y | o | u | ? | ||
---|---|---|---|---|---|---|---|---|---|---|---|
0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 |
文字列の最初の文字はH
で、これはインデックス0
に対応します。 最後の文字は?
で、これは11
に対応します。 空白文字には、3
および7
にもインデックスがあります。
文字列内のすべての文字にアクセスできることで、文字列を操作および操作するためのさまざまな方法が提供されます。
キャラクターへのアクセス
How are you?
文字列を使用して文字とインデックスにアクセスする方法を示します。
"How are you?";
角括弧表記を使用して、文字列内の任意の文字にアクセスできます。
"How are you?"[5];
Outputr
charAt()
メソッドを使用して、インデックス番号をパラメーターとして使用して文字を返すこともできます。
"How are you?".charAt(5);
Outputr
または、indexOf()
を使用して、文字の最初のインスタンスごとにインデックス番号を返すこともできます。
"How are you?".indexOf("o");
Output1
「o」はHow are you?
文字列に2回表示されますが、indexOf()
は最初のインスタンスを取得します。
lastIndexOf()
は、最後のインスタンスを見つけるために使用されます。
"How are you?".lastIndexOf("o");
Output9
これらの方法の両方で、文字列内の複数の文字を検索することもできます。 インスタンスの最初の文字のインデックス番号を返します。
"How are you?".indexOf("are");
Output4
一方、slice()
メソッドは、2つのインデックス番号の間の文字を返します。 最初のパラメーターは開始インデックス番号になり、2番目のパラメーターは終了するインデックス番号になります。
"How are you?".slice(8, 11);
Outputyou
11
は?
ですが、?
は返される出力の一部ではないことに注意してください。 slice()
は、最後のパラメーターの間にあるものを返しますが、これは含まれません。
2番目のパラメーターが含まれていない場合、slice()
はパラメーターから文字列の終わりまですべてを返します。
"How are you?".slice(8);
Outputyou?
要約すると、charAt()
とslice()
はインデックス番号に基づいて文字列値を返すのに役立ち、indexOf()
とlastIndexOf()
は逆になり、に基づいてインデックス番号を返します。提供された文字列文字。
文字列の長さを見つける
length
プロパティを使用して、文字列の文字数を返すことができます。
"How are you?".length;
Output12
length
プロパティは、0
で始まり、 [X192Xで終わる最終的なインデックス番号ではなく、1で始まり12になる実際の文字数を返すことに注意してください。 ]。
大文字または小文字への変換
2つの組み込みメソッドtoUpperCase()
とtoLowerCase()
は、JavaScriptでテキストをフォーマットしてテキストを比較するのに役立つ方法です。
toUpperCase()
は、すべての文字を大文字に変換します。
"How are you?".toUpperCase();
OutputHOW ARE YOU?
toLowerCase()
は、すべての文字を小文字に変換します。
"How are you?".toLowerCase();
Outputhow are you?
これらの2つのフォーマット方法は、追加のパラメーターを取りません。
これらのメソッドは元の文字列を変更しないことに注意してください。
文字列の分割
JavaScriptには、文字列を文字で分割し、セクションから新しいarrayを作成するための非常に便利な方法があります。 split()
メソッドを使用して、" "
で表される空白文字で配列を区切ります。
const originalString = "How are you?"; // Split string by whitespace character const splitString = originalString.split(" "); console.log(splitString);
Output[ 'How', 'are', 'you?' ]
splitString
変数に新しい配列ができたので、インデックス番号を使用して各セクションにアクセスできます。
splitString[1];
Outputare
空のパラメーターを指定すると、split()
は、文字列内の各文字を含むコンマ区切りの配列を作成します。
文字列を分割することで、文に含まれる単語の数を判別できます。たとえば、このメソッドを使用して、人の名前と姓を判別できます。
空白のトリミング
JavaScript trim()
メソッドは、文字列の両端から空白を削除しますが、その間のどこにも削除しません。 空白はタブまたはスペースにすることができます。
const tooMuchWhitespace = " How are you? "; const trimmed = tooMuchWhitespace.trim(); console.log(trimmed);
OutputHow are you?
trim()
メソッドは、余分な空白を削除するという一般的なタスクを実行する簡単な方法です。
文字列値の検索と置換
文字列で値を検索し、replace()
メソッドを使用して新しい値に置き換えることができます。 最初のパラメーターは検出される値になり、2番目のパラメーターはそれを置き換える値になります。
const originalString = "How are you?" // Replace the first instance of "How" with "Where" const newString = originalString.replace("How", "Where"); console.log(newString);
OutputWhere are you?
値を別の文字列値に置き換えることができることに加えて、正規表現を使用してreplace()
をより強力にすることもできます。 たとえば、replace()
は最初の値にのみ影響しますが、g
(グローバル)フラグを使用して値のすべてのインスタンスをキャッチでき、i
(大文字と小文字は区別されません)大文字と小文字を無視するフラグ。
const originalString = "Javascript is a programming language. I'm learning javascript." // Search string for "javascript" and replace with "JavaScript" const newString = originalString.replace(/javascript/gi, "JavaScript"); console.log(newString);
OutputJavaScript is a programming language. I'm learning JavaScript.
これは、正規表現を使用する非常に一般的なタスクです。 Regexr にアクセスして、RegExのその他の例を練習してください。
結論
文字列は最も頻繁に使用されるデータ型の1つであり、文字列を使用して実行できることはたくさんあります。
このチュートリアルでは、文字列プリミティブとString
オブジェクトの違い、文字列のインデックス作成方法、および文字列の組み込みメソッドとプロパティを使用して文字にアクセスし、テキストをフォーマットし、検索と置換を行う方法を学習しました。値。
文字列のより一般的な概要については、チュートリアル「JavaScriptで文字列を操作する方法」をお読みください。