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」は2回表示されますが How are you? ストリング、 indexOf() 最初のインスタンスを取得します。
lastIndexOf() 最後のインスタンスを見つけるために使用されます。
"How are you?".lastIndexOf("o");
Output9
これらの方法の両方で、文字列内の複数の文字を検索することもできます。 インスタンスの最初の文字のインデックス番号を返します。
"How are you?".indexOf("are");
Output4
The 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 プロパティは、1で始まる実際の文字数を返します。これは、12で始まる最終的なインデックス番号ではなく、12になります。 0 で終了します 11.
大文字または小文字への変換
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?
The 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で文字列を操作する方法」をお読みください。
