JavaScript の文字列から最初の文字を取得する

Shraddha Paghdar 2023年1月30日
  1. JavaScript で slice() を使用して文字列の最初の文字を取得する
  2. JavaScript で charAt() を使用して文字列の最初の文字を取得する
  3. JavaScript で substring() を使用して文字列の最初の文字を取得する
  4. JavaScript で substr() を使用して文字列の最初の文字を取得する
JavaScript の文字列から最初の文字を取得する

文字列を処理する場合、JavaScript で文字列のデータ構造を操作および操作するのに役立つメソッドがいくつかあります。この記事では、組み込みの JavaScript メソッドを使用して文字列の最初の文字を取得する方法について説明します。

JavaScript では、slicecharAtsubstring、および substr の 4つのメソッドを使用できます。これらのメソッドは、元の文字列を変更せずに新しい文字列を返します。

JavaScript で slice() を使用して文字列の最初の文字を取得する

slice() メソッドは、JavaScript によって提供される組み込みメソッドです。

この方法では、文字列を 2 か所で切断します。このカットは、開始インデックスと終了インデックスの 2つの入力を取得することによって行われます。

そしてそれに基づいて、インデックス間の文字列の部分を返します。開始インデックスのみが指定されている場合は、最後の文字に戻ります。

構文:

slice(beginIndex)
slice(beginIndex, endIndex)

begin および end インデックス内に存在するすべての文字(開始文字と終了前の 1 文字の停止を含む)が新しい文字列に挿入されます。終了インデックスはオプションのパラメーターです。

詳細については、slice() メソッドのドキュメントを参照してください。

const inputString = 'Welcome to JavaScript tutorial';
const outputString1 = inputString.slice(0, 1);
const outputString2 = inputString.slice(4, -2);
console.log(outputString1);
console.log(outputString2);

slice(1, 8) を呼び出すと、文字 W が元の文字列 inputString から outputString1 にコピーされます。ここでの魅力的な部分は、負のインデックスを指定すると、入力パラメーターが str.length + index と見なされることです。

上記のコードは、以下の出力を提供します。

出力:

"W"
"ome to JavaScript tutori"

JavaScript で charAt() を使用して文字列の最初の文字を取得する

このメソッドは、指定されたインデックスに存在する単一の UTF-16 コードユニットを取得します。このメソッドは、元の文字列を変更または変更しません。

構文:

charAt(index)

インデックスに存在する文字はすべて、新しい文字列に挿入されます。インデックスが指定されていない場合、デフォルトで 0 が考慮されます。

詳細については、charAt() メソッドのドキュメントを参照してください。

const inputString = 'Welcome to JavaScript tutorial';
const outputString1 = inputString.charAt(0);
const outputString2 = inputString.charAt(11);
console.log(outputString1);
console.log(outputString2);

charAt(0) を呼び出すと、文字 W が元の文字列 inputString から outputString1 にコピーされます。上記のコードは、以下の出力を提供します。

出力:

"W "
"J"

JavaScript で substring() を使用して文字列の最初の文字を取得する

substring() メソッドは、JavaScript によって提供される組み込みメソッドです。

この方法では、文字列を 2 か所で切断します。このカットは、開始インデックスと終了インデックスの 2つの入力を取得することによって行われます。

そしてそれに基づいて、インデックス間の文字列の部分を返します。開始インデックスのみが指定されている場合は、文字列の終わりを返します。

構文:

substring(indexStart);
substring(indexStart, indexEnd);

start および end インデックス内に存在する文字(開始文字と終了前の 1 文字の停止を含む)は、新しい文字列に挿入されます。終了インデックスはオプションです。

詳細については、substring() メソッドのドキュメントを参照してください。

substring()slice() の唯一の違いは引数にあります。

indexStartindexEnd より大きい場合、substring メソッドは 2つの引数を交換します。つまり、文字列は引き続き返されます。

この場合、slice メソッドは空の文字列を返します。サブストリングメソッドは、いずれかの引数が negative または NaN の場合、両方の引数を 0 として扱います。

slice は NaN 引数も 0 として扱います。ただし、負の値が渡されると、文字列の末尾からカウントダウンしてインデックスが検索されます。

const inputString = 'Hello World!';
const outputString = inputString.substring(0, 1);
console.log(inputString);
console.log(outputString);

substring(0, 1) を呼び出すと、元の文字列 inputString から文字 HoutputString にコピーされます。最後に、console.log() メソッドを使用して両方の文字列を出力します。

上記のコードは、以下の出力を提供します。

出力:

"Hello World!"
"H"

JavaScript で substr() を使用して文字列の最初の文字を取得する

substr() メソッドは、JavaScript によって提供される組み込みメソッドです。

この方法では、文字列を 2 か所で切断します。このカットは、開始インデックスとその後の合計文字数の 2つの入力を取得することによって行われます。

そしてそれに基づいて、インデックスと総数の間の文字列の部分を返します。開始インデックスのみが指定されている場合は、文字列の終わりを返します。

構文:

substr(start);
substr(start, length);

start インデックスと length 内に存在する文字はすべて、新しい文字列に挿入されます。ここでは、長さはオプションのパラメータです。

詳細については、substr() メソッドのドキュメントを参照してください。

substring()substr() の唯一の違いは引数にあります。

substring() メソッドは、開始インデックスと終了インデックスを引数として表します。対照的に、substr() は、引数として返される文字列の開始インデックスと文字数を表します。

const inputString = 'Hello World!';
const outputString1 = inputString.substr(0, 1);
const outputString2 = inputString.substr(1, 0);
console.log(inputString);
console.log(outputString1);
console.log(outputString2);

substr(0, 1) を呼び出すと、元の文字列 inputString から文字 HoutputString1 にコピーされます。ここでの魅力的な部分は、長さが 0 であるため、入力パラメーターを交換しても文字がコピーされないことです。

上記のコードは、以下の出力を提供します。

出力:

"Hello World!"
"H"
""
Shraddha Paghdar avatar Shraddha Paghdar avatar

Shraddha is a JavaScript nerd that utilises it for everything from experimenting to assisting individuals and businesses with day-to-day operations and business growth. She is a writer, chef, and computer programmer. As a senior MEAN/MERN stack developer and project manager with more than 4 years of experience in this sector, she now handles multiple projects. She has been producing technical writing for at least a year and a half. She enjoys coming up with fresh, innovative ideas.

LinkedIn

関連記事 - JavaScript String