序章

文字列は、文字、数字、または記号で構成される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;
Output
string

2番目の例では、new String()を使用して文字列オブジェクトを作成し、それを変数に割り当てました。

typeof stringObject;
Output
object

ほとんどの場合、文字列プリミティブを作成します。 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];
Output
r

charAt()メソッドを使用して、インデックス番号をパラメーターとして使用して文字を返すこともできます。

"How are you?".charAt(5);
Output
r

または、indexOf()を使用して、文字の最初のインスタンスごとにインデックス番号を返すこともできます。

"How are you?".indexOf("o");
Output
1

「o」はHow are you?文字列に2回表示されますが、indexOf()は最初のインスタンスを取得します。

lastIndexOf()は、最後のインスタンスを見つけるために使用されます。

"How are you?".lastIndexOf("o");
Output
9

これらの方法の両方で、文字列内の複数の文字を検索することもできます。 インスタンスの最初の文字のインデックス番号を返します。

"How are you?".indexOf("are");
Output
4

一方、slice()メソッドは、2つのインデックス番号の間の文字を返します。 最初のパラメーターは開始インデックス番号になり、2番目のパラメーターは終了するインデックス番号になります。

"How are you?".slice(8, 11);
Output
you

11?ですが、?は返される出力の一部ではないことに注意してください。 slice()は、最後のパラメーターの間にあるものを返しますが、これは含まれません。

2番目のパラメーターが含まれていない場合、slice()はパラメーターから文字列の終わりまですべてを返します。

"How are you?".slice(8);
Output
you?

要約すると、charAt()slice()はインデックス番号に基づいて文字列値を返すのに役立ち、indexOf()lastIndexOf()は逆になり、に基づいてインデックス番号を返します。提供された文字列文字。

文字列の長さを見つける

lengthプロパティを使用して、文字列の文字数を返すことができます。

"How are you?".length;
Output
12

lengthプロパティは、0で始まり、 [X192Xで終わる最終的なインデックス番号ではなく、1で始まり12になる実際の文字数を返すことに注意してください。 ]。

大文字または小文字への変換

2つの組み込みメソッドtoUpperCase()toLowerCase()は、JavaScriptでテキストをフォーマットしてテキストを比較するのに役立つ方法です。

toUpperCase()は、すべての文字を大文字に変換します。

"How are you?".toUpperCase();
Output
HOW ARE YOU?

toLowerCase()は、すべての文字を小文字に変換します。

"How are you?".toLowerCase();
Output
how 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];
Output
are

空のパラメーターを指定すると、split()は、文字列内の各文字を含むコンマ区切りの配列を作成します。

文字列を分割することで、文に含まれる単語の数を判別できます。たとえば、このメソッドを使用して、人の名前と姓を判別できます。

空白のトリミング

JavaScript trim()メソッドは、文字列の両端から空白を削除しますが、その間のどこにも削除しません。 空白はタブまたはスペースにすることができます。

const tooMuchWhitespace = "     How are you?     ";

const trimmed = tooMuchWhitespace.trim();

console.log(trimmed);
Output
How 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);
Output
Where 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);
Output
JavaScript is a programming language. I'm learning JavaScript.

これは、正規表現を使用する非常に一般的なタスクです。 Regexr にアクセスして、RegExのその他の例を練習してください。

結論

文字列は最も頻繁に使用されるデータ型の1つであり、文字列を使用して実行できることはたくさんあります。

このチュートリアルでは、文字列プリミティブとStringオブジェクトの違い、文字列のインデックス作成方法、および文字列の組み込みメソッドとプロパティを使用して文字にアクセスし、テキストをフォーマットし、検索と置換を行う方法を学習しました。値。

文字列のより一般的な概要については、チュートリアル「JavaScriptで文字列を操作する方法」をお読みください。