Text formatting

by 1 contributor:

This article is in need of an editorial review.

This translation is incomplete. Please help translate this article from English.

この章では、JavaScriptで文字列やテキストを操作する方法を紹介します。

Strings

JavaScriptの String 型はテキストデータを表すために使用されます。16ビット符号なし整数値の"elements"の集合です。文字列の各要素は、文字列内の位置を占めています。最初の要素のインデックスは0で、次の要素のインデックスは1で、等々。 Stringの長さは要素の数です。文字列リテラルか文字列オブジェクトを使用して文字列を生成できます。

文字列リテラル

単一引用符または二重引用符のいずれかを使用して、単純な文字列を作成することができます:

'foo'
"bar"

より高度な文字列は、エスケープシーケンスを使用して作成することができます。:

16進数エスケープシーケンス

\xの後の数値は16進数として解釈されます。

'\xA9' // "©"

Unicodeエスケープシーケンス

Unicodeエスケープシーケンスは\uに続く少なくとも4文字の文字を必要とします。

'\u00A9' // "©"

Unicodeコードポイントエスケープ

ECMAScript第6版で新しくサポートされました。Unicodeコードポイントエスケープを用いて、どんな文字でも16進数を使用してエスケープされます。そのため、0x10FFFFまでUnicodeコードポイントを使用できます。簡単なUnicodeエスケープを使用して、同じことを達成するために、別途サロゲートの半分を記述することがしばしば必要です。

また、String.fromCodePoint() または String.prototype.codePointAt()もご覧ください。

'\u{2F804}'

// the same with simple Unicode escapes
'\uD87E\uDC04'

String オブジェクト

Stringオブジェクトは文字列プリミティブデータ型のラッパです。

var s = new String("foo"); // Creates a String object
console.log(s); // Displays: { '0': 'f', '1': 'o', '2': 'o'}
typeof s; // Returns 'object'

文字列リテラル値上のStringオブジェクトのメソッドのいずれかを呼ぶことができます。— JavaScriptは自動的に文字列リテラルを一時的なStringオブジェクトに変換し、メソッドを呼び、一時的なStringオブジェクトを破棄します。 文字列リテラルとともにString.lengthプロパティを使用できます。

あなたが具体的にStringオブジェクトを使用する必要がない限り、文字列リテラルを使用する必要があります。というのも、 String オブジェクトは直感的でない振る舞いを持つからです。例えば:

var s1 = "2 + 2"; // Creates a string literal value
var s2 = new String("2 + 2"); // Creates a String object
eval(s1); // Returns the number 4
eval(s2); // Returns the string "2 + 2"

String オブジェクトは一つプロパティlengthを持ちます。それは、文字列内の文字数を示します。例えば、次のコードでは、"Hello, World!"が13文字ですから、xに値13が代入されます。:

var mystring = "Hello, World!";
var x = mystring.length;

String オブジェクトはさまざまなメソッドを持っています: 例えば、substringtoUpperCaseのような文字列自体のバリエーションを返すメソッドがあります。

次の表はStringオブジェクトのメソッドをまとめたものです。

Stringのメソッド

メソッド 説明
charAtcharCodeAtcodePointAt 文字列内の指定された位置の文字または文字コードを返します。
indexOf, lastIndexOf それぞれ、文字列内に指定された部分文字列の位置または指定された部分文字列の最後の位置を返します。
startsWith, endsWith, includes 文字列が指定された文字列で始まるか、終わるか、含むかどうかを返します。
concat 二つの文字列のテキストをつなげて、新しい文字列を返します。
fromCharCode, fromCodePoint Unicode値の指定されたシーケンスから文字列を構築します。これは、Stringインスタンスではなく、Stringクラスのメソッドです。
split 文字列を部分文字列に分割することによって、Stringオブジェクトを文字列の配列に分割します。
slice 文字列の一部分を取り出し、新しい文字列を返します。
substring, substr 開始インデックスと終了インデックス、または、開始インデックスと長さのどちらかを指定することによって、文字列の指定したサブセットを返します。
match, replace, search 正規表現で動作します。
toLowerCase, toUpperCase

それぞれ、すべて小文字またはすべて大文字にした文字列を返します。

normalize 呼び出す文字列の値のUnicodeの正規化形式を返します。
repeat オブジェクトの要素からなる文字列を、指定された回繰り返し返します。
trim 文字列の先頭と末尾から空白をトリムします。

マルチラインテンプレート文字列

Template stringsは埋め込み式を許可する文字列リテラルです。複数行の文字列と文字列の補間機能を使用することができます。

テンプレート文字列は二重引用符または一重引用符のかわりにバックティック(` `)(grave accent)文字で囲まれています。テンプレート文字列はプレースホルダを含めることができます。これらは、ドル記号と波括弧(${expression})で示されています。

マルチライン

ソースに挿入された改行文字は、テンプレート文字列の一部です。通常の文字列を使用して、複数行の文字列を取得するために、次の構文を使用する必要があります:

console.log("string text line 1\n\
string text line 2");
// "string text line 1
// string text line 2"

複数行の文字列と同じ効果を得るには、今下記のように書くことができます:

console.log(`string text line 1
string text line 2`);
// "string text line 1
// string text line 2"

組み込み式

通常の文字列内の式を埋め込むためには、次の構文を使用します:

var a = 5;
var b = 10;
console.log("Fifteen is " + (a + b) + " and\nnot " + (2 * a + b) + ".");
// "Fifteen is 15 and
// not 20."

さて、テンプレートの文字列で、この読みやすいように置換するシンタックスシュガーを利用することができます。:

var a = 5;
var b = 10;
console.log(`Fifteen is ${a + b} and\nnot ${2 * a + b}.`);
// "Fifteen is 15 and
// not 20."

詳細については、JavaScript reference内のTemplate stringsをご覧ください。

国際化

Intl オブジェクトはECMAScript国際化APIに対するネームスペースです。それは、言語に依存した文字列の比較、数値フォーマット、日時フォーマットを提供します。CollatorNumberFormatDateTimeFormatオブジェクトに対するコンストラクタはIntlオブジェクトのプロパティです。

日時フォーマット

DateTimeFormat オブジェクトは日時をフォーマットするのに有用です。次の例では、アメリカ合衆国で使用されるものとして日付を英語のフォーマットにします。(結果は別のタイムゾーンで異なります。)

var msPerDay = 24 * 60 * 60 * 1000;
 
// July 17, 2014 00:00:00 UTC.
var july172014 = new Date(msPerDay * (44 * 365 + 11 + 197));

var options = { year: "2-digit", month: "2-digit", day: "2-digit",
                hour: "2-digit", minute: "2-digit", timeZoneName: "short" };
var americanDateTime = new Intl.DateTimeFormat("en-US", options).format;
 
console.log(americanDateTime(july172014)); // 07/16/14, 5:00 PM PDT

数値フォーマット

NumberFormat オブジェクトは数値、例えば通貨をフォーマットするのに有用です。

var gasPrice = new Intl.NumberFormat("en-US",
                        { style: "currency", currency: "USD",
                          minimumFractionDigits: 3 });
 
console.log(gasPrice.format(5.259)); // $5.259

var hanDecimalRMBInChina = new Intl.NumberFormat("zh-CN-u-nu-hanidec",
                        { style: "currency", currency: "CNY" });
 
console.log(hanDecimalRMBInChina.format(1314.25)); // ¥ 一,三一四.二五

照合

Collator オブジェクトは文字列を比較しソートするのに有用です。

例えば、ドイツ語で二つの異なるソート順 phonebookdictionaryが、実際に存在します。。 Phonebook ソートは音を強調し、ソートする前に“ä”、“ö”などと同様に“ae”、“oe”などに拡張されます。

var names = ["Hochberg", "Hönigswald", "Holzman"];
 
var germanPhonebook = new Intl.Collator("de-DE-u-co-phonebk");
 
// as if sorting ["Hochberg", "Hoenigswald", "Holzman"]:
console.log(names.sort(germanPhonebook.compare).join(", "));
// logs "Hochberg, Hönigswald, Holzman"

いくつかのドイツ語の単語は、余分なウムラウトと共役します。だから、辞書では、(ウムラウトによってのみ異なる単語を命じる場合を除き:schönの前にschon)ウムラウトを無視して命じるのは賢明です。

var germanDictionary = new Intl.Collator("de-DE-u-co-dict");
 
// as if sorting ["Hochberg", "Honigswald", "Holzman"]:
console.log(names.sort(germanDictionary.compare).join(", "));
// logs "Hochberg, Holzman, Hönigswald"

IntlAPIの詳細については、Introducing the JavaScript Internationalization APIもご覧ください。

正規表現

Regular expressionsは文字列内の文字の組み合わせを一致させるために使用されるパターンです。それらは強力で複雑にすることができ、独自の章で説明されています。下記で正規表現についてもっと分かります:

ドキュメントのタグと貢献者

タグ: 
Contributors to this page: shide55
最終更新者: shide55,
サイドバーを隠す