JavaScript文字列

JavaScript 文字列: テキスト操作の基礎

JavaScript において、テキスト情報を扱うための基本的なデータ型が文字列です。ウェブサイトのコンテンツ、ユーザー入力、データベースからの取得データなど、様々な場面で文字列は登場します。

本稿では、JavaScript文字列の基礎から、その操作方法、そして実践的な活用例まで、詳細に解説し、JavaScriptプログラミングにおけるテキスト処理能力向上を目指します。

JavaScript 文字列: 文字の集合を扱う

JavaScriptの文字列は、一連の文字を格納するために使用されます。例えば、"こんにちは、世界！" や "JavaScript" などが文字列です。

文字列の作成: シングルクォート、ダブルクォート、どちらでもOK

JavaScriptでは、シングルクォート (') またはダブルクォート (") で囲むことで、文字列を作成できます。

例

var message1 = "こんにちは、世界！";
var message2 = 'JavaScript';

どちらの記号を使用しても、機能的には変わりません。ただし、文字列の中にシングルクォートやダブルクォートを含める場合は、注意が必要です。

// シングルクォートで囲まれた文字列の中にシングルクォートを含める場合
var message = 'It\'s a beautiful day!';

// ダブルクォートで囲まれた文字列の中にダブルクォートを含める場合
var quote = "彼は「こんにちは」と言った。";

文字へのアクセス: インデックスで位置を指定

文字列内の個々の文字には、0 から始まるインデックス番号を使ってアクセスできます。

例


<p id="demo"></p>

<script>
const name = "RUNOOB";
let letter = name[2]; // インデックス2は3番目の文字

document.getElementById("demo").innerHTML = letter; // "N" が出力される
</script>

文字列の操作: 豊富なメソッドを活用

JavaScriptには、文字列を操作するための様々なメソッドが用意されています。

length プロパティ: 文字列の長さを取得

文字列の長さ（文字数）を取得するには、length プロパティを使用します。

例

var message = "Hello";
var messageLength = message.length; // 5

文字列メソッド: 連結、検索、置換など

メソッド	説明	例
charAt(index)	指定したインデックス位置にある文字を返す。	"Hello".charAt(1) は "e" を返す。
concat(str1, str2, ...)	複数の文字列を連結して、新しい文字列を返す。	"Hello".concat(" ", "World!") は "Hello World!" を返す。
indexOf(searchValue)	文字列の中で、指定した値が最初に出現する位置のインデックスを返す。	"Hello World!".indexOf("World") は 6 を返す。
lastIndexOf(searchValue)	文字列の中で、指定した値が最後に出現する位置のインデックスを返す。	"Hello World!".lastIndexOf("o") は 7 を返す。
slice(startIndex, endIndex)	文字列から一部を切り出して、新しい文字列を返す。	"Hello World!".slice(6, 11) は "World" を返す。
substring(startIndex, endIndex)	slice() と同様だが、負のインデックスは0として扱われる。	"Hello World!".substring(0, 5) は "Hello" を返す。
toLowerCase()	文字列をすべて小文字に変換する。	"Hello".toLowerCase() は "hello" を返す。
toUpperCase()	文字列をすべて大文字に変換する。	"Hello".toUpperCase() は "HELLO" を返す。
trim()	文字列の先頭と末尾にある空白文字を取り除く。	" Hello ".trim() は "Hello" を返す。

特別な文字: エスケープシーケンス

文字列の中に、改行やタブなどの特殊な文字を含める場合は、エスケープシーケンスを使用します。

エスケープシーケンス	説明
\n	改行
\t	水平タブ
\'	シングルクォート
\"	ダブルクォート
\\	バックスラッシュ

文字列はプリミティブ型だが、オブジェクトのように扱える

JavaScriptの文字列は、プリミティブ型ですが、オブジェクトのようにプロパティやメソッドを持つことができます。これは、JavaScriptが文字列を一時的にオブジェクトとして扱ってくれるためです。

まとめ: JavaScriptでテキストを自在に操る

JavaScriptの文字列操作は、ウェブサイトやウェブアプリケーション開発において欠かせないものです。文字列の扱い方を習得することで、より表現力豊かな、インタラクティブなアプリケーションを構築することができます。

JavaScript 文字列: テキスト操作の基礎

JavaScript 文字列: テキスト操作の基礎

JavaScript 文字列: 文字の集合を扱う

文字列の作成: シングルクォート、ダブルクォート、どちらでもOK

文字へのアクセス: インデックスで位置を指定

文字列の操作: 豊富なメソッドを活用

length プロパティ: 文字列の長さを取得

文字列メソッド: 連結、検索、置換など

特別な文字: エスケープシーケンス

文字列はプリミティブ型だが、オブジェクトのように扱える

まとめ: JavaScriptでテキストを自在に操る

関連QA