前書き

  • string *は、文字、数字、または記号で構成される1つ以上の文字のシーケンスです。 JavaScript文字列の各文字にはインデックス番号でアクセスでき、すべての文字列にはメソッドとプロパティが用意されています。

このチュートリアルでは、文字列プリミティブと `+ String +`オブジェクトの違い、文字列のインデックス方法、文字列内の文字へのアクセス方法、および文字列で使用される一般的なプロパティとメソッドを学習します。

文字列プリミティブと文字列オブジェクト

最初に、2種類の文字列を明確にします。 JavaScriptは、不変のデータ型である* stringプリミティブ*と `+ 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

「+ How are you?」文字列に「o」が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 + で始まり + 11 + `で終わる最終インデックス番号ではなく、1から始まる実際の文字数を12で返すことに注意してください。

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

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

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

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

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

"How are you?".toLowerCase();
Outputhow are you?

これら2つのフォーマット方法は、追加のパラメーターを取りません。

これらのメソッドは元の文字列を変更しないことに注意してください。

文字列の分割

JavaScriptには、文字列を文字で分割し、セクションから新しいhttps://www.digitalocean.com/community/tutorials/understanding-arrays-in-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?

値を別の文字列値に置き換えることができることに加えて、https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions [正規表現]を使用して + 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 +`オブジェクトの違い、文字列のインデックス方法、文字列の組み込みメソッドとプロパティを使用して文字にアクセスし、テキストをフォーマットし、値を検索して置換する方法を学びました。

文字列の一般的な概要については、チュートリアル「https://www.digitalocean.com/community/tutorials/how-to-work-with-strings-in-javascript[JavaScriptで文字列を操作する方法]」を参照してください。