diff options
Diffstat (limited to 'files/ja/web/javascript/reference/global_objects/string')
53 files changed, 6140 insertions, 0 deletions
diff --git a/files/ja/web/javascript/reference/global_objects/string/@@iterator/index.html b/files/ja/web/javascript/reference/global_objects/string/@@iterator/index.html new file mode 100644 index 0000000000..23cab0baec --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/@@iterator/index.html @@ -0,0 +1,82 @@ +--- +title: 'String.prototype[@@iterator]()' +slug: Web/JavaScript/Reference/Global_Objects/String/@@iterator +tags: + - ECMAScript 2015 + - Iterator + - JavaScript + - Method + - Prototype + - Reference + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/@@iterator +--- +<div>{{JSRef}}</div> + +<p><strong><code>[@@iterator]()</code></strong> メソッドは、文字列値のコードポイントを走査し、それぞれのコードポイントを文字列値として返すイテレーターオブジェクトを返します。</p> + +<div>{{EmbedInteractiveExample("pages/js/string-iterator.html")}}</div> + +<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox notranslate"><var>str</var>[Symbol.iterator]</pre> + +<h3 id="Return_value" name="Return_value">返値</h3> + +<p>新しいイテレーターオブジェクトです。</p> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Using_iterator" name="Using_iterator">[@@iterator]() の使用</h3> + +<pre class="brush:js notranslate">var str = 'A\uD835\uDC68'; + +var strIter = str[Symbol.iterator](); + +console.log(strIter.next().value); // "A" +console.log(strIter.next().value); // "\uD835\uDC68" +</pre> + +<h3 id="Using_iterator_with_for..of" name="Using_iterator_with_for..of">[@@iterator]() と for..of の使用</h3> + +<pre class="brush:js notranslate">var str = 'A\uD835\uDC68B\uD835\uDC69C\uD835\uDC6A'; + +for (var v of str) { + console.log(v); +} +// "A" +// "\uD835\uDC68" +// "B" +// "\uD835\uDC69" +// "C" +// "\uD835\uDC6A" +</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype-@@iterator', 'String.prototype[@@iterator]()')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.String.@@iterator")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li><a href="/ja/docs/Web/JavaScript/Reference/Iteration_protocols">反復プロトコル</a></li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/anchor/index.html b/files/ja/web/javascript/reference/global_objects/string/anchor/index.html new file mode 100644 index 0000000000..b64cfb7f0a --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/anchor/index.html @@ -0,0 +1,80 @@ +--- +title: String.prototype.anchor() +slug: Web/JavaScript/Reference/Global_Objects/String/anchor +tags: + - Deprecated + - HTML wrapper methods + - JavaScript + - Method + - Prototype + - Reference + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/anchor +--- +<div>{{JSRef}} {{deprecated_header}}</div> + +<p><strong><code>anchor()</code></strong> メソッドは、 <code><a name="..."></code> 開始タグで始まり、いくらかのテキストが続き、 <code></a></code> 終了タグで終わる文字列を生成します。</p> + +<div class="blockIndicator warning"> +<p>このメソッドを使用しないでください。代わりに <a href="/ja/docs/Web/API/Document_Object_Model">DOM API</a> を使用してください。また、 HTML 仕様書では {{HTMLElement("a")}} 要素に <code>name</code> 属性を設定することを許容しなくなりましたので、このメソッドが生成するものは妥当なマークアップにもなりません。</p> +</div> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox notranslate"><var>str</var>.anchor(<var>name</var>)</pre> + +<h3 id="Parameters" name="Parameters">引数</h3> + +<dl> + <dt><code><var>name</var></code></dt> + <dd><code>name</code> 値を表す文字列で、 <code><a name="..."></code> 開始タグに入れられます。</dd> +</dl> + +<h3 id="Return_value" name="Return_value">返値</h3> + +<p><code><a name="<var>name</var>"></code> 開始タグで始まり、 <var>str</var> のテキストが続き、 <code></a></code> 終了タグで終わる文字列です。</p> + +<h2 id="Description" name="Description">解説</h2> + +<p>このメソッドを使用しないでください。代わりに <a href="/ja/docs/Web/API/Document_Object_Model">DOM API</a> を使用してください。また、 HTML 仕様書では {{HTMLElement("a")}} 要素に <code>name</code> 属性を設定することを許容しなくなりましたので、このメソッドが生成するものは妥当なマークアップにもなりません。</p> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Using_anchor" name="Using_anchor">anchor() の使用</h3> + +<pre class="brush: js notranslate">var myString = 'Table of Contents'; + +document.body.innerHTML = myString.anchor('contents_anchor'); +</pre> + +<p>以下の HTML が生成されます。</p> + +<pre class="brush: html notranslate"><a name="contents_anchor">Table of Contents</a> +</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.anchor', 'String.prototype.anchor')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.String.anchor")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("String.prototype.link()")}}</li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/big/index.html b/files/ja/web/javascript/reference/global_objects/string/big/index.html new file mode 100644 index 0000000000..2d7d0c816d --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/big/index.html @@ -0,0 +1,78 @@ +--- +title: String.prototype.big() +slug: Web/JavaScript/Reference/Global_Objects/String/big +tags: + - Deprecated + - HTML wrapper methods + - JavaScript + - Method + - Prototype + - Reference + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/big +--- +<div>{{JSRef}} {{deprecated_header}}</div> + +<p><strong><code>big()</code></strong> メソッドは、文字列が大きなフォントで表示されるように HTML の {{HTMLElement("big")}} 要素を生成します。</p> + +<div class="note"> +<p><strong>使用上の注意:</strong> <big> 要素は <a href="/ja/docs/Web/Guide/HTML/HTML5">HTML5</a> で廃止されており、今後使用するべきではありません。代わりにウェブ開発者は <a href="/ja/docs/Web/CSS">CSS</a> プロパティを使用してください。</p> +</div> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox notranslate"><var>str</var>.big()</pre> + +<h3 id="Return_value" name="Return_value">返値</h3> + +<p>HTML の {{HTMLElement("big")}} 要素を含む文字列です。</p> + +<h2 id="Description" name="Description">解説</h2> + +<p><code>big()</code> メソッドは、文字列を <code><big></code> 要素の中に、 "<code><big>str</big></code>" のように埋め込みます。</p> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="big_の使用">big() の使用</h3> + +<p>以下の例では文字列のメソッドを使用して、文字列の大きさを変更しています。</p> + +<pre class="brush: js notranslate">var worldString = 'Hello, world'; + +console.log(worldString.small()); // <small>Hello, world</small> +console.log(worldString.big()); // <big>Hello, world</big> +console.log(worldString.fontsize(7)); // <fontsize=7>Hello, world</fontsize> +</pre> + +<p>{{domxref("ElementCSSInlineStyle/style", "element.style")}} オブジェクトを使用すると、要素の <code>style</code> 属性を使用して、次のようにもっと汎用的に操作することができます。</p> + +<pre class="brush: js notranslate">document.getElementById('yourElemId').style.fontSize = '2em'; +</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.big', 'String.prototype.big')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.String.big")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("String.prototype.fontsize()")}}</li> + <li>{{jsxref("String.prototype.small()")}}</li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/blink/index.html b/files/ja/web/javascript/reference/global_objects/string/blink/index.html new file mode 100644 index 0000000000..129a8c764f --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/blink/index.html @@ -0,0 +1,74 @@ +--- +title: String.prototype.blink() +slug: Web/JavaScript/Reference/Global_Objects/String/blink +tags: + - Deprecated + - HTML wrapper methods + - JavaScript + - Method + - Prototype + - Reference + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/blink +--- +<div>{{JSRef}} {{deprecated_header}}</div> + +<p><strong><code>blink()</code></strong> メソッドは、文字列を点滅させる HTML の {{HTMLElement("blink")}} 要素を生成します。</p> + +<div class="warning"> +<p><strong>警告:</strong> 文字列の点滅はアクセシビリティの観点から好ましくありません。また、<code><blink></code> 要素は非標準であり非推奨です!</p> +</div> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox notranslate"><var>str</var>.blink()</pre> + +<h3 id="Return_value" name="Return_value">返値</h3> + +<p>HTML の {{HTMLElement("blink")}} 要素を含む文字列です。</p> + +<h2 id="Description" name="Description">解説</h2> + +<p><code>blink()</code> メソッドは、文字列を <code><blink></code> 要素の中に、 "<code><blink>str</blink></code>" のように埋め込みます。</p> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Using_blink" name="Using_blink">blink() の使用</h3> + +<p>以下の例では文字列のメソッドを使用して、文字列の整形方法を変化させています。</p> + +<pre class="brush: js notranslate">var worldString = 'Hello, world'; + +console.log(worldString.blink()); // <blink>Hello, world</blink> +console.log(worldString.bold()); // <b>Hello, world</b> +console.log(worldString.italics()); // <i>Hello, world</i> +console.log(worldString.strike()); // <strike>Hello, world</strike></pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.blink', 'String.prototype.blink')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.String.blink")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("String.prototype.bold()")}}</li> + <li>{{jsxref("String.prototype.italics()")}}</li> + <li>{{jsxref("String.prototype.strike()")}}</li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/bold/index.html b/files/ja/web/javascript/reference/global_objects/string/bold/index.html new file mode 100644 index 0000000000..c916d60ea0 --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/bold/index.html @@ -0,0 +1,70 @@ +--- +title: String.prototype.bold() +slug: Web/JavaScript/Reference/Global_Objects/String/bold +tags: + - Deprecated + - HTML wrapper methods + - JavaScript + - Method + - Prototype + - Reference + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/bold +--- +<div>{{JSRef}} {{deprecated_header}}</div> + +<p><strong><code>bold()</code></strong> メソッドは、文字列を太字で表示させる HTML の {{HTMLElement("b")}} 要素を生成します。</p> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox notranslate"><var>str</var>.bold()</pre> + +<h3 id="Return_value" name="Return_value">返値</h3> + +<p>HTML の {{HTMLElement("b")}} 要素を含む文字列です。</p> + +<h2 id="Description" name="Description">解説</h2> + +<p><code>bold()</code> メソッドは、文字列を <code><b></code> 要素の中に、 "<code><b>str</b></code>" のように埋め込みます。</p> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Using_bold" name="Using_bold">bold() の使用</h3> + +<p>下記の例は、 <code>fixed</code> メソッドを使用して文字列の表示方法を変更します。</p> + +<pre class="brush: js notranslate">var worldString = 'Hello, world'; + +console.log(worldString.blink()); // <blink>Hello, world</blink> +console.log(worldString.bold()); // <b>Hello, world</b> +console.log(worldString.italics()); // <i>Hello, world</i> +console.log(worldString.strike()); // <strike>Hello, world</strike></pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.bold', 'String.prototype.bold')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.String.bold")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("String.prototype.blink()")}}</li> + <li>{{jsxref("String.prototype.italics()")}}</li> + <li>{{jsxref("String.prototype.strike()")}}</li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/charat/index.html b/files/ja/web/javascript/reference/global_objects/string/charat/index.html new file mode 100644 index 0000000000..30d708cad3 --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/charat/index.html @@ -0,0 +1,244 @@ +--- +title: String.prototype.charAt() +slug: Web/JavaScript/Reference/Global_Objects/String/charAt +tags: + - JavaScript + - Method + - Reference + - String + - String Methods +translation_of: Web/JavaScript/Reference/Global_Objects/String/charAt +--- +<div>{{JSRef}}</div> + +<p><span class="seoSummary">{{jsxref("String")}} オブジェクトの <strong><code>charAt()</code></strong> メソッドは、文字列の中の指定された位置にある単一の UTF-16 コードユニットからなる新しい文字列を返します。</span></p> + +<div>{{EmbedInteractiveExample("pages/js/string-charat.html", "shorter")}}</div> + +<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox notranslate">let <var>character</var> = <var>str</var>.charAt(<var>index</var>)</pre> + +<h3 id="Parameters" name="Parameters">引数</h3> + +<dl> + <dt><code><var>index</var></code></dt> + <dd><code>0</code> から <code><var>str</var>.length - 1</code> までの間の整数です。 <code><var>index</var></code> が整数に変換できない場合や <code><var>index</var></code> が指定されなかった場合、既定値は <code>0</code> となり、 <code><var>str</var></code> の最初の文字が返されます。</dd> +</dl> + +<h3 id="Return_value" name="Return_value">返値</h3> + +<p>与えられた <code><var>index</var></code> の位置にあるコードポイント値を表す数値です。 <code><var>index</var></code> の位置に要素がない場合は {{jsxref("Global_Objects/NaN", "NaN")}} を返します。</p> + +<h2 id="Description" name="Description">解説</h2> + +<p>文字列の中の文字は、左から右に向けてインデックス付けされています。最初の文字の添字は <code>0</code> であり、最後の文字の添字は— <code><var>stringName</var></code> という名前の文字列であれば— <code><var>stringName</var>.length - 1</code> です。提供した <code><var>index</var></code> がこの範囲を外れていた場合、 JavaScript は空文字列を返します。</p> + +<p><code><var>index</var></code> が <code>charAt()</code> に提供されなかった場合の既定値は <code>0</code> です。</p> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Displaying_characters_at_different_locations_in_a_string" name="Displaying_characters_at_different_locations_in_a_string">文字列の中の様々な位置の文字の表示</h3> + +<p>次の例は、 "<code>Brave new world</code>" という文字列の中の様々な位置の文字を表示します。</p> + +<pre class="brush: js notranslate">var anyString = 'Brave new world'; +console.log("The character at index 0 is '" + anyString.charAt() + "'"); +// index が提供されなかった場合は、既定値として 0 が使われる + +console.log("The character at index 0 is '" + anyString.charAt(0) + "'"); +console.log("The character at index 1 is '" + anyString.charAt(1) + "'"); +console.log("The character at index 2 is '" + anyString.charAt(2) + "'"); +console.log("The character at index 3 is '" + anyString.charAt(3) + "'"); +console.log("The character at index 4 is '" + anyString.charAt(4) + "'"); +console.log("The character at index 999 is '" + anyString.charAt(999) + "'"); +</pre> + +<p>これらの行は以下のように表示されます。</p> + +<pre class="brush: js notranslate">The character at index 0 is 'B' + +The character at index 0 is 'B' +The character at index 1 is 'r' +The character at index 2 is 'a' +The character at index 3 is 'v' +The character at index 4 is 'e' +The character at index 999 is '' +</pre> + +<h3 id="Getting_whole_characters" name="Getting_whole_characters">文字全体の取得</h3> + +<p>以下の例では、文字列に基本多言語面にない文字が含まれていた場合でも、ループで常に文字全体を取得することを保証する方法を紹介します。</p> + +<pre class="brush: js notranslate">var str = 'A \uD87E\uDC04 Z'; // We could also use a non-BMP character directly +for (var i = 0, chr; i < str.length; i++) { + if ((chr = getWholeChar(str, i)) === false) { + continue; + } + // Adapt this line at the top of each loop, passing in the whole string and + // the current iteration and returning a variable to represent the + // individual character + + console.log(chr); +} + +function getWholeChar(str, i) { + var code = str.charCodeAt(i); + + if (Number.isNaN(code)) { + return ''; // Position not found + } + if (code < 0xD800 || code > 0xDFFF) { + return str.charAt(i); + } + + // High surrogate (could change last hex to 0xDB7F to treat high private + // surrogates as single characters) + if (0xD800 <= code && code <= 0xDBFF) { + if (str.length <= (i + 1)) { + throw 'High surrogate without following low surrogate'; + } + var next = str.charCodeAt(i + 1); + if (0xDC00 > next || next > 0xDFFF) { + throw 'High surrogate without following low surrogate'; + } + return str.charAt(i) + str.charAt(i + 1); + } + // Low surrogate (0xDC00 <= code && code <= 0xDFFF) + if (i === 0) { + throw 'Low surrogate without preceding high surrogate'; + } + var prev = str.charCodeAt(i - 1); + + // (could change last hex to 0xDB7F to treat high private + // surrogates as single characters) + if (0xD800 > prev || prev > 0xDBFF) { + throw 'Low surrogate without preceding high surrogate'; + } + // We can pass over low surrogates now as the second component + // in a pair which we have already processed + return false; +} +</pre> + +<p>ECMAScript 2016 環境では分割代入が利用できるため、変数を自動的に増加させることができるもっと簡潔で柔軟な代替案を利用することができます (その文字がサロゲートペアであることを保証している場合)。</p> + +<pre class="brush: js notranslate">let str = 'A\uD87E\uDC04Z' // We could also use a non-BMP character directly +for (let i = 0, chr; i < str.length; i++) { + [chr, i] = getWholeCharAndI(str, i) + + // Adapt this line at the top of each loop, passing in the whole string and + // the current iteration and returning an array with the individual character + // and 'i' value (only changed if a surrogate pair) + + console.log(chr) +} + +function getWholeCharAndI(str, i) { + let code = str.charCodeAt(i) + + if (Number.isNaN(code)) { + return '' // Position not found + } + if (code < 0xD800 || code > 0xDFFF) { + return [str.charAt(i), i] // Normal character, keeping 'i' the same + } + + // High surrogate (could change last hex to 0xDB7F to treat high private + // surrogates as single characters) + if (0xD800 <= code && code <= 0xDBFF) { + if (str.length <= (i + 1)) { + throw 'High surrogate without following low surrogate' + } + let next = str.charCodeAt(i + 1) + if (0xDC00 > next || next > 0xDFFF) { + throw 'High surrogate without following low surrogate' + } + return [str.charAt(i) + str.charAt(i + 1), i + 1] + } + + // Low surrogate (0xDC00 <= code && code <= 0xDFFF) + if (i === 0) { + throw 'Low surrogate without preceding high surrogate' + } + + let prev = str.charCodeAt(i - 1) + + // (could change last hex to 0xDB7F to treat high private surrogates + // as single characters) + if (0xD800 > prev || prev > 0xDBFF) { + throw 'Low surrogate without preceding high surrogate' + } + + // Return the next character instead (and increment) + return [str.charAt(i + 1), i + 1] +} +</pre> + +<h3 id="Fixing_charAt_to_support_non-Basic-Multilingual-Plane_BMP_characters" name="Fixing_charAt_to_support_non-Basic-Multilingual-Plane_BMP_characters">charAt() を修正して、基本多言語面 (BMP) 以外の文字に対応させる</h3> + +<p>前述の例は、 BMP 以外の文字に対応しなければならないプログラムの方が有用かもしれませんが (呼び出し元が BMP 以外の文字の出現場所を知る必要がないので)、インデックスで文字を選択する際に、文字列内のサロゲートペアをそれらが表す単一の文字として扱いたい場合には、以下のようにして使用できます。</p> + +<pre class="brush: js notranslate">function fixedCharAt(str, idx) { + let ret = '' + str += '' + let end = str.length + + let surrogatePairs = /[\uD800-\uDBFF][\uDC00-\uDFFF]/g + while ((surrogatePairs.exec(str)) != null) { + let lastIdx = surrogatePairs.lastIndex + if (lastIdx - 2 < idx) { + idx++ + } else { + break + } + } + + if (idx >= end || idx < 0) { + return '' + } + + ret += str.charAt(idx) + + if (/[\uD800-\uDBFF]/.test(ret) && /[\uDC00-\uDFFF]/.test(str.charAt(idx + 1))) { + // Go one further, since one of the "characters" is part of a surrogate pair + ret += str.charAt(idx + 1) + } + return ret +} +</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.charat', 'String.prototype.charAt')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.String.charAt")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("String.prototype.indexOf()")}}</li> + <li>{{jsxref("String.prototype.lastIndexOf()")}}</li> + <li>{{jsxref("String.prototype.charCodeAt()")}}</li> + <li>{{jsxref("String.prototype.codePointAt()")}}</li> + <li>{{jsxref("String.prototype.split()")}}</li> + <li>{{jsxref("String.fromCodePoint()")}}</li> + <li><a href="https://mathiasbynens.be/notes/javascript-unicode">JavaScript has a Unicode problem – Mathias Bynens</a></li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/charcodeat/index.html b/files/ja/web/javascript/reference/global_objects/string/charcodeat/index.html new file mode 100644 index 0000000000..18dcb608de --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/charcodeat/index.html @@ -0,0 +1,164 @@ +--- +title: String.prototype.charCodeAt() +slug: Web/JavaScript/Reference/Global_Objects/String/charCodeAt +tags: + - JavaScript + - Method + - Reference + - String + - Unicode +translation_of: Web/JavaScript/Reference/Global_Objects/String/charCodeAt +--- +<div>{{JSRef}}</div> + +<p><span class="seoSummary"><strong><code>charCodeAt()</code></strong> メソッドは、指定された位置にある UTF-16 コードユニットを表す <code>0</code> から <code>65535</code> までの整数を返します。</span></p> + +<div>{{EmbedInteractiveExample("pages/js/string-charcodeat.html", "shorter")}}</div> + +<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div> + +<p>単一の UTF-16 コードユニットで表現可能なコードポイントであれば、 UTF-16 コードユニットは Unicode コードポイントと一致します。 Unicode コードポイントが単一の UTF-16 コードユニットで表現できない場合 (値が <code>0xFFFF</code> を超える場合)、返されるコードユニットはそのコードポイントの<em>サロゲートペアの最初の部分</em>になります。コードポイント値全体を取得したい場合は、 {{jsxref("Global_Objects/String/codePointAt", "codePointAt()")}} を使用してください。</p> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox notranslate"><var>str</var>.charCodeAt(<var>index</var>)</pre> + +<h3 id="Parameters" name="Parameters">引数</h3> + +<dl> + <dt><code><var>index</var></code></dt> + <dd>整数で、 <code>0</code> 以上、文字列の <code>length</code> 未満の値です。 <code><var>index</var></code> が数値でない場合は、既定で <code>0</code> になります。</dd> +</dl> + +<h3 id="Return_value" name="Return_value">返値</h3> + +<p>与えられた <code><var>index</var></code> の位置にあるコードポイント値を表す数値です。 <code><var>index</var></code> の位置に要素がない場合は {{jsxref("Global_Objects/NaN", "NaN")}} を返します。</p> + +<h2 id="Description" name="Description">解説</h2> + +<p>Unicode コードポイントの範囲は、 <code>0</code> から <code>1114111</code> (<code>0x10FFFF</code>) です。最初の 128 の Unicode コードポイントは、 ASCII 文字エンコーディングに直接対応しています。 (Unicode についての詳細は、<a href="/ja/docs/Web/JavaScript/Guide/Values,_variables,_and_literals#Unicode">Java Script ガイド</a>を参照してください。)</p> + +<div class="blockIndicator note"> +<p><strong>注:</strong> <code>charCodeAt()</code> は常に <code>65536</code> より小さい値を返すことに注意してください。これは、より高いコードポイントは、実際の文字を含むように使用されている (下の値) の "代理" 擬似文字のペアで表されているためです。</p> + +<p>これにより、 <code>65536</code> 以上の値の個々の文字について完全な文字を検証したり再現したりするためには、 <code>charCodeAt(<var>i</var>)</code> だけではなく、 <code>charCodeAt(<var>i</var>+1)</code> (2 文字の文字列を検証/再現する場合) か <code>codePointAt(<var>i</var>)</code> を代わりに使用する必要があります。下記の例 2 と 3 を見てください。</p> +</div> + +<p>与えられたインデックスが 0 と文字列の長さの間にない場合、<code>charCodeAt()</code> は {{jsxref("Global_Objects/NaN", "NaN")}} を返します。</p> + +<p>後方互換: (JavaScript 1.2 などの) 過去のバージョンでは、 <code>charCodeAt()</code> メソッドは、与えられた位置の文字の ISO-Latin-1 コードセットの値を示す数を返します。 ISO-Latin-1 コードセットの範囲は 0 から 255 です。最初の 0 から 127 までは ASCII 文字セットに直接対応しています。</p> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Using_charCodeAt" name="Using_charCodeAt">charCodeAt() の使用</h3> + +<p>以下の例では、 Unicode 文字の A である <code>65</code> を返します。</p> + +<pre class="brush: js notranslate">'ABC'.charCodeAt(0) // returns 65 +</pre> + +<h3 id="Fixing_charCodeAt_to_handle_non-Basic-Multilingual-Plane_characters_if_their_presence_earlier_in_the_string_is_unknown" name="Fixing_charCodeAt_to_handle_non-Basic-Multilingual-Plane_characters_if_their_presence_earlier_in_the_string_is_unknown">基本多言語面以外の文字が文字列の前方に存在するかどうか不明な場合に扱えるように charCodeAt() を修正</h3> + +<p>このバージョンは、指定された位置の前に BMP 以外の文字が存在するかどうかが不明な場合に、 for ループなどで使用されることがあります。</p> + +<pre class="brush: js notranslate">function fixedCharCodeAt(str, idx) { + // ex. fixedCharCodeAt('\uD800\uDC00', 0); // 65536 + // ex. fixedCharCodeAt('\uD800\uDC00', 1); // false + idx = idx || 0; + var code = str.charCodeAt(idx); + var hi, low; + + // High surrogate (could change last hex to 0xDB7F + // to treat high private surrogates + // as single characters) + if (0xD800 <= code && code <= 0xDBFF) { + hi = code; + low = str.charCodeAt(idx + 1); + if (isNaN(low)) { + throw 'High surrogate not followed by ' + + 'low surrogate in fixedCharCodeAt()'; + } + return ( + (hi - 0xD800) * 0x400) + + (low - 0xDC00) + 0x10000; + } + if (0xDC00 <= code && code <= 0xDFFF) { // Low surrogate + // We return false to allow loops to skip + // this iteration since should have already handled + // high surrogate above in the previous iteration + return false; + // hi = str.charCodeAt(idx - 1); + // low = code; + // return ((hi - 0xD800) * 0x400) + + // (low - 0xDC00) + 0x10000; + } + return code; +} +</pre> + +<h3 id="文字列の前方に基本多言語面以外の文字が存在することが分かっている場合に扱えるように_charCodeAt_を修正">文字列の前方に基本多言語面以外の文字が存在することが分かっている場合に扱えるように charCodeAt() を修正</h3> + +<pre class="brush: js notranslate">function knownCharCodeAt(str, idx) { + str += ''; + var code, + end = str.length; + + var surrogatePairs = /[\uD800-\uDBFF][\uDC00-\uDFFF]/g; + while ((surrogatePairs.exec(str)) != null) { + var li = surrogatePairs.lastIndex; + if (li - 2 < idx) { + idx++; + } + else { + break; + } + } + + if (idx >= end || idx < 0) { + return NaN; + } + + code = str.charCodeAt(idx); + + var hi, low; + if (0xD800 <= code && code <= 0xDBFF) { + hi = code; + low = str.charCodeAt(idx + 1); + // Go one further, since one of the "characters" + // is part of a surrogate pair + return ((hi - 0xD800) * 0x400) + + (low - 0xDC00) + 0x10000; + } + return code; +} +</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.charcodeat', 'String.prototype.charCodeAt')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.String.charCodeAt")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("String.fromCharCode()")}}</li> + <li>{{jsxref("String.prototype.charAt()")}}</li> + <li>{{jsxref("String.fromCodePoint()")}}</li> + <li>{{jsxref("String.prototype.codePointAt()")}}</li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/codepointat/index.html b/files/ja/web/javascript/reference/global_objects/string/codepointat/index.html new file mode 100644 index 0000000000..1c01aac633 --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/codepointat/index.html @@ -0,0 +1,146 @@ +--- +title: String.prototype.codePointAt() +slug: Web/JavaScript/Reference/Global_Objects/String/codePointAt +tags: + - ECMAScript 2015 + - JavaScript + - Method + - Prototype + - Reference + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/codePointAt +--- +<div>{{JSRef}}</div> + +<p><strong><code>codePointAt()</code></strong> メソッドは、 Unicode コードポイント値である負ではない整数を返します。</p> + +<div>{{EmbedInteractiveExample("pages/js/string-codepointat.html","shorter")}}</div> + +<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox notranslate"><var>str</var>.codePointAt(<var>pos</var>)</pre> + +<h3 id="Parameters" name="Parameters">引数</h3> + +<dl> + <dt><code><var>pos</var></code></dt> + <dd>コードポイント値を返す <code><var>str</var></code> の中の要素の位置です。</dd> +</dl> + +<h3 id="Return_value" name="Return_value">返値</h3> + +<p>与えられた <code><var>pos</var></code> の位置にあるコードポイント値を表す数値です。 <code>pos</code> の位置に要素がない場合は {{jsxref("undefined")}} を返します。</p> + +<h2 id="Description" name="Description">解説</h2> + +<p>指定された位置に要素が存在しない場合は {{jsxref("undefined")}} を返します。 <code><var>pos</var></code> の位置から UTF-16 サロゲートペアが始まらない場合は、 <code><var>pos</var></code> の位置のコードユニットを返します。</p> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Using_codePointAt" name="Using_codePointAt">codePointAt() の使用</h3> + +<pre class="brush: js notranslate">'ABC'.codePointAt(1) // 66 +'\uD800\uDC00'.codePointAt(0) // 65536 + +'XYZ'.codePointAt(42) // undefined +</pre> + +<h3 id="Looping_with_codePointAt" name="Looping_with_codePointAt">codePointAt() の繰り返し</h3> + +<pre class="brush: js notranslate">for (let codePoint of '\ud83d\udc0e\ud83d\udc71\u2764') { + console.log(codePoint.codePointAt(0).toString(16)) +} +// '1f40e', '1f471', '2764' +</pre> + +<h2 id="Polyfill" name="Polyfill">ポリフィル</h2> + +<p>次のプログラムは、 ECMAScript 2015 で定義された <code>codePointAt()</code> をネイティブで対応していないブラウザーで利用できるよう String を拡張します。</p> + +<pre class="brush: js notranslate">/*! https://mths.be/codepointat v0.2.0 by @mathias */ +if (!String.prototype.codePointAt) { + (function() { + 'use strict'; // needed to support `apply`/`call` with `undefined`/`null` + var defineProperty = (function() { + // IE 8 only supports `Object.defineProperty` on DOM elements + try { + var object = {}; + var $defineProperty = Object.defineProperty; + var result = $defineProperty(object, object, object) && $defineProperty; + } catch(error) {} + return result; + }()); + var codePointAt = function(position) { + if (this == null) { + throw TypeError(); + } + var string = String(this); + var size = string.length; + // `ToInteger` + var index = position ? Number(position) : 0; + if (index != index) { // better `isNaN` + index = 0; + } + // Account for out-of-bounds indices: + if (index < 0 || index >= size) { + return undefined; + } + // Get the first code unit + var first = string.charCodeAt(index); + var second; + if ( // check if it’s the start of a surrogate pair + first >= 0xD800 && first <= 0xDBFF && // high surrogate + size > index + 1 // there is a next code unit + ) { + second = string.charCodeAt(index + 1); + if (second >= 0xDC00 && second <= 0xDFFF) { // low surrogate + // https://mathiasbynens.be/notes/javascript-encoding#surrogate-formulae + return (first - 0xD800) * 0x400 + second - 0xDC00 + 0x10000; + } + } + return first; + }; + if (defineProperty) { + defineProperty(String.prototype, 'codePointAt', { + 'value': codePointAt, + 'configurable': true, + 'writable': true + }); + } else { + String.prototype.codePointAt = codePointAt; + } + }()); +} +</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.codepointat', 'String.prototype.codePointAt')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.String.codePointAt")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("String.fromCodePoint()")}}</li> + <li>{{jsxref("String.fromCharCode()")}}</li> + <li>{{jsxref("String.prototype.charCodeAt()")}}</li> + <li>{{jsxref("String.prototype.charAt()")}}</li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/concat/index.html b/files/ja/web/javascript/reference/global_objects/string/concat/index.html new file mode 100644 index 0000000000..70bcf90e76 --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/concat/index.html @@ -0,0 +1,93 @@ +--- +title: String.prototype.concat() +slug: Web/JavaScript/Reference/Global_Objects/String/concat +tags: + - JavaScript + - Prototype + - Reference + - String + - メソッド +translation_of: Web/JavaScript/Reference/Global_Objects/String/concat +--- +<div>{{JSRef}}</div> + +<p><span class="seoSummary"><strong><code>concat()</code></strong> メソッドは、文字列引数を呼び出し文字列に連結して、新しい文字列を返します。</span></p> + +<div>{{EmbedInteractiveExample("pages/js/string-concat.html")}}</div> + +<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox"><var>str</var>.concat(<var>str2</var> [, ...<var>strN</var>])</pre> + +<h3 id="Parameters" name="Parameters">引数</h3> + +<dl> + <dt><code><var>str2</var> [, ...<var>strN</var>]</code></dt> + <dd><code><var>str</var></code> に連結する文字列。</dd> +</dl> + +<h3 id="Return_value" name="Return_value">返値</h3> + +<p>提供された文字列を結合したテキストを含む新しい文字列。</p> + +<h2 id="Description" name="Description">解説</h2> + +<p><code>concat()</code> 関数は、文字列引数を呼び出し文字列に連結し、新しい文字列を返します。元の文字列または返された文字列の変更は、他の文字列には影響しません。</p> + +<p>引数が文字列型でない場合は、連結前に文字列値に変換されます。</p> + +<h2 id="Performance" name="Performance">性能</h2> + +<p><code>concat()</code> メソッドの代わりに {{jsxref("Operators/Assignment_Operators", "代入演算子", "", 1)}} (<code>+</code> または <code>+=</code>) を使用する事を強くお勧めします。<br> + この<a href="https://jsperf.com/concat-vs-plus-vs-join">性能試験</a>によれば、{{jsxref("Operators/Assignment_Operators", "代入演算子", "", 1)}}のほうが数倍高速です。</p> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Using_concat" name="Using_concat">concat() の使用</h3> + +<p>複数の文字列を連結してコンソールに表示する例を以下に示します。</p> + +<pre class="brush: js">let hello = 'こんにちは、' +console.log(hello.concat('鈴木さん', '。よい1日を。')) +/* こんにちは、鈴木さん。よい1日を。*/ + +let greetList = ['こんにちは', ' ', '佐藤さん', '!'] +"".concat(...greetList) // "こんにちは 佐藤さん!" + +"".concat({}) // [object Object] +"".concat([]) // "" +"".concat(null) // "null" +"".concat(true) // "true" +"".concat(4, 5) // "45" + +</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.concat', 'String.prototype.concat')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.String.concat")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("Array.prototype.concat()")}}</li> + <li>{{jsxref("Operators/Assignment_Operators", "Assignment operators", "", 1)}}</li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/endswith/index.html b/files/ja/web/javascript/reference/global_objects/string/endswith/index.html new file mode 100644 index 0000000000..3020f5c05c --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/endswith/index.html @@ -0,0 +1,94 @@ +--- +title: String.prototype.endsWith() +slug: Web/JavaScript/Reference/Global_Objects/String/endsWith +tags: + - JavaScript + - Method + - Prototype + - Reference + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/endsWith +--- +<div>{{JSRef}}</div> + +<p><span class="seoSummary"><strong><code>endsWith()</code></strong> メソッドは文字列が引数で指定された文字列で終わるかを判定して <code>true</code> か <code>false</code> を返します。</span></p> + +<div>{{EmbedInteractiveExample("pages/js/string-endswith.html")}}</div> + +<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox notranslate"><var>str</var>.endsWith(<var>searchString</var>[, <var>length</var>])</pre> + +<h3 id="Parameters" name="Parameters">引数</h3> + +<dl> + <dt><code><var>searchString</var></code></dt> + <dd><code><var>str</var></code> の末尾で検索される文字の集合です。</dd> + <dt><code><var>length</var></code> {{optional_inline}}</dt> + <dd>指定された場合、 <code><var>str</var></code> の長さとして使用されます。既定値は <code><var>str</var>.length</code> です。</dd> +</dl> + +<h3 id="Return_value" name="Return_value">返値</h3> + +<p>文字列が指定された文字列で終わる場合は <strong><code>true</code></strong>、それ以外の場合は <strong><code>false</code></strong> です。</p> + +<h2 id="Description" name="Description">解説</h2> + +<p>文字列が特定の文字列で終わるかどうかを判断できます。このメソッドでは (英文字の) 大文字・小文字は区別されます。</p> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Using_endsWith" name="Using_endsWith">endsWith() の使用</h3> + +<pre class="brush: js notranslate">let str = 'To be, or not to be, that is the question.' + +console.log(str.endsWith('question.')) // true +console.log(str.endsWith('to be')) // false +console.log(str.endsWith('to be', 19)) // true +</pre> + +<h2 id="Polyfill" name="Polyfill">ポリフィル</h2> + +<p>このメソッドは ECMAScript 6 で追加されました。すべての JavaScript の実装でまだ利用可能ではないかもしれません。しかしながら、次のコードで <code>String.prototype.endsWith()</code> をエミュレートできます。</p> + +<pre class="brush: js notranslate">if (!String.prototype.endsWith) { + String.prototype.endsWith = function(search, this_len) { + if (this_len === undefined || this_len > this.length) { + this_len = this.length; + } + return this.substring(this_len - search.length, this_len) === search; + }; +} +</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.endswith', 'String.prototype.endsWith')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.String.endsWith")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("String.prototype.startsWith()")}}</li> + <li>{{jsxref("String.prototype.includes()")}}</li> + <li>{{jsxref("String.prototype.indexOf()")}}</li> + <li>{{jsxref("String.prototype.lastIndexOf()")}}</li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/fixed/index.html b/files/ja/web/javascript/reference/global_objects/string/fixed/index.html new file mode 100644 index 0000000000..ed7e2d2576 --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/fixed/index.html @@ -0,0 +1,67 @@ +--- +title: String.prototype.fixed() +slug: Web/JavaScript/Reference/Global_Objects/String/fixed +tags: + - Deprecated + - HTML wrapper methods + - JavaScript + - Method + - Prototype + - Reference + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/fixed +--- +<div>{{JSRef}} {{deprecated_header}}</div> + +<p><strong><code>fixed()</code></strong> メソッドは、文字列を等幅フォントで表示させる HTML の {{HTMLElement("tt")}} 要素を生成します。</p> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox notranslate"><var>str</var>.fixed()</pre> + +<h3 id="Return_value" name="Return_value">返値</h3> + +<p>HTML の {{HTMLElement("tt")}} 要素を含む文字列です。</p> + +<h2 id="Description" name="Description">解説</h2> + +<p><code>fixed()</code> メソッドは、文字列を <code><tt></code> 要素の中に、 "<code><tt>str</tt></code>" のように埋め込みます。</p> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Using_fixed" name="Using_fixed">fixed() の使用</h3> + +<p>下記の例は、 <code>fixed</code> メソッドを使用して文字列の表示方法を変更します。</p> + +<pre class="brush: js notranslate">var worldString = '世界のみなさん、こんにちは!'; +console.log(worldString.fixed()); // "<tt>世界のみなさん、こんにちは!</tt>" +</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.fixed', 'String.prototype.fixed')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.String.fixed")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("String.prototype.bold()")}}</li> + <li>{{jsxref("String.prototype.italics()")}}</li> + <li>{{jsxref("String.prototype.strike()")}}</li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/fontcolor/index.html b/files/ja/web/javascript/reference/global_objects/string/fontcolor/index.html new file mode 100644 index 0000000000..aa768ff89c --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/fontcolor/index.html @@ -0,0 +1,86 @@ +--- +title: String.prototype.fontcolor() +slug: Web/JavaScript/Reference/Global_Objects/String/fontcolor +tags: + - Deprecated + - HTML wrapper methods + - JavaScript + - Method + - Prototype + - Reference + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/fontcolor +--- +<div>{{JSRef}} {{deprecated_header}}</div> + +<p><strong><code>fontcolor()</code></strong> メソッドは、文字列を指定された色で表示させる HTML の {{HTMLElement("font")}} 要素を生成します。</p> + +<div class="note"> +<p><strong>使用上の注意:</strong> <font> 要素は <a href="/ja/docs/Web/Guide/HTML/HTML5">HTML5</a> で廃止されており、今後使用するべきではありません。代わりにウェブ開発者は <a href="/ja/docs/Web/CSS">CSS</a> プロパティを使用してください。</p> +</div> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox notranslate"><var>str</var>.fontcolor(<var>color</var>)</pre> + +<h3 id="Parameters" name="Parameters">引数</h3> + +<dl> + <dt><code><var>color</var></code></dt> + <dd>16進数の RGB 値または文字列リテラルで色を表す文字列です。 <a href="/ja/docs/Web/CSS/color_value">CSS 色リファレンス</a>に、色名の文字列リテラルの一覧があります。</dd> +</dl> + +<h3 id="Return_value" name="Return_value">返値</h3> + +<p>HTML の {{HTMLElement("font")}} 要素を含む文字列です。</p> + +<h2 id="Description" name="Description">解説</h2> + +<p>色を16進数の RGB 値で表現する場合は、 <code>rrggbb</code> の書式を使用する必要があります。例えば、サーモン色は red=FA, green=80, blue=72 であるため、サーモン色の RGB 値は "<code>FA8072</code>" です。</p> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Using_fontcolor" name="Using_fontcolor">fontcolor() の使用</h3> + +<p>以下の例は <code>fontcolor()</code> メソッドを使用して、 HTML の <code><font></code> 要素を伴う文字列を生成することで文字列の色を変更しています。</p> + +<pre class="brush: js notranslate">var worldString = 'Hello, world'; + +console.log(worldString.fontcolor('red') + ' is red in this line'); +// '<font color="red">Hello, world</font> is red in this line' + +console.log(worldString.fontcolor('FF00') + ' is red in hexadecimal in this line'); +// '<font color="FF00">Hello, world</font> is red in hexadecimal in this line' +</pre> + +<p>{{domxref("ElementCSSInlineStyle/style", "element.style")}} オブジェクトを使用すると、要素の <code>style</code> 属性を使用して、次のようにもっと汎用的に操作することができます。</p> + +<pre class="brush: js notranslate">document.getElementById('yourElemId').style.color = 'red'; +</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.fontcolor', 'String.prototype.fontcolor')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.String.fontcolor")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("String.prototype.fontsize()")}}</li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/fontsize/index.html b/files/ja/web/javascript/reference/global_objects/string/fontsize/index.html new file mode 100644 index 0000000000..244c332279 --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/fontsize/index.html @@ -0,0 +1,85 @@ +--- +title: String.prototype.fontsize() +slug: Web/JavaScript/Reference/Global_Objects/String/fontsize +tags: + - Deprecated + - HTML wrapper methods + - JavaScript + - Method + - Prototype + - Reference + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/fontsize +--- +<div>{{JSRef}} {{deprecated_header}}</div> + +<p><strong><code>fontsize()</code></strong> メソッドは、文字列を指定された大きさで表示させる HTML の {{HTMLElement("font")}} 要素を生成します。</p> + +<div class="note"> +<p><strong>使用上の注意:</strong> <font> 要素は <a href="/ja/docs/Web/Guide/HTML/HTML5">HTML5</a> で廃止されており、今後使用するべきではありません。代わりにウェブ開発者は <a href="/ja/docs/Web/CSS">CSS</a> プロパティを使用してください。</p> +</div> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox notranslate"><var>str</var>.fontsize(<var>size</var>)</pre> + +<h3 id="Parameters" name="Parameters">引数</h3> + +<dl> + <dt><code><var>size</var></code></dt> + <dd>1 ~ 7 の整数、 1 ~ 7 の符号付き整数を表す文字列です。</dd> +</dl> + +<h3 id="Return_value" name="Return_value">返値</h3> + +<p>HTML の {{HTMLElement("font")}} 要素を含む文字列です。</p> + +<h2 id="Description" name="Description">解説</h2> + +<p>大きさを整数で指定した場合は、 <code>str</code> のフォントの大きさを7つの定義済みの大きさで設定します。 <code>size</code> を "-2" のような文字列で指定すると、 <code>str</code> のフォントの大きさを {{HTMLElement("basefont")}} 要素からの相対的な大きさを設定します。</p> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Using_fontsize" name="Using_fontsize">fontsize() の使用</h3> + +<p>以下の例では文字列のメソッドを使用して、文字列の大きさを変更しています。</p> + +<pre class="brush: js notranslate">var worldString = 'Hello, world'; + +console.log(worldString.small()); // <small>Hello, world</small> +console.log(worldString.big()); // <big>Hello, world</big> +console.log(worldString.fontsize(7)); // <font size="7">Hello, world</fontsize> +</pre> + +<p>{{domxref("ElementCSSInlineStyle/style", "element.style")}} オブジェクトを使用すると、要素の <code>style</code> 属性を使用して、次のようにもっと汎用的に操作することができます。</p> + +<pre class="brush: js notranslate">document.getElementById('yourElemId').style.fontSize = '0.7em'; +</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.fontsize', 'String.prototype.fontsize')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.String.fontsize")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("String.prototype.big()")}}</li> + <li>{{jsxref("String.prototype.small()")}}</li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/fromcharcode/index.html b/files/ja/web/javascript/reference/global_objects/string/fromcharcode/index.html new file mode 100644 index 0000000000..82829c8cd7 --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/fromcharcode/index.html @@ -0,0 +1,98 @@ +--- +title: String.fromCharCode() +slug: Web/JavaScript/Reference/Global_Objects/String/fromCharCode +tags: + - JavaScript + - Method + - Reference + - String + - UTF-16 + - Unicode +translation_of: Web/JavaScript/Reference/Global_Objects/String/fromCharCode +--- +<div>{{JSRef}}</div> + +<p><strong><code>String.fromCharCode()</code></strong> 静的メソッドは、指定された UTF-16 コードユニットの並びから生成された文字列を返します。</p> + +<div>{{EmbedInteractiveExample("pages/js/string-fromcharcode.html","shorter")}}</div> + +<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox notranslate">String.fromCharCode(<var>num1</var>[, ...[, <var>numN</var>]])</pre> + +<h3 id="Parameters" name="Parameters">引数</h3> + +<dl> + <dt><code>num1, ..., num<em>N</em></code></dt> + <dd>UTF-16 コードユニットを表す数値の並びです。範囲は <code>0</code> から <code>65535</code> (<code>0xFFFF</code>) までです。数値が <code>0xFFFF</code> を超えた場合は切り捨てられます。妥当性チェックは行われません。</dd> +</dl> + +<h3 id="Return_value" name="Return_value">返値</h3> + +<p>指定された <code><var>N</var></code> 個の UTF-16 コードユニットから生成された、長さ <code><var>N</var></code> の文字列です。</p> + +<h2 id="Description" name="Description">解説</h2> + +<p>このメソッドは {{jsxref("String")}} オブジェクトではなく文字列を返します。</p> + +<p><code>fromCharCode()</code> は {{jsxref("String")}} の静的メソッドなので、自分で生成した {{jsxref("String")}} オブジェクトのメソッドではなく、常に、 <code>String.fromCharCode()</code> として使用するようにしてください。</p> + +<h3 id="Returning_supplementary_characters" name="Returning_supplementary_characters">補助文字の返却</h3> + +<p>UTF-16 では、もっとも一般的な文字は単一の 16 ビット値 (すなわちコードユニット) で表現することができます。しかし、この種の文字は、基本多言語面 (BMP) と呼ばれていますが、全体で指すことができる Unicode コードポイントの <sup>1</sup>/<sub>17</sub> でしかありません。残りのコードポイント、 <code>65536</code> (<code>0x010000</code>) から <code>1114111</code> (<code>0x10FFFF</code>) までは、補助文字と呼ばれています。 UTF-16 では、補助文字はサロゲートと呼ばれる 2 つの 16 ビットコードユニットで表現され、この目的のために予約されていました。2つのサロゲートの妥当な組み合わせを使用して、サロゲートペアと呼ばれる補助文字を表現します。</p> + +<p><code>fromCharCode()</code> は 16 ビット値のみで動作するため (<code>\u</code> エスケープシーケンスと同様)、補助文字を返すためにはサロゲートペアが必要です。例えば、 <code>String.fromCharCode(0xD83C, 0xDF03)</code> と <code>\uD83C\uDF03</code> はコードポイント <code>U+1F303</code> "Night with Stars" です。</p> + +<p>補助コードポイントの値 (例: 0x1F303) とそれを表す両方のサロゲート値 (例: 0xD83C や 0xDF03) との間には数学的な関係がありますが、補助コードポイントを使用するたびにサロゲートペアの値を計算したり参照したりする、余分なステップが必要になります。このため、実際のコードポイント値に基づいて補助文字を返すことができる {{jsxref("String.fromCodePoint()")}} (ES2015 標準の一部) を使用した方が便利です。例えば、 <code>String.fromCodePoint(0x1F303)</code> はコードポイント <code>U+1F303</code> "Night with Stars" を返します。</p> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Using_fromCharCode" name="Using_fromCharCode">fromCharCode() の使用</h3> + +<p>BMP 文字は、 UTF-16 では単一のコードユニットを使用します。</p> + +<pre class="brush: js notranslate">String.fromCharCode(65, 66, 67); // returns "ABC" +String.fromCharCode(0x2014); // returns "—" +String.fromCharCode(0x12014); // also returns "—"; the digit 1 is truncated and ignored +String.fromCharCode(8212); // also returns "—"; 8212 is the decimal form of 0x2014 +</pre> + +<p>補助文字は、 UTF-16 では、 2 つのコードユニット (すなわちサロゲートペア) を必要とします。</p> + +<pre class="brush: js notranslate">String.fromCharCode(0xD83C, 0xDF03); // Code Point U+1F303 "Night with +String.fromCharCode(55356, 57091); // Stars" == "\uD83C\uDF03" + +String.fromCharCode(0xD834, 0xDF06, 0x61, 0xD834, 0xDF07); // "\uD834\uDF06a\uD834\uDF07" +</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.fromcharcode', 'String.fromCharCode')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.String.fromCharCode")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("String.fromCodePoint()")}}</li> + <li>{{jsxref("String.prototype.charAt()")}}</li> + <li>{{jsxref("String.prototype.charCodeAt()")}}</li> + <li>{{jsxref("String.prototype.codePointAt()")}}</li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/fromcodepoint/index.html b/files/ja/web/javascript/reference/global_objects/string/fromcodepoint/index.html new file mode 100644 index 0000000000..c8bcbf6ae3 --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/fromcodepoint/index.html @@ -0,0 +1,149 @@ +--- +title: String.fromCodePoint() +slug: Web/JavaScript/Reference/Global_Objects/String/fromCodePoint +tags: + - ECMAScript 2015 + - JavaScript + - Method + - Reference + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/fromCodePoint +--- +<div>{{JSRef}}</div> + +<p><strong><code>String.fromCodePoint()</code></strong> 静的メソッドは指定されたコードポイントのシーケンスを使って生成された文字列を返します。</p> + +<div>{{EmbedInteractiveExample("pages/js/string-fromcodepoint.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox"><code>String.fromCodePoint(<var>num1</var>[, ...[, <var>numN</var>]])</code></pre> + +<h3 id="Parameters" name="Parameters">引数</h3> + +<dl> + <dt><code>num1, ..., num<em>N</em></code></dt> + <dd>コードポイントのシーケンスです。</dd> +</dl> + +<h3 id="Return_value" name="Return_value">戻り値</h3> + +<p>指定されたコードポイントのシーケンスを使って生成された文字列です。</p> + +<h3 id="Exceptions" name="Exceptions">例外</h3> + +<ul> + <li>無効な Unicode コードポイントを与えられた場合、{{jsxref("Errors/Not_a_codepoint", "RangeError")}} (例: "RangeError: NaN is not a valid code point" )がスローされます。</li> +</ul> + +<h2 id="Description" name="Description">説明</h2> + +<p>このメソッドは {{jsxref("String")}} オブジェクトではなく文字列を返します。</p> + +<p><code>fromCodePoint()</code> メソッドは {{jsxref("String")}} の静的なメソッドなので、自ら生成した {{jsxref("String")}} オブジェクトのメソッドとしてではなく、常に <code>String.fromCodePoint()</code> として使用してください。</p> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Using_fromCharCode" name="Using_fromCharCode"><code>fromCodePoint()</code> を使う</h3> + +<pre class="brush: js">String.fromCodePoint(42); // "*" +String.fromCodePoint(65, 90); // "AZ" +String.fromCodePoint(0x404); // "\u0404" +String.fromCodePoint(0x2F804); // "\uD87E\uDC04" +String.fromCodePoint(194564); // "\uD87E\uDC04" +String.fromCodePoint(0x1D306, 0x61, 0x1D307) // "\uD834\uDF06a\uD834\uDF07" + +String.fromCodePoint('_'); // RangeError +String.fromCodePoint(Infinity); // RangeError +String.fromCodePoint(-1); // RangeError +String.fromCodePoint(3.14); // RangeError +String.fromCodePoint(3e-2); // RangeError +String.fromCodePoint(NaN); // RangeError +</pre> + +<pre class="brush: js">// String.fromCharCode() alone cannot get the character at such a high code point +// The following, on the other hand, can return a 4-byte character as well as the +// usual 2-byte ones (i.e., it can return a single character which actually has +// a string length of 2 instead of 1!) +console.log(String.fromCodePoint(0x2F804)); // or 194564 in decimal +</pre> + +<h2 id="Polyfill" name="Polyfill">ポリフィル</h2> + +<p><code>String.fromCodePoint</code> メソッドは ECMAScript 2015 で追加されました。まだすべての Web ブラウザーや環境でサポートされていないかもしれません。互換性のために次のコードを使用してください。</p> + +<pre class="brush: js">if (!String.fromCodePoint) (function(stringFromCharCode) { + var fromCodePoint = function(_) { + var codeUnits = [], codeLen = 0, result = ""; + for (var index=0, len = arguments.length; index !== len; ++index) { + var codePoint = +arguments[index]; + // correctly handles all cases including `NaN`, `-Infinity`, `+Infinity` + // The surrounding `!(...)` is required to correctly handle `NaN` cases + // The (codePoint>>>0) === codePoint clause handles decimals and negatives + if (!(codePoint < 0x10FFFF && (codePoint>>>0) === codePoint)) + throw RangeError("Invalid code point: " + codePoint); + if (codePoint <= 0xFFFF) { // BMP code point + codeLen = codeUnits.push(codePoint); + } else { // Astral code point; split in surrogate halves + // https://mathiasbynens.be/notes/javascript-encoding#surrogate-formulae + codePoint -= 0x10000; + codeLen = codeUnits.push( + (codePoint >> 10) + 0xD800, // highSurrogate + (codePoint % 0x400) + 0xDC00 // lowSurrogate + ); + } + if (codeLen >= 0x3fff) { + result += stringFromCharCode.apply(null, codeUnits); + codeUnits.length = 0; + } + } + return result + stringFromCharCode.apply(null, codeUnits); + }; + try { // IE 8 only supports `Object.defineProperty` on DOM elements + Object.defineProperty(String, "fromCodePoint", { + "value": fromCodePoint, "configurable": true, "writable": true + }); + } catch(e) { + String.fromCodePoint = fromCodePoint; + } +}(String.fromCharCode)); +</pre> + +<h2 id="Specifications" name="Specifications">仕様</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">仕様</th> + <th scope="col">状況</th> + <th scope="col">コメント</th> + </tr> + <tr> + <td>{{SpecName('ES2015', '#sec-string.fromcodepoint', 'String.fromCodePoint')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td>初期定義</td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.fromcodepoint', 'String.fromCodePoint')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザー実装状況</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.String.fromCodePoint")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("String.fromCharCode()")}}</li> + <li>{{jsxref("String.prototype.charAt()")}}</li> + <li>{{jsxref("String.prototype.codePointAt()")}}</li> + <li>{{jsxref("String.prototype.charCodeAt()")}}</li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/includes/index.html b/files/ja/web/javascript/reference/global_objects/string/includes/index.html new file mode 100644 index 0000000000..c705c8f454 --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/includes/index.html @@ -0,0 +1,123 @@ +--- +title: String.prototype.includes() +slug: Web/JavaScript/Reference/Global_Objects/String/includes +tags: + - JavaScript + - Method + - Prototype + - Reference + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/includes +--- +<div>{{JSRef}}</div> + +<p><strong><code>includes()</code></strong> メソッドは、1 つの文字列を別の文字列の中に見出すことができるかどうかを判断し、必要に応じて <code>true</code> か <code>false</code> を返します。</p> + +<div>{{EmbedInteractiveExample("pages/js/string-includes.html", "shorter")}}</div> + +<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox"><var>str</var>.includes(<var>searchString</var>[, <var>position</var>])</pre> + +<h3 id="Parameters" name="Parameters">引数</h3> + +<dl> + <dt><code><var>searchString</var></code></dt> + <dd><code><var>str</var></code> 内で検索される文字列。</dd> + <dt><code><var>position</var></code> {{optional_inline}}</dt> + <dd>文字列内で <code>searchString</code> を検索し始める位置。既定値は 0 です。</dd> +</dl> + +<h3 id="Return_value" name="Return_value">返値</h3> + +<p>文字列が検索値を含む場合、<strong><code>true</code></strong>。含まなければ、<strong><code>false</code></strong>。</p> + +<h2 id="Description" name="Description">解説</h2> + +<p>このメソッドによってある文字列内に別の文字列を含んでいるかどうか判断できます。</p> + +<h3 id="Case-sensitivity" name="Case-sensitivity">大文字・小文字の区別</h3> + +<p><code>includes()</code> メソッドは大文字と小文字が区別します。例えば、次のコードでは <code>false</code> を返します:</p> + +<pre class="brush: js">'Blue Whale'.includes('blue') // returns false +</pre> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Using_includes" name="Using_includes"><code>includes()</code>を使う</h3> + +<pre class="brush: js">const str = 'To be, or not to be, that is the question.' + +console.log(str.includes('To be')) // true +console.log(str.includes('question')) // true +console.log(str.includes('nonexistent')) // false +console.log(str.includes('To be', 1)) // false +console.log(str.includes('TO BE')) // false +console.log(str.includes('')) // true +</pre> + +<h2 id="Polyfill" name="Polyfill">ポリフィル</h2> + +<p>このメソッドは ECMAScript 2015 で追加されました。まだ、すべての JavaScript の実装で利用できるとは限りません。</p> + +<p>しかしながら、このメソッドを簡単にエミュレートできます。</p> + +<pre class="brush: js">if (!String.prototype.includes) { + String.prototype.includes = function(search, start) { + 'use strict'; + + if (search instanceof RegExp) { + throw TypeError('first argument must not be a RegExp'); + } + if (start === undefined) { start = 0; } + return this.indexOf(search, start) !== -1; + }; +} +</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.includes', 'String.prototype.includes')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.String.includes")}}</p> + +<h2 id="String.prototype.contains">String.prototype.contains</h2> + +<p>Firefox 18–39 では、このメソッドの名称は <code>contains()</code> でした。以下の理由により、 <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1102219">bug 1102219</a> で <code>includes()</code> に名称が変更されました。</p> + +<p><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=789036">報告</a>されたところによると、 MooTools 1.2 を使用したいくつかのウェブサイトが Firefox 17 で壊れました。この版の MooTools は、 <code>String.prototype.contains()</code> が存在するかどうか調べ、存在しない場合は MooTools が独自の関数を追加するようになっています。</p> + +<p>この関数が Firefox 17 で導入されたことで、このチェックの動作が変わり、 MooTools の <code>String.prototype.contains()</code> の実装に基づくコードが壊れることになりました。結果的に、 Firefox 17 では実装が<a href="https://hg.mozilla.org/releases/mozilla-aurora/rev/086db97198a8">無効化</a>され、 <code>String.prototype.contains()</code> が利用できるようになったのは一つ後のバージョンである Firefox 18 で、 <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=789036#c32">MooTools への働きかけ</a>によって <a href="http://mootools.net/blog/2013/02/19/mootools-1-2-6-released">MooTools バージョン 1.2.6 がリリース</a>されてからでした。</p> + +<p>MooTools 1.3 では <code>String.prototype.contains()</code> を強制的に自分自身のものに強制したため、これに依存するウェブサイトは壊れません。しかし、このメソッドに対する <a href="http://mootools.net/core/docs/1.3.2/Types/String#String-method:-contains">MooTools 1.3 のシグニチャ</a> と ECMAScript 2015 のシグニチャでは (第 2 引数に) 違いがあることに注意して下さい。後に、 <a href="https://github.com/mootools/mootools-core/blob/master/Docs/Types/String.md#note">MooTools 1.5 以降で ES2015 仕様に一致させるためにシグニチャを変更しました。</a></p> + +<p>Firefox 48 で、<code>String.prototype.contains()</code> は削除されました。 <code>String.prototype.includes()</code> だけを使用してください。</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("Array.prototype.includes()")}}</li> + <li>{{jsxref("TypedArray.prototype.includes()")}}</li> + <li>{{jsxref("String.prototype.indexOf()")}}</li> + <li>{{jsxref("String.prototype.lastIndexOf()")}}</li> + <li>{{jsxref("String.prototype.startsWith()")}}</li> + <li>{{jsxref("String.prototype.endsWith()")}}</li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/index.html b/files/ja/web/javascript/reference/global_objects/string/index.html new file mode 100644 index 0000000000..d9932e4302 --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/index.html @@ -0,0 +1,384 @@ +--- +title: String +slug: Web/JavaScript/Reference/Global_Objects/String +tags: + - Class + - ECMAScript 2015 + - JavaScript + - Reference + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String +--- +<div>{{JSRef}}</div> + +<p><strong><code>String</code></strong> オブジェクトは文字の並びを表したり操作したりするために使用されます。</p> + +<h2 id="Description" name="Description">解説</h2> + +<p>文字列は、テキスト形式で表現可能なデータを保持するのに便利です。最もよく使われる操作として、文字列の長さをチェックする {{jsxref("String.length", "length")}} プロパティ、 <a href="/ja/docs/Web/JavaScript/Reference/Operators/String_Operators">文字列に対する + および += 演算子</a>を用いた文字列の連結、文字列の中の部分文字列の存在や位置をチェックする {{jsxref("String.prototype.indexOf()", "indexOf()")}} メソッド、部分文字列を取り出す {{jsxref("String.prototype.substring()", "substring()")}} メソッドが挙げられます。</p> + +<h3 id="Creating_strings" name="Creating_strings">文字列の生成</h3> + +<p>文字列は文字列リテラルからプリミティブとして、または {{jsxref("String/String", "String()")}} コンストラクターを使用して文字列として生成することができます。</p> + +<pre class="syntaxbox notranslate">const string1 = "文字列プリミティブ"; +const string2 = 'これも文字列プリミティブ'; +const string3 = `別な文字列プリミティブ`;</pre> + +<pre class="syntaxbox notranslate">const string4 = new String("文字列オブジェクト"); +</pre> + +<p>文字列プリミティブと文字列オブジェクトは、ほとんどの場合は交換して使用することができます。下記の「<a href="#String_primitives_and_String_objects">文字列プリミティブと String オブジェクト</a>」を参照してください。</p> + +<p>文字列リテラルは単一引用符または二重引用符を使用して指定することができ、どちらでも同様に扱われますが、逆引用符文字 <kbd>`</kbd> を使用することもできます。最後の形は<a href="/ja/docs/Web/JavaScript/Reference/Template_literals">テンプレートリテラル</a>を指定し、この形式では式を補完することができます。</p> + +<h3 id="Character_access" name="Character_access">文字へのアクセス</h3> + +<p>文字列内の個々の文字へのアクセス方法には、二通りの方法があります。そのひとつは {{jsxref("String.prototype.charAt()", "charAt()")}} メソッドです。</p> + +<pre class="brush: js notranslate">return 'ねこ'.charAt(1) // "こ" が返される +</pre> + +<p>そしてもうひとつは、文字列を配列のようなオブジェクトとして扱い、数値の添字を用いる方法です。 (ECMAScript 5 で導入)</p> + +<pre class="brush: js notranslate">return 'ねこ'[1] // "こ" が返される。 +</pre> + +<p>ブラケット記法を使用した文字アクセスでは、これらのプロパティに値を設定したり削除したりすることはできません。関連したプロパティを書き込んだり設定したりすることもできません。 (より詳細な情報は {{jsxref("Object.defineProperty()")}} を参照してください。)</p> + +<h3 id="Comparing_strings" name="Comparing_strings">文字列の比較</h3> + +<p>C 言語では 文字列の比較の為に <code>strcmp()</code> 関数を用います。 JavaScript では単純に <a href="/ja/docs/Web/JavaScript/Reference/Operators/Comparison_Operators">小なり / 大なり演算子</a>を用います。</p> + +<pre class="brush: js notranslate">let a = 'a' +let b = 'b' +if (a < b) { // true + console.log(a + ' は ' + b + ' より小さい') +} else if (a > b) { + console.log(a + ' は ' + b + ' より大きい') +} else { + console.log(a + ' と ' + b + ' は等しい') +} +</pre> + +<p><code>String</code> インスタンスから継承される {{jsxref("String.prototype.localeCompare()", "localeCompare()")}} メソッドを使用して同等の結果を得ることもできます。</p> + +<p>なお、 <code>a == b</code> は <code><var>a</var></code> と <code><var>b</var></code> の文字列が等しいかどうかを、通常の大文字小文字を区別して比較します。大文字小文字に関係なく比較したい場合は、次のように関数を使用してください。</p> + +<pre class="notranslate">function isEqual(str1, str2) +{ + return str1.toUpperCase() === str2.toUpperCase() +} // isEqual +</pre> + +<p>この関数では、特定の UTF-8 文字の変換に問題があるため、小文字の代わりに大文字を使用します。</p> + +<h3 id="String_primitives_and_String_objects" name="String_primitives_and_String_objects">文字列プリミティブと String オブジェクト</h3> + +<p>JavaScript では、 <code>String</code> オブジェクトと{{Glossary("Primitive", "プリミティブ文字列")}}は区別されることに注意してください。 ({{jsxref("Boolean")}} や {{jsxref("Global_Objects/Number", "Number")}} にも同じことが言えます。)</p> + +<p>文字列リテラル (二重引用符または単一引用符で示されます)、および <code>String</code> 関数をコンストラクター以外の場面で (すなわち {{jsxref("Operators/new", "new")}} キーワードを使わずに) 呼び出した場合はプリミティブの文字列になります。 JavaScript では、必要に応じてプリミティブの文字列が自動的に <code>String</code> オブジェクトに変換されるので、プリミティブの文字列に対して <code>String</code> オブジェクトのメソッドを使用することができます。プリミティブの文字列に対して、メソッドの呼び出しやプロパティの参照が行われようとした場合、 JavaScript は自動的にプリミティブの文字列をオブジェクトでラップし、メソッドを呼び出したりプロパティの参照を行ったりします。</p> + +<pre class="brush: js notranslate">let s_prim = 'foo' +let s_obj = new String(s_prim) + +console.log(typeof s_prim) // Logs "string" +console.log(typeof s_obj) // Logs "object" +</pre> + +<p>プリミティブの文字列と <code>String</code> オブジェクトは {{jsxref("Global_Objects/eval", "eval()")}} を使用すると異なる結果となります。 <code>eval</code> に渡されたプリミティブは、ソースコードとして扱われます。 <code>String</code> オブジェクトは他のオブジェクトと同様に、オブジェクトとしてそのままの文字列を返します。</p> + +<pre class="brush: js notranslate">let s1 = '2 + 2' // 文字列プリミティブを生成 +var s2 = new String('2 + 2') // String オブジェクトを生成 +console.log(eval(s1)) // 数値の 4 を返す +console.log(eval(s2)) // 文字列の "2 + 2" を返す +</pre> + +<p>こういった理由から、プリミティブの文字列を期待して実装されたコードは <code>String</code> オブジェクトでうまく動作しないことがあります。しかし、一般的にはこれらの違いを考慮しなければならないことはあまりありません。</p> + +<p>なお、 <code>String</code> オブジェクトは {{jsxref("String.prototype.valueOf()", "valueOf()")}} メソッドを用いることで、プリミティブの文字列に変換することができます。</p> + +<pre class="brush: js notranslate">console.log(eval(s2.valueOf())) // 数値の 4 を返す +</pre> + +<h3 id="Escape_notation" name="Escape_notation">エスケープ表記</h3> + +<p>通常の文字列とは異なる特殊な文字を表示するためには、エスケープ表記を使用します。</p> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">コード</th> + <th scope="col">出力</th> + </tr> + </thead> + <tbody> + <tr> + <td><code>\<var>XXX</var></code><br> + (<code><var>XXX</var></code> = 1~3桁の8進数、 <code>0</code>~<code>377</code> の範囲)</td> + <td>ISO-8859-1 の文字または U+0000 から U+00FF の間の Unicode コードポイントです。</td> + </tr> + <tr> + <td><code>\'</code></td> + <td>単一引用符</td> + </tr> + <tr> + <td><code>\"</code></td> + <td>二重引用符</td> + </tr> + <tr> + <td><code>\\</code></td> + <td>バックスラッシュ (\文字)</td> + </tr> + <tr> + <td><code>\n</code></td> + <td>改行</td> + </tr> + <tr> + <td><code>\r</code></td> + <td>復帰</td> + </tr> + <tr> + <td><code>\v</code></td> + <td>垂直タブ</td> + </tr> + <tr> + <td><code>\t</code></td> + <td>水平タブ</td> + </tr> + <tr> + <td><code>\b</code></td> + <td>バックスペース</td> + </tr> + <tr> + <td><code>\f</code></td> + <td>ページ送り</td> + </tr> + <tr> + <td><code>\u<var>XXXX</var></code> (<code><var>XXXX</var></code> = 4桁の16進数、 <code>0x0000</code>~<code>0xFFFF</code> の範囲)</td> + <td>UTF-16 のコード単位 / <code>U+0000</code> から <code>U+FFFF</code> の間の Unicode コードポイント</td> + </tr> + <tr> + <td><code>\u{<var>X</var>}</code> ... <code>\u{<var>XXXXXX</var>}</code><br> + (<code><var>X</var>…<var>XXXXXX</var></code> = 1~6桁の16進数、 <code>0x0</code>–<code>0x10FFFF</code> の範囲)</td> + <td>UTF-32 のコード単位 / <code>U+0000</code> から <code>U+10FFFF</code> の間の Unicode コードポイント</td> + </tr> + <tr> + <td><code>\x<var>XX</var></code><br> + (<code><var>XX</var></code> = 2桁の16進数、 <code>0x00</code>~<code>0xFF</code> の範囲)</td> + <td>ISO-8859-1 の文字 / <code>U+0000</code> から <code>U+00FF</code> の間の Unicode コードポイント</td> + </tr> + </tbody> +</table> + +<h3 id="Long_literal_strings" name="Long_literal_strings">長い文字列リテラル</h3> + +<p>時には、コードに非常に長い文字列が含まれる場合があります。行を延々と長くしたり、エディターに任せて折り返したりするよりも、実際の文字列の内容に影響を与えずに文字列をソースコード内で複数行に分割したいことがあります。これを行うには2つの方法があります。</p> + +<h4 id="Method_1" name="Method_1">方法 1</h4> + +<p><a href="/ja/docs/Web/JavaScript/Reference/Operators/Addition">+</a> 演算子を使用して、次のように複数の文字列を追加することができます。</p> + +<pre class="brush: js notranslate">let longString = "This is a very long string which needs " + + "to wrap across multiple lines because " + + "otherwise my code is unreadable." +</pre> + +<h4 id="Method_2" name="Method_2">方法 2</h4> + +<p>各行の末尾にバックスラッシュ文字 (<code>\</code>) を使用して、文字列が次の行に続くことを示すことができます。バックスラッシュの後に、 (改行を除いて) 空白やその他の文字を置いたり、インデントを置いたりしていないか確認してください。さもないと動作しません。</p> + +<p>この形式は以下のようになります。</p> + +<pre class="brush: js notranslate">let longString = "This is a very long string which needs \ +to wrap across multiple lines because \ +otherwise my code is unreadable." +</pre> + +<p>これらの結果はともに同じ文字列が生成されます。</p> + +<h2 id="Constructor" name="Constructor">コンストラクター</h2> + +<dl> + <dt>{{jsxref("String/String", "String()")}}</dt> + <dd>新しい <code>String</code> オブジェクトを生成するために使用します。コンストラクターではなく関数として呼び出されたときは型変換を行うので、普通はより有用です。</dd> +</dl> + +<h2 id="Static_methods" name="Static_methods">静的メソッド</h2> + +<dl> + <dt>{{jsxref("String.fromCharCode()", "String.fromCharCode(<var>num1</var> [, ...[, <var>numN</var>]])")}}</dt> + <dd>指定された Unicode 値の列から生成した文字列を返します。</dd> + <dt>{{jsxref("String.fromCodePoint()", "String.fromCodePoint(<var>num1</var> [, ...[, <var>numN</var>)")}}</dt> + <dd>指定された Unicode コードポイントの列から生成した文字列を返します。</dd> + <dt>{{jsxref("String.raw()")}}</dt> + <dd>生のテンプレート文字列から生成した文字列を返します。</dd> +</dl> + +<h2 id="Instance_properties" name="Instance_properties">インスタンスプロパティ</h2> + +<dl> + <dt>{{jsxref("String.prototype.length")}}</dt> + <dd>文字列の <code>length</code> を反映します。読み取り専用です。</dd> +</dl> + +<h2 id="Instance_methods" name="Instance_methods">インスタンスメソッド</h2> + +<dl> + <dt>{{jsxref("String.prototype.charAt()", "String.prototype.charAt(<var>index</var>)")}}</dt> + <dd><code><var>index</var></code> で指定された位置の文字 (UTF-16 コード 1 つから成ります) を返します。</dd> + <dt>{{jsxref("String.prototype.charCodeAt()", "String.prototype.charCodeAt(<var>index</var>)")}}</dt> + <dd><code><var>index</var></code> で与えられた位置の文字の UTF-16 の値を示す数を返します。</dd> + <dt>{{jsxref("String.prototype.codePointAt()", "String.prototype.codePointAt(<var>pos</var>)")}}</dt> + <dd><code><var>pos</var></code> で指定された位置から始まる UTF-16 エンコードされた際のコードポイントの、コードポイントの値である正の整数を返します。</dd> + <dt>{{jsxref("String.prototype.concat()", "String.prototype.concat(<var>str </var>[, ...<var>strN </var>])")}}</dt> + <dd>2 つ (以上) の文字列を連結し、新しい文字列を返します。</dd> + <dt>{{jsxref("String.prototype.includes()", "String.prototype.includes(<var>searchString</var> [, <var>position</var>])")}}</dt> + <dd>文字列中に <code><var>searchString</var></code> が含まれているかを返します。</dd> + <dt>{{jsxref("String.prototype.endsWith()", "String.prototype.endsWith(<var>searchString</var> [, <var>length</var>])")}}</dt> + <dd>文字列の末尾に指定された文字列 <code><var>searchString</var></code> が含まれているかを返します。</dd> + <dt>{{jsxref("String.prototype.indexOf()", "String.prototype.indexOf(<var>searchValue</var> [, <var>fromIndex</var>])")}}</dt> + <dd>呼び出す {{jsxref("String")}} オブジェクト中で、 <code><var>searchValue</var></code> が最初に現れる位置を返します。見つからなかった場合は <code>-1</code> を返します。</dd> + <dt>{{jsxref("String.prototype.lastIndexOf()", "String.prototype.lastIndexOf(<var>searchValue</var> [, <var>fromIndex</var>])")}}</dt> + <dd>呼び出す {{jsxref("String")}} オブジェクト中で、 <code><var>searchValue</var></code> が最後に現れる位置を返します。見つからない場合は <code>-1</code> を返します。</dd> + <dt>{{jsxref("String.prototype.localeCompare()", "String.prototype.localeCompare(<var>compareString</var> [, <var>locales</var> [, <var>options</var>]])")}}</dt> + <dd>参照文字列 <code><var>compareString</var></code> が、並べ替え順において、与えられた文字列の前になるか後になるか、あるいは、同じかどうかを示す数値を返します。</dd> + <dt>{{jsxref("String.prototype.match()", "String.prototype.match(<var>regexp</var>)")}}</dt> + <dd>文字列に対して正規表現 <code><var>regexp</var></code> を一致させるために使用されます。</dd> + <dt>{{jsxref("String.prototype.matchAll()", "String.prototype.matchAll(<var>regexp</var>)")}}</dt> + <dd><code><var>regexp</var></code> が一致するものすべてのイテレーターを返します。</dd> + <dt>{{jsxref("String.prototype.normalize()", "String.prototype.normalize([<var>form</var>])")}}</dt> + <dd>呼び出された文字列の値の Unicode 正規化形式を返します。</dd> + <dt>{{jsxref("String.prototype.padEnd()", "String.prototype.padEnd(<var>targetLength</var> [, <var>padString</var>])")}}</dt> + <dd>現在の文字列の末尾から指定された文字列で埋めた、長さ <code><var>targetLength</var></code> 文字の新たな文字列を返します。</dd> + <dt>{{jsxref("String.prototype.padStart()", "String.prototype.padStart(<var>targetLength</var> [, <var>padString</var>])")}}</dt> + <dd>現在の文字列の先頭から指定した文字列で埋めた、長さ <code><var>targetLength</var></code> 文字の新たな文字列を作成します。</dd> + <dt>{{jsxref("String.prototype.repeat()", "String.prototype.repeat(<var>count</var>)")}}</dt> + <dd>オブジェクトの要素を <code><var>count</var></code> 回繰り返した文字列を返します。</dd> + <dt>{{jsxref("String.prototype.replace()" , "String.prototype.replace(<var>searchFor</var>, <var>replaceWith</var>)")}}</dt> + <dd><code><var>searchFor</var></code> が現れたところを <code><var>replaceWith</var></code> で置換するために使用します。 <code><var>searchFor</var></code> は文字列または正規表現であり、 <code><var>replaceWith</var></code> は文字列または関数です。</dd> + <dt>{{jsxref("String.prototype.replaceAll()" , "String.prototype.replaceAll(<var>searchFor</var>, <var>replaceWith</var>)")}}</dt> + <dd><code><var>searchFor</var></code> が現れたところすべてを <code><var>replaceWith</var></code> で置換するために使用します。 <code><var>searchFor</var></code> は文字列または正規表現であり、 <code><var>replaceWith</var></code> は文字列または関数です。</dd> + <dt>{{jsxref("String.prototype.search()", "String.prototype.search(<var>regexp</var>)")}}</dt> + <dd>正規表現 <code><var>regexp</var></code> と呼び出された文字列が一致するところを検索します。</dd> + <dt>{{jsxref("String.prototype.slice()", "String.prototype.slice(<var>beginIndex</var>[, <var>endIndex</var>])")}}</dt> + <dd>文字列の一区間を取り出し、新しい文字列を返します。</dd> + <dt>{{jsxref("String.prototype.split()", "String.prototype.split([<var>sep</var> [, <var>limit</var>] ])")}}</dt> + <dd>呼び出した文字列を、部分文字列 <code><var>sep</var></code> が現れるところで分割し、文字列の配列を生成して返します。</dd> + <dt>{{jsxref("String.prototype.startsWith()", "String.prototype.startsWith(<var>searchString</var> [, <var>length</var>])")}}</dt> + <dd>呼び出した文字列が文字列 <code><var>searchString</var></code> で開始されているかを判断します。</dd> + <dt>{{jsxref("String.prototype.substr()")}}</dt> + <dd>文字列において、指定された位置から指定された文字数の文字を返します。</dd> + <dt>{{jsxref("String.prototype.substring()", "String.prototype.substring(<var>indexStart</var> [, <var>indexEnd</var>])")}}</dt> + <dd>呼び出した文字列の指定された位置以降 (または区間) にある文字が入った新しい文字列を返します。</dd> + <dt>{{jsxref("String.prototype.toLocaleLowerCase()", "String.prototype.toLocaleLowerCase( [<var>locale</var>, ...<var>locales</var>])")}}</dt> + <dd> + <p>文字列内の文字が、現在のロケールに沿って小文字に変換されます。</p> + + <p>ほとんどの言語では、これは {{jsxref("String.prototype.toLowerCase()", "toLowerCase()")}} と同じものを返します。</p> + </dd> + <dt>{{jsxref("String.prototype.toLocaleUpperCase()", "String.prototype.toLocaleUpperCase( [<var>locale</var>, ...<var>locales</var>])")}}</dt> + <dd> + <p>文字列内の文字が、現在のロケールに沿って大文字に変換されます。</p> + + <p>ほとんどの言語では、これは {{jsxref("String.prototype.toUpperCase()", "toUpperCase()")}} と同じものを返します。</p> + </dd> + <dt>{{jsxref("String.prototype.toLowerCase()")}}</dt> + <dd>小文字に変換された文字列の値を呼び出して返します。</dd> + <dt>{{jsxref("String.prototype.toString()")}}</dt> + <dd>指定されたオブジェクトの文字列を返します。{{jsxref("Object.prototype.toString()")}} メソッドを上書きします。</dd> + <dt>{{jsxref("String.prototype.toUpperCase()")}}</dt> + <dd>大文字に変換された文字列の値を呼び出して返します。</dd> + <dt>{{jsxref("String.prototype.trim()")}}</dt> + <dd>文字列の先頭と末尾にある空白を削除します。 ECMAScript 5 標準の一部です。</dd> + <dt>{{jsxref("String.prototype.trimStart()")}}</dt> + <dd>文字列の先頭にある空白を削除します。</dd> + <dt>{{jsxref("String.prototype.trimEnd()")}}</dt> + <dd>文字列の末尾にある空白を削除します。</dd> + <dt>{{jsxref("String.prototype.valueOf()")}}</dt> + <dd>指定されたオブジェクトのプリミティブ値を返します。 {{jsxref("Object.prototype.valueOf()")}} メソッドを上書きします。</dd> + <dt>{{jsxref("String.prototype.@@iterator()")}}</dt> + <dd>文字列値のコードポイントを反復処理し、文字列値として各コードポイントを返す、新しい <code>Iterator</code> オブジェクトを返します。</dd> +</dl> + +<h2 id="HTML_wrapper_methods" name="HTML_wrapper_methods">HTML ラッパーメソッド</h2> + +<div> +<div class="blockIndicator note"> +<p><strong>非推奨です。これらのメソッドは避けてください。</strong></p> + +<p>以下のメソッドは、それぞれ、特定の HTML タグでラップされた文字列のコピーを返します。</p> +</div> + +<dl> + <dt>{{jsxref("String.prototype.anchor()")}}</dt> + <dd>{{htmlattrxref("name", "a", "<a name=\"name\">")}} (ハイパーテキストのターゲット)</dd> + <dt>{{jsxref("String.prototype.big()")}}</dt> + <dd>{{HTMLElement("big")}}</dd> + <dt>{{jsxref("String.prototype.blink()")}}</dt> + <dd>{{HTMLElement("blink")}}</dd> + <dt>{{jsxref("String.prototype.bold()")}}</dt> + <dd>{{HTMLElement("b")}}</dd> + <dt>{{jsxref("String.prototype.fixed()")}}</dt> + <dd>{{HTMLElement("tt")}}</dd> + <dt>{{jsxref("String.prototype.fontcolor()")}}</dt> + <dd>{{htmlattrxref("color", "font", "<font color=\"color\">")}}</dd> + <dt>{{jsxref("String.prototype.fontsize()")}}</dt> + <dd>{{htmlattrxref("size", "font", "<font size=\"size\">")}}</dd> + <dt>{{jsxref("String.prototype.italics()")}}</dt> + <dd>{{HTMLElement("i")}}</dd> + <dt>{{jsxref("String.prototype.link()")}}</dt> + <dd>{{htmlattrxref("href", "a", "<a href=\"url\">")}} (URL へのリンク)</dd> + <dt>{{jsxref("String.prototype.small()")}}</dt> + <dd>{{HTMLElement("small")}}</dd> + <dt>{{jsxref("String.prototype.strike()")}}</dt> + <dd>{{HTMLElement("strike")}}</dd> + <dt>{{jsxref("String.prototype.sub()")}}</dt> + <dd>{{HTMLElement("sub")}}</dd> + <dt>{{jsxref("String.prototype.sup()")}}</dt> + <dd>{{HTMLElement("sup")}}</dd> +</dl> +</div> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="String_conversion" name="String_conversion">文字列変換</h3> + +<p><code>String</code> を使用すると、 {{jsxref("String.prototype.toString()", "toString()")}} よりも信頼性の高い代替手段となり、 {{jsxref("null")}}, {{jsxref("undefined")}}, {{jsxref("Symbol", "symbols")}} に対して使用することもできます。</p> + +<pre class="brush: js notranslate">let outputStrings = [] +for (let i = 0, n = inputValues.length; i < n; ++i) { + outputStrings.push(String(inputValues[i])); +} +</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string-objects', 'String')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.String")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li><a href="/ja/docs/Web/JavaScript/Guide/Text_formatting">JavaScript ガイドのテキスト処理</a></li> + <li>{{jsxref("RegExp")}}</li> + <li>{{domxref("DOMString")}}</li> + <li><a href="/ja/Add-ons/Code_snippets/StringView"><code>StringView</code> — 型付き配列に基づいた C 風の文字列の表現</a></li> + <li><a href="/ja/docs/Web/API/DOMString/Binary">バイナリ文字列</a></li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/indexof/index.html b/files/ja/web/javascript/reference/global_objects/string/indexof/index.html new file mode 100644 index 0000000000..a2db982f65 --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/indexof/index.html @@ -0,0 +1,169 @@ +--- +title: String.prototype.indexOf() +slug: Web/JavaScript/Reference/Global_Objects/String/indexOf +tags: + - JavaScript + - Method + - Prototype + - Reference + - String + - メソッド +translation_of: Web/JavaScript/Reference/Global_Objects/String/indexOf +--- +<div>{{JSRef}}</div> + +<p><span class="seoSummary"><strong><code>indexOf()</code></strong> メソッドは、呼び出す {{jsxref("String")}} オブジェクト中で、 <code>fromIndex</code> から検索を始め、指定された値が最初に現れたインデックスを返します。値が見つからない場合は <code>-1</code> を返します。</span></p> + +<div>{{EmbedInteractiveExample("pages/js/string-indexof.html")}}</div> + +<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div> + +<div class="note"><strong>メモ:</strong> 配列メソッドについては {{jsxref("Array.prototype.indexOf()")}} を参照してください。</div> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox"><var>str</var>.indexOf(<var>searchValue [</var>, <var>fromIndex]</var>) +</pre> + +<h3 id="Parameters" name="Parameters">引数</h3> + +<dl> + <dt><code><var>searchValue</var></code></dt> + <dd> + <p>検索する値を表す文字列です。</p> + + <p>文字列が明示的に提供されなかった場合は、 <a href="https://tc39.github.io/ecma262/#sec-tostring"><var>searchValue</var> は "<code>undefined</code>" となり</a>、この値が <code><var>str</var></code> の中から検索されます。</p> + + <p>ですから、例えば <code>'undefined'.indexOf()</code> は <code>undefined</code> が <code>undefined</code> という文字列の中の <code>0</code> の位置に見つかるため、 <code>0</code> を返します。しかし、 <code>'undefine'.indexOf()</code> は <code>undefined</code> が <code>undefine</code> という文字列の中で見つからないため、 <code>-1</code> を返します。</p> + </dd> + <dt><var><code>fromIndex</code></var> {{optional_inline}}</dt> + <dd> + <p>整数値で、検索を始める位置を表します。既定値は <code>0</code> です。</p> + + <p><var><code>fromIndex</code></var> の値が <code>0</code> より小さい場合や <code><var>str</var>.length</code> より大きい場合は、それぞれ <code>0</code> の位置、 <code><var>str</var>.length</code> の位置から検索を始めます。</p> + + <p>例えば、 <code>'hello world'.indexOf('o', -5)</code> は、 <code>0</code> の位置から検索を始め、 <code>o</code> が <code>4</code> の位置にあるので <code>4</code> を返します。一方、 <code>'hello world'.indexOf('o', 11)</code> (および <code>fromIndex</code> の値が <code>11</code> よりも大きな場合) は、 <code>11</code> が文字列の末尾よりも<em>後</em>の位置であるため、 <code>-1</code> を返します。</p> + </dd> +</dl> + +<h3 id="Return_value" name="Return_value">返値</h3> + +<p><code><var>searchValue</var></code> が初めて出現した位置です。見つからなかった場合は、 <strong>-1</strong> になります。</p> + +<p><code><var>searchValue</var></code> が空文字列であった場合は奇妙な結果になります。 <code><var>fromIndex</var></code> の値がなかった場合や、 <code><var>fromIndex</var></code> の値が文字列の <code>length</code> よりも小さかった場合は、返値は <code><var>fromIndex</var></code> と同じになります。</p> + +<pre class="brush: js">'hello world'.indexOf('') // 0 を返す +'hello world'.indexOf('', 0) // 0 を返す +'hello world'.indexOf('', 3) // 3 を返す +'hello world'.indexOf('', 8) // 8 を返す</pre> + +<p>しかし、 <code><var>fromIndex</var></code> の値が文字列の <code>length</code> 以上であった場合、返値は文字列の <code>length</code> になります。</p> + +<pre class="brush: js">'hello world'.indexOf('', 11) // 11 を返す +'hello world'.indexOf('', 13) // 11 を返す +'hello world'.indexOf('', 22) // 11 を返す</pre> + +<p>前者の例では、 JS は指定された位置の直後に空文字列を見つけているようです。後者の例では、 JS は検索される文字列の末尾で空文字列を見つけているようです。</p> + +<h2 id="Description" name="Description">解説</h2> + +<p>文字列における文字は左から右にインデックス化されます。一番最初の文字の位置は <code>0</code> で、 <code><var>stringName</var></code> として呼び出された文字列における一番最後の文字は <code><var>stringName</var>.length - 1</code> です。</p> + +<pre class="brush:js">'Blue Whale'.indexOf('Blue') // 0 を返します +'Blue Whale'.indexOf('Blute') // -1 を返します +'Blue Whale'.indexOf('Whale', 0) // 5 を返します +'Blue Whale'.indexOf('Whale', 5) // 5 を返します +'Blue Whale'.indexOf('Whale', 7) // -1 を返します +'Blue Whale'.indexOf('') // 0 を返します +'Blue Whale'.indexOf('', 9) // 9 を返します +'Blue Whale'.indexOf('', 10) // 10 を返します +'Blue Whale'.indexOf('', 11) // 10 を返します +</pre> + +<p><code>indexOf()</code> メソッドは大文字と小文字を区別します。例えば、以下の式は <code>-1</code> を返します。</p> + +<pre class="brush: js">'Blue Whale'.indexOf('blue') // -1 を返します +</pre> + +<h3 id="Checking_occurrences" name="Checking_occurrences">出現のチェック</h3> + +<p><code>0</code> は <code>true</code> と評価されず、 <code>-1</code> は <code>false</code> と評価されないことに注意してください。そのため、特定の文字列がほかの文字列に含まれているかをチェックする正確な方法は次のようになります。</p> + +<pre class="brush: js">'Blue Whale'.indexOf('Blue') !== -1 // true +'Blue Whale'.indexOf('Bloe') !== -1 // false +~('Blue Whale'.indexOf('Bloe')) // 0, which is falsy +</pre> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Using_indexOf" name="Using_indexOf"><code>indexOf()</code> を使う</h3> + +<p>以下の例は、<code>"Brave new world"</code> という文字列において、与えられた値の位置を求めるために、<code>indexOf()</code> を使用しています。</p> + +<pre class="brush: js">const str = 'Brave new world' + +console.log('Index of first w from start is ' + str.indexOf('w')) // 8 を表示 +console.log('Index of "new" from start is ' + str.indexOf('new')) // 6 を表示 +</pre> + +<h3 id="indexOf_and_case-sensitivity" name="indexOf_and_case-sensitivity"><code>indexOf()</code> と 大文字と小文字の区別</h3> + +<p>以下の例は 2 つの文字列の変数を定義しています。</p> + +<p>それらの変数は、2 番目の文字列が大文字を含んでいることを除けば、同じ文字列を含んでいます。1 番目の {{domxref("console.log()")}} メソッドは <code>19</code> を表示します。しかし、 <code>indexOf()</code> メソッドは大文字と小文字を区別するので、 "<code>cheddar</code>" という文字列は <code>myCapString</code> では見つけられません。ですから、 <code>console.log()</code> メソッドは <code>-1</code> を表示します。</p> + +<pre class="brush: js">const myString = 'brie, pepper jack, cheddar' +const myCapString = 'Brie, Pepper Jack, Cheddar' + +console.log('myString.indexOf("cheddar") is ' + myString.indexOf('cheddar')) +// 19 を表示します +console.log('myCapString.indexOf("cheddar") is ' + myCapString.indexOf('cheddar')) +// -1 を表示します +</pre> + +<h3 id="Using_indexOf_to_count_occurrences_of_a_letter_in_a_string" name="Using_indexOf_to_count_occurrences_of_a_letter_in_a_string"><code>indexOf()</code> を使って文字列中である文字が現れる回数を数える</h3> + +<p>以下の例は、 <code>count</code> に、 <code>str</code> という文字列中で <code>e</code> という文字が出現する回数を設定します。</p> + +<pre class="brush: js">const str = 'To be, or not to be, that is the question.' +let count = 0 +let position = str.indexOf('e') + +while (position !== -1) { + count++ + position = str.indexOf('e', position + 1) +} + +console.log(count) // 4 を表示 +</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.indexof', 'String.prototype.indexOf')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.String.indexOf")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("String.prototype.charAt()")}}</li> + <li>{{jsxref("String.prototype.lastIndexOf()")}}</li> + <li>{{jsxref("String.prototype.includes()")}}</li> + <li>{{jsxref("String.prototype.split()")}}</li> + <li>{{jsxref("Array.prototype.indexOf()")}}</li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/italics/index.html b/files/ja/web/javascript/reference/global_objects/string/italics/index.html new file mode 100644 index 0000000000..41fb0f5202 --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/italics/index.html @@ -0,0 +1,69 @@ +--- +title: String.prototype.italics() +slug: Web/JavaScript/Reference/Global_Objects/String/italics +tags: + - Deprecated + - HTML wrapper methods + - JavaScript + - Method + - Prototype + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/italics +--- +<div>{{JSRef}} {{deprecated_header}}</div> + +<p><strong><code>italics()</code></strong> メソッドは、文字列がイタリックになるように HTML の {{HTMLElement("i")}} 要素を生成します。</p> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox notranslate"><var>str</var>.italics()</pre> + +<h3 id="Return_value" name="Return_value">返値</h3> + +<p>HTML の {{HTMLElement("i")}} 要素を含む文字列です。</p> + +<h2 id="Description" name="Description">解説</h2> + +<p><code>italics()</code> メソッドは、文字列を <code><i></code> 要素の中に、 "<code><i>str</i></code>" のように埋め込みます。</p> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="italics_の使用">italics() の使用</h3> + +<p>以下の例では文字列のメソッドを使用して、文字列を整形しています。</p> + +<pre class="brush: js notranslate">var worldString = 'Hello, world'; +console.log(worldString.blink()); // <blink>Hello, world</blink> +console.log(worldString.bold()); // <b>Hello, world</b> +console.log(worldString.italics()); // <i>Hello, world</i> +console.log(worldString.strike()); // <strike>Hello, world</strike> +</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.italics', 'String.prototype.italics')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.String.italics")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("String.prototype.blink()")}}</li> + <li>{{jsxref("String.prototype.bold()")}}</li> + <li>{{jsxref("String.prototype.strike()")}}</li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/lastindexof/index.html b/files/ja/web/javascript/reference/global_objects/string/lastindexof/index.html new file mode 100644 index 0000000000..d9ae2f8260 --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/lastindexof/index.html @@ -0,0 +1,110 @@ +--- +title: String.prototype.lastIndexOf() +slug: Web/JavaScript/Reference/Global_Objects/String/lastIndexOf +tags: + - JavaScript + - Method + - Prototype + - Reference + - String + - lastIndexOf +translation_of: Web/JavaScript/Reference/Global_Objects/String/lastIndexOf +--- +<div>{{JSRef}}</div> + +<p><span class="seoSummary"><strong><code>lastIndexOf()</code></strong> メソッドは、呼び出した {{jsxref("String")}} オブジェクトの中で、 <code>fromIndex</code> から前方向に検索を始め、指定された値が最後に現れたインデックスを返します。値が見つからない場合は <code>-1</code> を返します。</span></p> + +<div>{{EmbedInteractiveExample("pages/js/string-lastindexof.html", "shorter")}}</div> + +<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox notranslate"><var>str</var>.lastIndexOf(<var>searchValue</var>[, <var>fromIndex</var>])</pre> + +<h3 id="Parameters" name="Parameters">引数</h3> + +<dl> + <dt><code><var>searchValue</var></code></dt> + <dd>検索する値を表す文字列です。 <code><var>searchValue</var></code> が空文字列であった場合は、 <code><var>fromIndex</var></code> を返します。 + </dd><dt><code><var>fromIndex</var></code> {{optional_inline}}</dt> + <dd>比較の先頭とみなされる文字列の最後の文字の位置です。既定値は <code>+Infinity</code> です。 <code><var>fromIndex</var> >= <var>str</var>.length</code> の場合、文字列全体が検索されます。 <code><var>fromIndex</var> < 0</code> の場合は、 <code>0</code> の場合と同じ動作になります。 +</dd></dl> + +<h3 id="Return_value" name="Return_value">返値</h3> + +<p><code><var>searchValue</var></code> が最後に出現した位置です。見つからなかった場合は、 <code>-1</code> になります。</p> + +<h2 id="Description" name="Description">解説</h2> + +<p>文字列における文字は左から右にインデックス化されます。一番最初の文字の位置は <code>0</code> で、一番最後の文字は <code><var>str</var>.length - 1</code> です。</p> + +<pre class="brush: js notranslate">'canal'.lastIndexOf('a'); // returns 3 +'canal'.lastIndexOf('a', 2); // 1 を返す +'canal'.lastIndexOf('a', 0); // -1 を返す +'canal'.lastIndexOf('x'); // -1 を返す +'canal'.lastIndexOf('c', -5); // 0 を返す +'canal'.lastIndexOf('c', 0); // 0 を返す +'canal'.lastIndexOf(''); // 5 を返す +'canal'.lastIndexOf('', 2); // 2 を返す +</pre> + +<div class="note"> +<p><strong>注:</strong> <code>'abab'.lastIndexOf('ab', 2)</code> は <code>2</code> を返し、 <code>0</code> にはなりません。 <code><var>fromIndex</var></code> は検索の開始位置を制約するものだからです。</p> +</div> + +<h3 id="Case-sensitivity" name="Case-sensitivity">大文字と小文字の区別</h3> + +<p><code>lastIndexOf()</code> メソッドは大文字と小文字を区別します。例えば、以下の式は <code>-1</code> を返します。</p> + +<pre class="brush: js notranslate">'Blue Whale, Killer Whale'.lastIndexOf('blue'); // -1 を返す +</pre> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Using_indexOf_and_lastIndexOf" name="Using_indexOf_and_lastIndexOf">indexOf() と lastIndexOf() の使用</h3> + +<p>以下の例は、 {{jsxref("String.prototype.indexOf()", "indexOf()")}} と <code>lastIndexOf()</code> を使用して文字列 "<code>Brave new world</code>" の中の値の位置を示します。</p> + +<pre class="brush: js notranslate">let anyString = 'Brave new world'; + +console.log('先頭から見て最初に w が出現する位置: ' + anyString.indexOf('w')); +// 8 と出力 +console.log('末尾から見て最初に w が出現する位置: ' + anyString.lastIndexOf('w')); +// 10 と出力 +console.log('先頭から見た "new" の位置: ' + anyString.indexOf('new')); +// 6 と出力 +console.log('末尾から見た "new" の位置: ' + anyString.lastIndexOf('new')); +// 6 と出力 +</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.lastindexof', 'String.prototype.lastIndexOf')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.String.lastIndexOf")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("String.prototype.charAt()")}}</li> + <li>{{jsxref("String.prototype.indexOf()")}}</li> + <li>{{jsxref("String.prototype.split()")}}</li> + <li>{{jsxref("Array.prototype.indexOf()")}}</li> + <li>{{jsxref("Array.prototype.lastIndexOf()")}}</li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/length/index.html b/files/ja/web/javascript/reference/global_objects/string/length/index.html new file mode 100644 index 0000000000..62c3016f34 --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/length/index.html @@ -0,0 +1,103 @@ +--- +title: String length +slug: Web/JavaScript/Reference/Global_Objects/String/length +tags: + - JavaScript + - Property + - Prototype + - Reference + - String + - String Length + - length +translation_of: Web/JavaScript/Reference/Global_Objects/String/length +--- +<div>{{JSRef}}</div> + +<p><span class="seoSummary"><strong><code>length</code></strong> プロパティは {{jsxref("String")}} オブジェクトの文字列長を UTF-16 コードユニットの数で表します。 <code>length</code> は、 string インスタンスの読み取り専用データプロパティです。</span></p> + +<div>{{EmbedInteractiveExample("pages/js/string-length.html", "shorter")}}</div> + +<h2 id="Description" name="Description">解説</h2> + +<p>このプロパティは、文字列内のコード単位の数を返します。 JavaScript で使用される文字列書式である {{interwiki("wikipedia", "UTF-16")}} は、ほとんどの一般の文字は単一の16ビットコードユニットで表しますが、あまり使われない文字に対しては2つのコードユニットを使用する必要があり、 <code>length</code> で返される値が文字列の実際の文字数と一致しなくなる可能性があります。</p> + +<p>ECMAScript 2016 (ed. 7) では最大長が <code>2^53 - 1</code> 要素と制定されました。それ以前は最大長は定まっていませんでした。 Firefox 内にある文字列の最大長は <code>2**30 - 2</code> (~1GB) です。Firefox 65 以前での最大長は <code>2**28 - 1</code> (~256MB) でした。</p> + +<p>空の文字列の場合、<code>length</code> は 0 になります。</p> + +<p>静的プロパティの <code>String.length</code> は文字列の長さとは関係なく、 <code>String</code> 関数のアリティ (ゆるく言えば、それが持つ形式的な引数の数) であり、 1 です。</p> + +<h2 id="Unicode">Unicode</h2> + +<p>`length` は文字数ではなくコードユニットの数を数えるため、文字数を知りたい場合はこのようなことをする必要があります。</p> + +<pre class="brush: js notranslate">function getCharacterLength (str) { + // The string iterator that is used here iterates over characters, + // not mere code units + return [...str].length; +} + +console.log(getCharacterLength('A\uD87E\uDC04Z')); // 3 + +// While not recommended, you could add this to each string as follows: + +Object.defineProperty(String.prototype, 'charLength', { + get () { + return getCharacterLength(this); + } +}); + +console.log('A\uD87E\uDC04Z'.charLength); // 3 +</pre> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Basic_usage" name="Basic_usage">基本的な使い方</h3> + +<pre class="brush: js notranslate">let x = 'Mozilla'; +let empty = ''; + +console.log(x + ' の文字数:' + x.length + ' 文字(コード個数)' ); +/* "Mozilla の文字数:7 文字(コード個数)" */ + +console.log('空文字の文字数:' + empty.length + ' 文字' ); +/* "空文字の文字数:0 文字" */</pre> + +<h3 id="Assigning_to_length" name="Assigning_to_length">length プロパティへの代入</h3> + +<pre class="brush: js notranslate">let myString = "bluebells"; + +// Attempting to assign a value to a string's .length property has no observable effect. +myString.length = 4; +console.log(myString); +// expected output: "bluebells" +console.log(myString.length); +// expected output: 9 +</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-properties-of-string-instances-length')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.String.length")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li><a href="https://downloads.teradata.com/blog/jasonstrimpel/2011/11/javascript-string-length-and-internationalizing-web-applications">JavaScript <code>String.length</code> and Internationalizing Web Applications</a></li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/link/index.html b/files/ja/web/javascript/reference/global_objects/string/link/index.html new file mode 100644 index 0000000000..0401a2f8f6 --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/link/index.html @@ -0,0 +1,77 @@ +--- +title: String.prototype.link() +slug: Web/JavaScript/Reference/Global_Objects/String/link +tags: + - Deprecated + - HTML wrapper methods + - JavaScript + - Method + - Prototype + - Reference + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/link +--- +<div>{{JSRef}} {{deprecated_header}}</div> + +<p><strong><code>link()</code></strong> メソッドは、他の URL へのハイパーテキストリンクとして使用される HTML の {{HTMLElement("a")}} 要素を生成します。</p> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox notranslate"><var>str</var>.link(<var>url</var>)</pre> + +<h3 id="Parameters" name="Parameters">引数</h3> + +<dl> + <dt><code><var>url</var></code></dt> + <dd><code><a></code> 要素の <code>href</code> 属性を指定する任意の文字列です。これは妥当な (相対または絶対) URL を、すべての <code>&</code> の文字を <code>&amp;</code> でエスケープし、すべての <code>"</code> の文字を <code>&quot;</code> でエスケープしたものにしてください。</dd> +</dl> + +<h3 id="Return_value" name="Return_value">返値</h3> + +<p>HTML の {{HTMLElement("a")}} 要素を含む文字列です。</p> + +<h2 id="Description" name="Description">解説</h2> + +<p><code>link()</code> メソッドを使用すると、ハイパーリンクを表す HTML スニペットを生成することができます。返値の文字列はその後、 {{domxref("document.write()")}} または {{domxref("element.innerHTML")}} を通して文書に追加することができます。</p> + +<p><code>link()</code> メソッドで生成したリンクは、 <code>document</code> オブジェクトの <code>links</code> 配列の要素になります。 {{domxref("document.links")}} を参照してください。</p> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="small_の使用">small() の使用</h3> + +<p>以下の例では文字列のメソッドを使用して、文字列の大きさを変更しています。</p> + +<pre class="brush: js notranslate">var hotText = 'MDN'; +var URL = 'https://developer.mozilla.org/'; + +console.log('Click to return to ' + hotText.link(URL)); +// Click to return to <a href="https://developer.mozilla.org/">MDN</a> +</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.link', 'String.prototype.link')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.String.link")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("String.prototype.anchor()")}}</li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/localecompare/index.html b/files/ja/web/javascript/reference/global_objects/string/localecompare/index.html new file mode 100644 index 0000000000..58a9b5d692 --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/localecompare/index.html @@ -0,0 +1,170 @@ +--- +title: String.prototype.localeCompare() +slug: Web/JavaScript/Reference/Global_Objects/String/localeCompare +tags: + - Internationalization + - JavaScript + - Method + - Prototype + - Reference + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/localeCompare +--- +<div>{{JSRef("Global_Objects", "String")}}</div> + +<p><strong><code>localeCompare()</code></strong> メソッドは参照文字列がソート順で引数で与えられた文字列と大なり、小なり、等しいとなるかどうかを示す数値を返します。</p> + +<div>{{EmbedInteractiveExample("pages/js/string-localecompare.html")}}</div> + + + +<p>新しい<code>locales</code> と <code>options</code> 引数によってアプリケーションはソート順で使われる言語を指定し関数の振る舞いをカスタマイズできます。古い実装では、<code>locales</code>引数と<code>options</code>引数は無視されます。使用されるローケルとソート順は完全に実装依存しています。</p> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox notranslate"><code><var>referenceStr</var>.localeCompare(<var>compareString</var>[, <var>locales</var>[, <var>options</var>]])</code></pre> + +<h3 id="Parameters" name="Parameters">引数</h3> + +<dl> + <dt><code><var>compareString</var></code></dt> + <dd> + <p><code><var>referenceStr</var></code> と比較される文字列。</p> + </dd> + <dt><code><var>locales</var></code> 、 <code><var>options</var></code></dt> + <dd> + <p>これらの引数は関数の振る舞いをカスタマイズし、使用されるべきフォーマット規約の言語をアプリケーションに決めさせます。引数 <code><var>locales</var></code> 、 <code><var>options</var></code> を無視する実装においては、使用されるロケールと返却される文字列の書式は完全に実装依存となります。</p> + + <p>これらのパラメーターの詳細及び使用方法については <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Collator/Collator"><code>Intl.Collator()</code> コンストラクター</a> を見てください。</p> + </dd> +</dl> + +<div>{{page('/docs/Web/JavaScript/Reference/Global_Objects/Collator', 'Parameters')}}</div> + +<div> +<h3 id="戻り値">戻り値</h3> + +<p><code><var>referenceStr</var></code> が <code><var>compareString</var></code> より前に出現する場合は負数、 <code><var>referenceStr</var></code> が <code><var>compareString</var></code> より後に出現する場合は正数、等しい場合は 0 。</p> +</div> + +<h2 id="Description" name="Description">説明</h2> + +<p><code><var>referenceStr</var></code> が <code><var>compareString</var></code> より辞書順で先に来るか、後に来るか、あるいは等しいかを示す整数を返します。</p> + +<ul> + <li><code><var>referenceStr</var></code> が <code><var>compareString</var></code> より先に出現する場合は負数</li> + <li><code><var>referenceStr</var></code> が <code><var>compareString</var></code> より後に出現する場合は正数</li> + <li>等しい場合は <code>0</code></li> +</ul> + +<div class="blockIndicator warning"> +<p><strong>戻り値が厳密に -1 や 1 であると考えないように</strong></p> + +<p>負数と正数が結果としてどんな数値になるかはブラウザー間(及びブラウザーのバージョン間)で異なります。これは W3C の仕様が負の値か正の値かとだけ指定しているためです。ブラウザーによっては<code>-2</code> や <code>2</code> を、あるいはまた別の負の値、正の値を返却するかもしれません。</p> +</div> + +<h2 id="パフォーマンス">パフォーマンス</h2> + +<p>巨大な配列のソートなど大量の文字列を比較する場合は {{jsxref("Global_Objects/Collator", "Intl.Collator")}} オブジェクトを作成し、 {{jsxref("Collator.prototype.compare", "compare")}} プロパティで提供される関数を利用すると良いでしょう。</p> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Example_Using_localeCompare" name="Example:_Using_localeCompare"><code>localeCompare()</code>を使う</h3> + +<pre class="brush: js notranslate">// 文字 "a" は "c" は負数になります +'a'.localeCompare('c'); // -2 や -1 (あるいはまた別の負数) + +// 単語 "check" はアルファベット順に "against" より後ろなので正数になります +'check'.localeCompare('against'); // 2 や -1 (あるいはまた別の正数) + +// "a" と"a" は等しいので自然数 0 になります +'a'.localeCompare('a'); // 0 +</pre> + +<h3 id="配列のソート">配列のソート</h3> + +<p><code>localeCompare()</code> は case-insensitive な配列のソートを行います。</p> + +<pre class="notranslate">let items = ['réservé', 'Premier', 'Cliché', 'communiqué', 'café', 'Adieu']; +items.sort( (a, b) => a.localeCompare(b, 'fr', {ignorePunctuation: true})); +// ['Adieu', 'café', 'Cliché', 'communiqué', 'Premier', 'réservé'] +</pre> + +<h3 id="Example_Checking_for_support_for_locales_and_options_arguments" name="Example:_Checking_for_support_for_locales_and_options_arguments">拡張された引数をブラウザーがサポートしているか調べる</h3> + +<p>引数 <code><var>locales</var></code> と <code><var>options</var></code> はすべてのプラウザでまだサポートされていません。</p> + +<p>実装がこれらをサポートしているか調べるため引数 <code>"i"</code> (不正な言語タグが除外される要件)を利用し、例外 {{jsxref("RangeError")}} を調べます。</p> + +<pre class="brush: js notranslate">function localeCompareSupportsLocales() { + try { + 'a'.localeCompare('b', 'i'); + } catch (e) { + return e.name === 'RangeError'; + } + return false; +} +</pre> + +<h3 id="Example_Using_locales" name="Example:_Using_locales"><code>locales</code>を使う</h3> + +<p><code>localeCompare()</code>によって得られる結果は言語間で違います。アプリケーションのユーザインターフェイスで使用される言語のソート順を得るために、 <code>locales</code>引数を使用してその言語(そしておそらくいくつかのフォールバック言語)を指定していることを確かめて下さい。:</p> + +<pre class="brush: js notranslate">console.log('ä'.localeCompare('z', 'de')); // 負数: ドイツ語で ä は a に分類される +console.log('ä'.localeCompare('z', 'sv')); // 正数: スウェーデン語では ä は z の後になる +</pre> + +<h3 id="Example_Using_options" name="Example:_Using_options"><code>options</code>を使う</h3> + +<p><code>localeCompare()</code>によって得られる結果は<code>options</code>引数を使用することによってカスタマイズできます。:</p> + +<pre class="brush: js notranslate">// ドイツ語では ä の base letter は a +console.log('ä'.localeCompare('a', 'de', { sensitivity: 'base' })); // 0 + +// スウェーデン語では ä と a は異なる base letters +console.log('ä'.localeCompare('a', 'sv', { sensitivity: 'base' })); // a positive value +</pre> + +<h3 id="数字のソート">数字のソート</h3> + +<pre class="brush: js notranslate">// デフォルトでは "2" > "10" +console.log(<span class="message-body-wrapper"><span class="message-flex-body"><span class="devtools-monospace message-body">"2".localeCompare("10")</span></span></span>); // 1 + +// オプションを使った数字 +console.log(<span class="message-body-wrapper"><span class="message-flex-body"><span class="devtools-monospace message-body">"2".localeCompare("10", undefined, {numeric: true})</span></span></span>); // -1 + +// ロケールタグを使った数字 +console.log(<span class="message-body-wrapper"><span class="message-flex-body"><span class="devtools-monospace message-body">"2".localeCompare("10", "en-u-kn-true")</span></span></span>); // -1 +</pre> + +<h2 id="仕様">仕様</h2> + +<table> + <thead> + <tr> + <th scope="col">Specification</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.localecompare', 'String.prototype.localeCompare')}}</td> + </tr> + <tr> + <td>{{SpecName('ES Int Draft', '#sup-String.prototype.localeCompare', 'String.prototype.localeCompare')}}</td> + </tr> + </tbody> +</table> + +<h2 id="ブラウザ実装状況">ブラウザ実装状況</h2> + +<div> +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.String.localeCompare")}}</p> +</div> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("Global_Objects/Collator", "Intl.Collator")}}</li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/match/index.html b/files/ja/web/javascript/reference/global_objects/string/match/index.html new file mode 100644 index 0000000000..df07b7ee93 --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/match/index.html @@ -0,0 +1,188 @@ +--- +title: String.prototype.match() +slug: Web/JavaScript/Reference/Global_Objects/String/match +tags: + - JavaScript + - Method + - Prototype + - Reference + - Regular Expressions + - String + - メソッド + - 正規表現 +translation_of: Web/JavaScript/Reference/Global_Objects/String/match +--- +<div>{{JSRef}}</div> + +<p><strong><code>match()</code></strong> メソッドは、<a href="/ja/docs/Web/JavaScript/Guide/Regular_Expressions">正規表現</a>に対する<em>文字列</em>のマッチングの結果を受け取ります。</p> + +<div>{{EmbedInteractiveExample("pages/js/string-match.html", "shorter")}}</div> + +<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox"><var>str</var>.match(<var>regexp</var>)</pre> + +<h3 id="Parameters" name="Parameters">引数</h3> + +<dl> + <dt><code><var>regexp</var></code></dt> + <dd>正規表現オブジェクトです。</dd> + <dd><code><var>regexp</var></code> が <code>RegExp</code> ではないオブジェクトであった場合、 {{jsxref("RegExp")}} への暗黙的な変換が <code>new RegExp(<var>regexp</var>)</code> を使用して行われます。</dd> + <dd>一切引数を与えずに <code>match()</code> メソッドを使った場合、空の文字列 1 つを持つ {{jsxref("Array")}}、 <code>[""]</code> が得られます。</dd> +</dl> + +<h3 id="Return_value" name="Return_value">返値</h3> + +<p>グローバル (<code>g</code>) フラグの有無によって内容が変わる {{jsxref("Array")}} を返します。一致するものが見つからなかった場合は {{jsxref("null")}} を返します。</p> + +<ul> + <li><code>g</code> フラグがあった場合は、正規表現全体に一致したすべての結果を返しますが、キャプチャグループは返しません。</li> + <li><code>g</code> フラグがなかった場合、最初に完全に一致したものと、それに関するキャプチャグループを返します。この場合、返される要素には下記の追加のプロパティが存在します。</li> +</ul> + +<h4 id="Additional_properties" name="Additional_properties">追加のプロパティ</h4> + +<p>上記の説明にある通り、結果は追加のプロパティを含むことがあります。</p> + +<dl> + <dt><code>groups</code></dt> + <dd>名前付きキャプチャグループのオブジェクトで、キーは名前、値はキャプチャグループ、または名前付きキャプチャグループが定義されていない場合は {{jsxref("undefined")}} です。詳細は<a href="/ja/docs/Web/JavaScript/Guide/Regular_Expressions/Groups_and_Ranges">グループと範囲</a>を見てください。</dd> + <dt><code>index</code></dt> + <dd>結果が見つかった検索のインデックスです。</dd> + <dt><code>input</code></dt> + <dd>検索された文字列のコピーです。</dd> +</dl> + +<h2 id="Description" name="Description">解説</h2> + +<p>正規表現が <code>g</code> フラグを含んでいない場合、 <code>str.match()</code> は {{jsxref("RegExp.prototype.exec()", "RegExp.exec()")}} と同じ結果を返します。</p> + +<h3 id="Other_methods" name="Other_methods">その他のメソッド</h3> + +<ul> + <li>ある文字列が正規表現 {{jsxref("RegExp")}} に一致するかどうかを知る必要がある場合は、 {{jsxref("RegExp.prototype.test()", "RegExp.test()")}} を使用してください。</li> + <li>一番最初に一致したものだけが欲しい場合、代わりに {{jsxref("RegExp.prototype.exec()", "RegExp.exec()")}} を使ったほうが良いかもしれません。</li> + <li>キャプチャグループを取得する場合でグローバルフラグが設定されていた場合は、 {{jsxref("RegExp.prototype.exec()", "RegExp.exec()")}} を使用してください。</li> +</ul> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Using_match" name="Using_match">match() の使用</h3> + +<p>以下の例において、 <code>match()</code> は '<code>Chapter</code>' とそれに続く 1 桁以上の数字、それに続く 0 回以上の小数点と数字を見つけるために使われています。</p> + +<p>正規表現が <code>i</code> フラグを含んでいるので、大文字と小文字の違いは無視されます。</p> + +<pre class="brush: js">let str = 'For more information, see Chapter 3.4.5.1'; +let re = /see (chapter \d+(\.\d)*)/i; +let found = str.match(re); + +console.log(found); + +// logs [ 'see Chapter 3.4.5.1', +// 'Chapter 3.4.5.1', +// '.1', +// index: 22, +// input: 'For more information, see Chapter 3.4.5.1' ] + +// 'see Chapter 3.4.5.1' is the whole match. +// 'Chapter 3.4.5.1' was captured by '(chapter \d+(\.\d)*)'. +// '.1' was the last value captured by '(\.\d)'. +// The 'index' property (22) is the zero-based index of the whole match. +// The 'input' property is the original string that was parsed.</pre> + +<h3 id="Using_global_and_ignore_case_flags_with_match" name="Using_global_and_ignore_case_flags_with_match">match() での g と i フラグの使用</h3> + +<p>以下の例は、 g と i フラグを <code>match()</code> で使用した実例です。 <code>A</code> から <code>E</code> までと、 <code>a</code> から <code>e</code> までのすべての文字が返され、それぞれが配列の個々の要素に入ります。</p> + +<pre class="brush: js">let str = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz'; +let regexp = /[A-E]/gi; +let matches_array = str.match(regexp); + +console.log(matches_array); +// ['A', 'B', 'C', 'D', 'E', 'a', 'b', 'c', 'd', 'e'] +</pre> + +<div class="blockIndicator note"> +<p><strong>メモ:</strong> {{jsxref("String.prototype.matchAll()")}} と<a href="/ja/docs/Web/JavaScript/Guide/Regular_Expressions#Advanced_Searching_With_Flags">フラグを用いた高度な検索</a>も参照してください。</p> +</div> + +<h3 id="Using_named_capturing_groups" name="Using_named_capturing_groups">名前付きキャプチャグループの使用</h3> + +<p>名前付きキャプチャグループに対応しているブラウザーでは、次のコードは "<code>fox</code>" または "<code>cat</code>" を "<code>animal</code>" という名前のグループに入れます。</p> + +<pre class="brush: js">let paragraph = 'The quick brown fox jumps over the lazy dog. It barked.'; + +let capturingRegex = /(?<animal>fox|cat) jumps over/; +found = paragraph.match(capturingRegex); +console.log(found.groups); // {animal: "fox"} +</pre> + +<h3 id="Using_match_with_no_parameter" name="Using_match()_with_no_parameter">引数なしの match() の使用</h3> + +<pre class="brush: js">let str = "Nothing will come of nothing."; + +str.match(); // returns [""]</pre> + +<h3 id="A_non-RegExp_object_as_the_parameter" name="A_non-RegExp_object_as_the_parameter">RegExp ではないオブジェクトを引数にする</h3> + +<p>引数 <code><var>regexp</var></code> が文字列または数値である場合、暗黙に <code>new RegExp(<var>regexp</var>)</code> を使用して {{jsxref("RegExp")}} に変換されます。</p> + +<p>正の符号がついた正の数であった場合、 <code>RegExp()</code> は正の符号を無視します。</p> + +<pre class="brush: js">let str1 = "NaN means not a number. Infinity contains -Infinity and +Infinity in JavaScript.", + str2 = "My grandfather is 65 years old and My grandmother is 63 years old.", + str3 = "The contract was declared null and void."; +str1.match("number"); // "number" is a string. returns ["number"] +str1.match(NaN); // the type of NaN is the number. returns ["NaN"] +str1.match(Infinity); // the type of Infinity is the number. returns ["Infinity"] +str1.match(+Infinity); // returns ["Infinity"] +str1.match(-Infinity); // returns ["-Infinity"] +str2.match(65); // returns ["65"] +str2.match(+65); // A number with a positive sign. returns ["65"] +str3.match(null); // returns ["null"]</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.match', 'String.prototype.match')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<h3 id="Basic_support_for_match" name="Basic_support_for_match"><code>match()</code> の基本対応</h3> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.String.match")}}</p> + +<h3 id="Support_for_named_capture_groups" name="Support_for_named_capture_groups">名前付きキャプチャグループの対応</h3> + +<p>{{Compat("javascript.builtins.RegExp.named_capture_groups")}}</p> + +<h2 id="Firefox-specific_notes" name="Firefox-specific_notes">Firefox 特有のメモ</h2> + +<ul> + <li>標準外の第二引数 <code>flags</code> が Firefox のみで <code><var>str</var>.match(<var>regexp, flags</var>)</code> のように使用できました。 Firefox 49 以降では削除されています。</li> + <li>Firefox 27 において、このメソッドは ECMAScript 仕様書に合うように調整されました。 <code>match()</code> がグローバルの正規表現で呼び出された場合、 {{jsxref("RegExp.lastIndex")}} プロパティは (もしあれば) <code>0</code> にリセットされるようになりました (<a href="https://bugzilla.mozilla.org/show_bug.cgi?id=501739">bug 501739</a>)。</li> +</ul> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("String.prototype.matchAll()")}}</li> + <li>{{jsxref("RegExp")}}</li> + <li>{{jsxref("RegExp.prototype.exec()")}}</li> + <li>{{jsxref("RegExp.prototype.test()")}}</li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/matchall/index.html b/files/ja/web/javascript/reference/global_objects/string/matchall/index.html new file mode 100644 index 0000000000..12332968b5 --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/matchall/index.html @@ -0,0 +1,145 @@ +--- +title: String.prototype.matchAll() +slug: Web/JavaScript/Reference/Global_Objects/String/matchAll +tags: + - JavaScript + - Method + - Prototype + - Reference + - Regular Expressions + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/matchAll +--- +<div>{{JSRef}}</div> + +<p><strong><code>matchAll()</code></strong> は<a href="/ja/docs/Web/JavaScript/Guide/Regular_Expressions/Groups_and_Ranges">キャプチャグループ</a>を含む<em><a href="/ja/docs/Web/JavaScript/Guide/Regular_Expressions">正規表現</a></em>に一致するすべての<var>文字列</var>をイテレーターで返すメソッドです。</p> + +<div>{{EmbedInteractiveExample("pages/js/string-matchall.html")}}</div> + +<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox notranslate"><var>str</var>.matchAll(<var>regexp</var>)</pre> + +<h3 id="Parameters">Parameters</h3> + +<dl> + <dt><code><var>regexp</var></code></dt> + <dd> + <p>正規表現オブジェクトです。</p> + + <p><code>RegExp</code> でないオブジェクト <code><var>obj</var></code> が渡された場合は {{jsxref("RegExp")}} オブジェクトに <code>new RegExp(<var>obj</var>)</code> を使用して暗黙的に変換されます。</p> + + <p><code>RegExp</code> オブジェクトには <code>/g</code> フラグが必須であり、ない場合は <code>TypeError</code> が発生します。</p> + </dd> +</dl> + +<h3 id="Return_value" name="Return_value">返値</h3> + +<p><a href="/ja/docs/Web/JavaScript/Guide/Iterators_and_Generators">イテレーター</a> (再起動不可能なもの)。</p> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Regexp.exec_and_matchAll" name="Regexp.exec_and_matchAll">Regexp.exec() と matchAll()</h3> + +<p><code>matchAll</code> が JavaScript に追加される前は、 <a href="/ja/docs/Web/JavaScript/Reference/Global_Objects/RegExp/exec">regexp.exec</a> (および <code>/g</code> フラグ付きの正規表現) をループの中で呼び出すことですべての一致結果を取得することができました。</p> + +<pre class="brush: js notranslate">const regexp = RegExp('foo[a-z]*','g'); +const str = 'table football, foosball'; +let match; + +while ((match = regexp.exec(str)) !== null) { + console.log(`Found ${match[0]} start=${match.index} end=${regexp.lastIndex}.`); + // expected output: "Found football start=6 end=14." + // expected output: "Found foosball start=16 end=24." +}</pre> + +<p><code>matchAll</code> が使えるようになったことで、 {{jsxref("Statements/while", "while")}} によるループと、 <code>g</code> 付きの <code>exec</code> を避けることができます。</p> + +<p>また代わりに <code>matchAll</code> を使うことで、 {{jsxref("Statements/for...of", "for...of")}}、 {{jsxref("Operators/Spread_syntax", "配列スプレッド", "", 1)}}、 {{jsxref("Array.from()")}} 構造と効率よく組み合わせることができます。</p> + +<pre class="brush: js notranslate">const regexp = RegExp('foo[a-z]*','g'); +const str = 'table football, foosball'; +const matches = str.matchAll(regexp); + +for (const match of matches) { + console.log(`Found ${match[0]} start=${match.index} end=${match.index + match[0].length}.`); +} +// expected output: "Found football start=6 end=14." +// expected output: "Found foosball start=16 end=24." + +// matches iterator is exhausted after the for..of iteration +// Call matchAll again to create a new iterator +Array.from(str.matchAll(regexp), m => m[0]); +// Array [ "football", "foosball" ]</pre> + +<p><code>matchAll</code> は、グローバル (<code>g</code>) フラグがない場合は例外が発生します。</p> + +<pre class="brush: js notranslate">const regexp = RegExp('[a-c]',''); +const str = 'abc'; +str.matchAll(regexp); +// TypeError +</pre> + +<p><code>matchAll</code> では内部的に {{jsxref("RegExp")}} オブジェクトをクローンします。そのため {{jsxref("Global_Objects/RegExp/exec", "regexp.exec()")}} とは違って文字列をスキャンした際に <code>lastIndex</code> が変わることはありません。</p> + +<pre class="brush: js notranslate">const regexp = RegExp('[a-c]','g'); +regexp.lastIndex = 1; +const str = 'abc'; +Array.from(str.matchAll(regexp), m => `${regexp.lastIndex} ${m[0]}`); +// Array [ "1 b", "1 c" ]</pre> + +<h3 id="Better_access_to_capturing_groups_than_String.prototype.match" name="Better_access_to_capturing_groups_than_String.prototype.match">キャプチャリンググループへのより良いアクセス(String.prototype.match()との比較)</h3> + +<p><code>matchAll</code> はキャプチャグループへのよりよいアクセスを実現します。</p> + +<p>{{jsxref("Global_Objects/String/match", "match()")}} では、グローバル <code>/g</code> フラグを使用するとキャプチャグループが無視されてしまいます。</p> + +<pre class="brush: js notranslate">let regexp = /t(e)(st(\d?))/g; +let str = 'test1test2'; + +str.match(regexp); +// Array ['test1', 'test2']</pre> + +<p><code>matchAll</code> を使えば簡単にキャプチャグループにアクセスできます。</p> + +<pre class="brush: js notranslate">let array = [...str.matchAll(regexp)]; + +array[0]; +// ['test1', 'e', 'st1', '1', index: 0, input: 'test1test2', length: 4] +array[1]; +// ['test2', 'e', 'st2', '2', index: 5, input: 'test1test2', length: 4] +</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.matchall', 'String.prototype.matchAll')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.String.matchAll")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("String.prototype.match()")}}</li> + <li><a href="/ja/docs/Web/JavaScript/Guide/Regular_Expressions">JavaScript での正規表現の使用</a></li> + <li><a href="/ja/docs/Web/JavaScript/Guide/Regular_Expressions/Groups_and_Ranges">Capturing groups</a></li> + <li>{{jsxref("RegExp")}}</li> + <li>{{jsxref("RegExp.prototype.exec()")}}</li> + <li>{{jsxref("RegExp.prototype.test()")}}</li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/normalize/index.html b/files/ja/web/javascript/reference/global_objects/string/normalize/index.html new file mode 100644 index 0000000000..27fc061f8c --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/normalize/index.html @@ -0,0 +1,229 @@ +--- +title: String.prototype.normalize() +slug: Web/JavaScript/Reference/Global_Objects/String/normalize +tags: + - ECMAScript 2015 + - JavaScript + - Method + - Prototype + - Reference + - String + - Unicode + - メソッド +translation_of: Web/JavaScript/Reference/Global_Objects/String/normalize +--- +<div>{{JSRef}}</div> + +<p><strong><code>normalize()</code></strong> メソッドは、文字列の Unicode 正規化形式を返します。</p> + +<div>{{EmbedInteractiveExample("pages/js/string-normalize.html", "taller")}}</div> + +<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox"><code><var>str</var>.normalize([<var>form</var>])</code></pre> + +<h3 id="Parameters" name="Parameters">引数</h3> + +<dl> + <dt><code><var>form</var></code> {{optional_inline}}</dt> + <dd> + <p>Unicode 正規化形式を示す "<code>NFC</code>", "<code>NFD</code>", "<code>NFKC</code>", "<code>NFKD</code>" のうちの一つです。省略されたり {{jsxref("undefined")}} であったりした場合は "<code>NFC</code>" が使われます。</p> + + <p>これらの値には以下の意味があります。</p> + + <dl> + <dt>"<code>NFC</code>"</dt> + <dd>正規化形式 C。正準等価性によって分解され、再度合成される。</dd> + <dt>"<code>NFD</code>"</dt> + <dd>正規化形式 D。正準等価性によって分解される。</dd> + <dt>"<code>NFKC</code>"</dt> + <dd>正規化形式 KC。互換等価性によって分解され、正準等価性によって再度合成される。</dd> + <dt>"<code>NFKD</code>"</dt> + <dd>正規化形式 KD。互換等価性によって分解される。</dd> + </dl> + </dd> +</dl> + +<h3 id="Return_value" name="Return_value">返値</h3> + +<p>与えられた文字列の Unicode 正規化形式を含む文字列です。</p> + +<h3 id="Errors_thrown" name="Errors_thrown">発生するエラー</h3> + +<dl> + <dt>{{jsxref("RangeError")}}</dt> + <dd><code>form</code> が上記で指定された値のいずれでもない場合は {{jsxref("RangeError")}} が発生します。</dd> +</dl> + +<h2 id="Description" name="Description">解説</h2> + +<p>Unicode は個々の文字に対して、<em>コードポイント</em>と呼ばれる固有の値を割り当てています。例えば、 "<code>A</code>" のコードポイントは U+0041 が割り当てられています。しかし、複数のコードポイントや、コードポイントの一連の並びが、同一の抽象文字を表すことがあります。 — 例えば、 "<code>ñ</code>" の文字は以下のいずれかで表すことができます。</p> + +<ul> + <li>単一のコードポイント U+00F1</li> + <li>"<code>n</code>" のコードポイント (U+006E) に続いて組み合わせチルダのコードポイント (U+0303)</li> +</ul> + +<pre class="brush: js">let string1 = '\u00F1'; +let string2 = '\u006E\u0303'; + +console.log(string1); // ñ +console.log(string2); // ñ +</pre> + +<p>しかし、コードポイントが異なるため、文字列の比較ではこれらが同じものとして扱われません。また、それぞれのコードポイントの数が異なるため、長さすら異なります。</p> + +<pre class="brush: js">let string1 = '\u00F1'; // ñ +let string2 = '\u006E\u0303'; // ñ + +console.log(string1 === string2); // false +console.log(string1.length); // 1 +console.log(string2.length); // 2 +</pre> + +<p><code>normalize()</code> メソッドは、同じ文字を表すコードポイントのすべての並びを共通の正規化された形式に文字列を変換することで、この問題を解決するのに役立ちます。正規化の方法は主に二つがあり、一つは<strong>正準等価性</strong>に、もう一つは<strong>互換等価性</strong>に基づきます。</p> + +<h3 id="Canonical_equivalence_normalization" name="Canonical_equivalence_normalization">正準等価性による正規化</h3> + +<p>Unicode では、二つのコードポイントの並びが同じ抽象文字を表していれば、正準等価性があるとされ、常に同じ外見表示と動作をするべきです (例えば、並べ替えで常に同じものとして扱うべきです)。</p> + +<p><code>normalize()</code> を "<code>NFD</code>" または "<code>NFC</code>" の引数で使用することで、すべてが正準等価な文字列となる文字列の形を生成することができます。以下の例では、文字 "<code>ñ</code>" の二つの表現を正規化しています。</p> + +<pre class="brush: js">let string1 = '\u00F1'; // ñ +let string2 = '\u006E\u0303'; // ñ + +string1 = string1.normalize('NFD'); +string2 = string2.normalize('NFD'); + +console.log(string1 === string2); // true +console.log(string1.length); // 2 +console.log(string2.length); // 2 +</pre> + +<h4 id="Composed_and_decomposed_forms" name="Composed_and_decomposed_forms">合成形と分解形</h4> + +<p>"<code>NFD</code>" で正規化された形の長さが <code>2</code> であることに注意してください。 "<code>NFD</code>" は<strong>分解</strong>正規形を生成するからであり、これは単一のコードポイントを複数のコードポイントの組み合わせに分解します。 "<code>ñ</code>" の分解正規形は "<code>\u006E\u0303</code>" です。</p> + +<p>"<code>NFC</code>" を指定すると<strong>合成</strong>正規形を取得することができ、これは複数のコードポイントを可能な限り単一のコードポイントで置き換えます。 "<code>ñ</code>" の合成正規形は "<code>\u00F1</code>" です。</p> + +<pre class="brush: js">let string1 = '\u00F1'; // ñ +let string2 = '\u006E\u0303'; // ñ + +string1 = string1.normalize('NFC'); +string2 = string2.normalize('NFC'); + +console.log(string1 === string2); // true +console.log(string1.length); // 1 +console.log(string2.length); // 1 +console.log(string2.codePointAt(0).toString(16)); // f1</pre> + +<h3 id="Compatibility_normalization" name="Compatibility_normalization">互換正規形</h3> + +<p>Unicode では、二つのコードポイントの並びが、同じ抽象文字を表す場合に互換性があり、場合によっては同じ文字として扱われるべきですが、すべてのアプリケーションでそうするべきとは限らないことがあります。</p> + +<p>すべての正準等価な並びは互換といえますが、逆はそうとはいえません。</p> + +<p>例を挙げます。</p> + +<ul> + <li>コードポイント U+FB00 は{{Glossary("ligature", "合字")}} "<code>ff</code>" を表します。これは二つの連続したコードポイント U+0066 ("<code>ff</code>") と互換性があります。</li> + <li>コードポイント U+24B9 は、記号 <code>"Ⓓ"</code> を表します。これは U+0044 のコードポイント ("<code>D</code>") と互換性があります。</li> +</ul> + +<p>場面によっては (並べ替えなど) 同じものとしてみなされるべきであり、その他の場合は (外見など) 同じとするべきではないので、これらは厳密には等しくありません。</p> + +<p><code>normalize()</code> を "<code>NFKD</code>" または "<code>NFKC</code>" を引数にして使用することで、互換等価な文字列が同じになる形の文字列を生成することができます。</p> + +<pre class="brush: js">let string1 = '\uFB00'; +let string2 = '\u0066\u0066'; + +console.log(string1); // ff +console.log(string2); // ff +console.log(string1 === string2); // false +console.log(string1.length); // 1 +console.log(string2.length); // 2 + +string1 = string1.normalize('NFKD'); +string2 = string2.normalize('NFKD'); + +console.log(string1); // ff <- 外見が変わった +console.log(string2); // ff +console.log(string1 === string2); // true +console.log(string1.length); // 2 +console.log(string2.length); // 2 +</pre> + +<p>互換等価な正規化を適用する際には、正規化された形式がすべてのアプリケーションに適しているとは限らないので、文字列で何をしようとしているのかを考慮することが重要です。上の例では、ユーザーが "<code>f</code>" を検索すれば文字列を見つけることができるので、正規化は検索に適しています。しかし、視覚的な表現が異なるため、表示には適切ではないかもしれません。</p> + +<p>正準等価な正規化のように、分解形または合成形の互換等価形式は、それぞれ "<code>NFKD</code>" または "<code>NFKC</code>" を渡すことで問い合わせることができます。</p> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Using_normalize" name="Using_normalize"><code>normalize()</code> を使う</h3> + +<pre class="brush: js">// 最初の文字列 + +// U+1E9B: LATIN SMALL LETTER LONG S WITH DOT ABOVE +// U+0323: COMBINING DOT BELOW +let str = '\u1E9B\u0323'; + + +// Canonically-composed form (NFC) + +// U+1E9B: LATIN SMALL LETTER LONG S WITH DOT ABOVE +// U+0323: COMBINING DOT BELOW +str.normalize('NFC'); // '\u1E9B\u0323' +str.normalize(); // same as above + + +// Canonically-decomposed form (NFD) + +// U+017F: LATIN SMALL LETTER LONG S +// U+0323: COMBINING DOT BELOW +// U+0307: COMBINING DOT ABOVE +str.normalize('NFD'); // '\u017F\u0323\u0307' + + +// Compatibly-composed (NFKC) + +// U+1E69: LATIN SMALL LETTER S WITH DOT BELOW AND DOT ABOVE +str.normalize('NFKC'); // '\u1E69' + + +// Compatibly-decomposed (NFKD) + +// U+0073: LATIN SMALL LETTER S +// U+0323: COMBINING DOT BELOW +// U+0307: COMBINING DOT ABOVE +str.normalize('NFKD'); // '\u0073\u0323\u0307' +</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.normalize', 'String.prototype.normalize')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.String.normalize")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li><a href="http://www.unicode.org/reports/tr15/">Unicode Standard Annex #15, Unicode Normalization Forms</a></li> + <li><a href="http://en.wikipedia.org/wiki/Unicode_equivalence">Unicode equivalence</a></li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/padend/index.html b/files/ja/web/javascript/reference/global_objects/string/padend/index.html new file mode 100644 index 0000000000..feb714c3ca --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/padend/index.html @@ -0,0 +1,71 @@ +--- +title: String.prototype.padEnd() +slug: Web/JavaScript/Reference/Global_Objects/String/padEnd +tags: + - JavaScript + - Method + - Prototype + - Reference + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/padEnd +--- +<div>{{JSRef}}</div> + +<p><strong><code>padEnd()</code></strong> メソッドは、結果の文字列が指定した長さになるように、現在の文字列を他の文字列で (必要に応じて繰り返して) 延長します。延長は、現在の文字列の末尾から適用されます。</p> + +<div>{{EmbedInteractiveExample("pages/js/string-padend.html")}}</div> + +<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox notranslate"><var>str</var>.padEnd(<var>targetLength</var> [, <var>padString</var>])</pre> + +<h3 id="Parameters" name="Parameters">引数</h3> + +<dl> + <dt><code><var>targetLength</var></code></dt> + <dd>現在の文字列の延長後に返される文字列の長さです。この値が現在の文字列の長さよりも短い場合、現在の文字列が返されます。</dd> + <dt><code><var>padString</var></code> {{optional_inline}}</dt> + <dd>現在の文字列を延長するための文字列です。この文字列が <code><var>targetLength</var></code> に収まらないほど長い場合は、左書きの言語では最も左の部分が、右書きの言語では最も右の部分が使用され、残りは切り捨てられます。この引数の既定値は、 "<code> </code>" (<code>U+0020</code> 空白) です。</dd> +</dl> + +<h3 id="Return_value" name="Return_value">返値</h3> + +<p>{{jsxref("String")}} で、 <code><var>targetLength</var></code> で指定された長さにするために、 <code><var>padString</var></code> を現在の <code><var>str</var></code> の末尾に適用したものです。</p> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Using_padEnd" name="Using_padEnd">padEnd の使用</h3> + +<pre class="brush: js notranslate">'abc'.padEnd(10); // "abc " +'abc'.padEnd(10, "foo"); // "abcfoofoof" +'abc'.padEnd(6, "123456"); // "abc123" +'abc'.padEnd(1); // "abc"</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.padend', 'String.prototype.padEnd')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.String.padEnd")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("String.prototype.padStart()")}}</li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/padstart/index.html b/files/ja/web/javascript/reference/global_objects/string/padstart/index.html new file mode 100644 index 0000000000..7aca37f9a2 --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/padstart/index.html @@ -0,0 +1,88 @@ +--- +title: String.prototype.padStart() +slug: Web/JavaScript/Reference/Global_Objects/String/padStart +tags: + - Advanced + - Intermediate + - JavaScript + - Method + - Prototype + - Reference + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/padStart +--- +<div>{{JSRef}}</div> + +<p><span class="seoSummary"><strong><code>padStart()</code></strong> メソッドは、結果の文字列が指定した長さになるように、現在の文字列を他の文字列で (必要に応じて繰り返して) 延長します。</span>延長は、現在の文字列の先頭から適用されます。</p> + +<div>{{EmbedInteractiveExample("pages/js/string-padstart.html")}}</div> + +<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox notranslate"><var>str</var>.padStart(<var>targetLength</var> [, <var>padString</var>])</pre> + +<h3 id="Parameters" name="Parameters">引数</h3> + +<dl> + <dt><code><var>targetLength</var></code></dt> + <dd>現在の <code><var>str</var></code> の延長後に返される文字列の長さです。この値が <code><var>str.</var>length</code> よりも短い場合、 <code><var>str</var></code> がそのまま返されます。</dd> + <dt><code><var>padString</var></code> {{optional_inline}}</dt> + <dd>現在の <code><var>str</var></code> を延長するための文字列です。 <code><var>padString</var></code> が <code><var>targetLength</var></code> より長い場合は、右からその長さ分が切り捨てられます。この引数の既定値は、 "<code> </code>" (<code>U+0020 'SPACE'</code>) です。</dd> +</dl> + +<h3 id="Return_value" name="Return_value">返値</h3> + +<p>現在の文字列の先頭に <code><var>padString</var></code> が適用された、指定された <code><var>targetLength</var></code> の長さの {{jsxref("String")}} です。</p> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Basic_examples" name="Basic_examples">基本的な例</h3> + +<pre class="brush: js notranslate">'abc'.padStart(10); // " abc" +'abc'.padStart(10, "foo"); // "foofoofabc" +'abc'.padStart(6,"123465"); // "123abc" +'abc'.padStart(8, "0"); // "00000abc" +'abc'.padStart(1); // "abc"</pre> + +<h3 id="Fixed_width_string_number_conversion" name="Fixed_width_string_number_conversion">数値を固定長文字列へ変換</h3> + +<pre class="brush: js notranslate">// Javascript version of: (unsigned) +// printf "%0*d" width num +function leftFillNum(num, targetLength) { + return num.toString().padStart(targetLength, 0); +} + +const num = 123; +console.log(leftFillNum(num, 5)); +// expected output: "00123" +</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.padstart', 'String.prototype.padStart')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.String.padStart")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("String.prototype.padEnd()")}}</li> + <li><a href="https://github.com/uxitten/polyfill/blob/master/string.polyfill.js">A polyfill</a></li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/quote/index.html b/files/ja/web/javascript/reference/global_objects/string/quote/index.html new file mode 100644 index 0000000000..2a074faf32 --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/quote/index.html @@ -0,0 +1,75 @@ +--- +title: String.prototype.quote() +slug: Web/JavaScript/Reference/Global_Objects/String/quote +tags: + - String + - String Methods +translation_of: Archive/Web/JavaScript/String.quote +--- +<div>{{JSRef}} {{obsolete_header("37")}} {{non-standard_header}}</div> + +<p>特殊文字をエスケープシーケンスで置換しダブル・クォーテーション(<code>"</code>)でラップした文字列のコピーを返します。</p> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox"><code><em>str</em>.quote()</code></pre> + +<h3 id="Return_value">Return value</h3> + +<p>A new string representing the original string wrapped in double-quotes, with any special characters escaped.</p> + +<h2 id="Examples" name="Examples">例</h2> + +<p>In the table below thequote()method replaces any special characters and wraps the strings in double-quotes. Also note the third column where a wrapped {{jsxref("Global_Objects/eval", "eval()")}} evaluates the escape sequences again.</p> + +<table class="fullwidth-table" style="width: 100%;"> + <thead> + <tr> + <th class="header" scope="col"><code>str</code></th> + <th class="header" scope="col"><code>str.quote()</code></th> + <th class="header" scope="col"><code><a href="/ja/docs/JavaScript/Reference/Global_Objects/eval" title="JavaScript/Reference/Global_Objects/eval">eval</a>( str.quote() )</code></th> + </tr> + </thead> + <tbody> + <tr> + <td><code>Hello world!</code></td> + <td><code>"Hello world!"</code></td> + <td><code>Hello world!</code></td> + </tr> + <tr> + <td><code>Hello<br> + world!</code></td> + <td><code>"Hello\n\tworld!"</code></td> + <td><code>Hello<br> + world!</code></td> + </tr> + <tr> + <td><code>" \ — '</code></td> + <td><code>"\" \\ \u2014 '"</code></td> + <td><code>" \ — '</code></td> + </tr> + </tbody> +</table> + +<h2 id="仕様">仕様</h2> + +<p>Not part of any standard. Implemented in JavaScript 1.3.</p> + +<h2 id="ポリフィル">ポリフィル</h2> + +<pre class="syntaxbox"><code>if (!String.prototype.quote) + String.prototype.quote = function(){ + return JSON.stringify( this ); // since IE8 +</code> }</pre> + +<h2 id="ブラウザ互換性情報">ブラウザ互換性情報</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.String.quote")}}</p> + +<h2 id="関連情報">関連情報</h2> + +<ul> + <li>{{jsxref("JSON.stringify()")}}</li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/raw/index.html b/files/ja/web/javascript/reference/global_objects/string/raw/index.html new file mode 100644 index 0000000000..520def68d3 --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/raw/index.html @@ -0,0 +1,118 @@ +--- +title: String.raw() +slug: Web/JavaScript/Reference/Global_Objects/String/raw +tags: + - ECMAScript 2015 + - JavaScript + - Method + - Reference + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/raw +--- +<div>{{JSRef}}</div> + +<p><span class="seoSummary"><strong><code>String.raw()</code></strong> 静的メソッドは、<a href="/ja/docs/Web/JavaScript/Reference/template_strings">文字列リテラル</a>のためのタグ関数です。この関数は Python の文字列リテラルの <code>r</code> 接頭辞や C# の文字列リテラルの <code>@</code> 接頭辞に似ています (それでも違いがあります。<a href="https://bugs.chromium.org/p/v8/issues/detail?id=5016">この問題に関するスレッド</a>の説明を参照してください)。この関数は、テンプレート文字列の生の文字列形式を取得するために使用されます。つまり、置換 (例えば <code>${foo}</code>) は行われますが、エスケープ (例えば <code>\n</code>) は実行されません。</span></p> + +<div>{{EmbedInteractiveExample("pages/js/string-raw.html")}}</div> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox notranslate"><code>String.raw(<var>callSite</var>, <var>...substitutions</var>) + +String.raw`<var>templateString</var>` +</code></pre> + +<h3 id="Parameters" name="Parameters">引数</h3> + +<dl> + <dt><code><var>callSite</var></code></dt> + <dd><code>{ raw: 'string' }</code> のような、よく形成されたテンプレート呼び出しサイトオブジェクトです。</dd> + <dt><code><var>...substitutions</var></code></dt> + <dd>置換される値が含まれます。</dd> + <dt><code><var>templateString</var></code></dt> + <dd>{{jsxref("template_strings", "テンプレート文字列", "", 1)}}です。必要に応じて置換します (<code>${...}</code>)。</dd> +</dl> + +<h3 id="Return_value" name="Return_value">返値</h3> + +<p>与えられたテンプレート文字列の生の文字列形式です。</p> + +<h3 id="Exceptions" name="Exceptions">例外</h3> + +<dl> + <dt>{{jsxref("TypeError")}}</dt> + <dd>第1 引数が正常に形成されていないオブジェクトの場合、{{jsxref("TypeError")}} が発生します。</dd> +</dl> + +<h2 id="Description" name="Description">説明</h2> + +<p>ほとんどの場合、<code>String.raw()</code> はテンプレート文字列とともに使用されます。上記の最初の構文は、JavaScript エンジンが (他の<a href="/ja/docs/Web/JavaScript/Reference/template_strings#Tagged_template_strings">タグ関数</a>のように) 適切な引数で呼び出すので、実際に使用されます。</p> + +<p><code>String.raw()</code> はテンプレート文字列の唯一の組込みタグ関数です。既定のテンプレート関数のように動作し、連結を行います。通常の JavaScript コードで再実装することができます。</p> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Using_String.raw" name="Using_String.raw">String.raw() の使用</h3> + +<pre class="brush: js notranslate">String.raw`Hi\n${2+3}!`; +// 'Hi\n5!', the character after 'Hi' +// is not a newline character, +// '\' and 'n' are two characters. + +String.raw`Hi\u000A!`; +// 'Hi\u000A!', same here, this time we will get the +// \, u, 0, 0, 0, A, 6 characters. +// All kinds of escape characters will be ineffective +// and backslashes will be present in the output string. +// You can confirm this by checking the .length property +// of the string. + +let name = 'Bob'; +String.raw`Hi\n${name}!`; +// 'Hi\nBob!', substitutions are processed. + +// Normally you would not call String.raw() as a function, +// but to simulate `foo${2 + 3}bar${'Java' + 'Script'}baz` you can do: +String.raw({ + raw: ['foo', 'bar', 'baz'] +}, 2 + 3, 'Java' + 'Script'); // 'foo5barJavaScriptbaz' +// Notice the first argument is an object with a 'raw' property, +// whose value is an iterable representing the separated strings +// in the template literal. +// The rest of the arguments are the substitutions. + +// The first argument’s 'raw' value can be any iterable, even a string! +// For example, 'test' is treated as ['t', 'e', 's', 't']. +// The following is equivalent to +// `t${0}e${1}s${2}t`: +String.raw({ raw: 'test' }, 0, 1, 2); // 't0e1s2t' +</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.raw', 'String.raw')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.String.raw")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li><a href="/ja/docs/Web/JavaScript/Reference/template_strings">テンプレート文字列</a></li> + <li>{{jsxref("String")}}</li> + <li><a href="/ja/docs/Web/JavaScript/Reference/Lexical_grammar">字句文法</a></li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/repeat/index.html b/files/ja/web/javascript/reference/global_objects/string/repeat/index.html new file mode 100644 index 0000000000..4304fd9786 --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/repeat/index.html @@ -0,0 +1,128 @@ +--- +title: String.prototype.repeat() +slug: Web/JavaScript/Reference/Global_Objects/String/repeat +tags: + - ECMAScript 2015 + - JavaScript + - Method + - Prototype + - Reference + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/repeat +--- +<div>{{JSRef}}</div> + +<p><strong><code>repeat()</code></strong> メソッドは、呼び出し元の文字列を指定した数だけコピーして結合した新しい文字列を構築して返します。</p> + +<div>{{EmbedInteractiveExample("pages/js/string-repeat.html","shorter")}}</div> + +<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox notranslate"><var>str</var>.repeat(<var>count</var>)</pre> + +<h3 id="Parameters" name="Parameters">引数</h3> + +<dl> + <dt><code><var>count</var></code></dt> + <dd><code>0</code> から{{jsxref("Global_Objects/Number/POSITIVE_INFINITY", "正の無限大")}}までの間の整数で、文字列を繰り返す数を示します。</dd> +</dl> + +<h3 id="Return_value" name="Return_value">返値</h3> + +<p>与えられた文字列の指定した回数分のコピーを含む新しい文字列です。</p> + +<h3 id="Exceptions" name="Exceptions">例外</h3> + +<ul> + <li>{{jsxref("Errors/Negative_repetition_count", "RangeError")}}: 繰り返し数は非負数でなければなりません。</li> + <li>{{jsxref("Errors/Resulting_string_too_large", "RangeError")}}: 繰り返し数は無限大よりも小さく、文字列の最大長を超えないようにしなければなりません。</li> +</ul> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Using_repeat" name="Using_repeat">repeat() の使用</h3> + +<pre class="brush: js notranslate">'abc'.repeat(-1) // RangeError +'abc'.repeat(0) // '' +'abc'.repeat(1) // 'abc' +'abc'.repeat(2) // 'abcabc' +'abc'.repeat(3.5) // 'abcabcabc' (小数は丸められ、整数の結果が返されます) +'abc'.repeat(1/0) // RangeError + +({ toString: () => 'abc', repeat: String.prototype.repeat }).repeat(2) +// 'abcabc' (repeat() は汎用メソッドです) +</pre> + +<h2 id="Polyfill" name="Polyfill">ポリフィル</h2> + +<p>このメソッドは ECMAScript 2015 仕様で追加されたため、まだすべての JavaScript の実装で使用できるわけではありません。しかし、次のスニペットで <code>String.prototype.repeat()</code> を代替することができます。</p> + +<pre class="notranslate">if (!String.prototype.repeat) { + String.prototype.repeat = function(count) { + 'use strict'; + if (this == null) + throw new TypeError('can\'t convert ' + this + ' to object'); + + var str = '' + this; + // To convert string to integer. + count = +count; + // Check NaN + if (count != count) + count = 0; + + if (count < 0) + throw new RangeError('repeat count must be non-negative'); + + if (count == Infinity) + throw new RangeError('repeat count must be less than infinity'); + + count = Math.floor(count); + if (str.length == 0 || count == 0) + return ''; + + // Ensuring count is a 31-bit integer allows us to heavily optimize the + // main part. But anyway, most current (August 2014) browsers can't handle + // strings 1 << 28 chars or longer, so: + if (str.length * count >= 1 << 28) + throw new RangeError('repeat count must not overflow maximum string size'); + + var maxCount = str.length * count; + count = Math.floor(Math.log(count) / Math.log(2)); + while (count) { + str += str; + count--; + } + str += str.substring(0, maxCount - str.length); + return str; + } +} +</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.repeat', 'String.prototype.repeat')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.String.repeat")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("String.prototype.concat()")}}</li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/replace/index.html b/files/ja/web/javascript/reference/global_objects/string/replace/index.html new file mode 100644 index 0000000000..4145550f59 --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/replace/index.html @@ -0,0 +1,296 @@ +--- +title: String.prototype.replace() +slug: Web/JavaScript/Reference/Global_Objects/String/replace +tags: + - Expressions + - JavaScript + - Methods + - Prototype + - Reference + - Regular + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/replace +--- +<div>{{JSRef}}</div> + +<p><span class="seoSummary"><strong><code>replace()</code></strong> メソッドは、<code>pattern</code> にマッチした文字列の一部またはすべてを <code>replacement</code> で置き換えた新しい文字列を返します。</span><code>pattern</code> は文字列または {{jsxref("RegExp")}}、<code>replacement</code> は文字列または各マッチで呼び出される関数です。<code>pattern</code> が文字列の場合、最初に一致した箇所のみを置き換えます。</p> + +<p>元の文字列は変更されません。</p> + +<div>{{EmbedInteractiveExample("pages/js/string-replace.html")}}</div> + + + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox"><var>str</var>.replace(<var>regexp</var>|<var>substr</var>, <var>newSubstr</var>|<var>function</var>)</pre> + +<h3 id="Parameters" name="Parameters">引数</h3> + +<dl> + <dt><code>regexp</code> (pattern)</dt> + <dd>{{jsxref("RegExp")}} オブジェクト、またはリテラルです。マッチすると、第2引数の <code>newSubStr</code> または <code>function</code> の戻り値と置き換えられます。</dd> + <dt><code>substr</code> (pattern)</dt> + <dd><code>newSubStr</code> に置き換えられる {{jsxref("String")}} です。これは逐次的な文字列として扱われ、正規表現としては解釈されません。最初に出てきたものだけが置き換えられます。</dd> + <dt><code>newSubStr</code> (replacement)</dt> + <dd><code>regexp</code> や <code>substr</code> パラメーターで指定される部分文字列を置換する {{jsxref("String")}} です。数々の特別な置換パターンがサポートされます。下記の「{{anch("Specifying_a_string_as_a_parameter", "引数としての文字列の指定")}}」節を見てください。</dd> + <dt><code>function</code> (replacement)</dt> + <dd>新しい部分文字列を生成するために実行される関数で、<code>regexp</code> や <code>substr</code> でマッチしたものを置き換えるのに使われます。この関数に渡される引数は下記の「{{anch("Specifying_a_function_as_a_parameter", "引数としての関数の指定")}}」で述べられています。</dd> +</dl> + +<h3 id="Return_value" name="Return_value">戻り値</h3> + +<p>パターンにマッチした部分文字列の一部またはすべてを置換文字列で置き換えた新しい文字列です。</p> + +<h2 id="Description" name="Description">詳細</h2> + +<p>このメソッドは、それを呼び出した {{jsxref("String")}} オブジェクトを変化させません。戻り値として新しい文字列を返します。</p> + +<p>グローバルな検索と置換を動作させるためには、正規表現に <code>g</code> フラグを含める必要があります。</p> + +<h3 id="Specifying_a_string_as_a_parameter" name="Specifying_a_string_as_a_parameter">引数としての文字列の指定</h3> + +<p>置換文字列には以下の特殊な置換パターンを含めることができます。</p> + +<table class="standard-table"> + <tbody> + <tr> + <td class="header">パターン</td> + <td class="header">挿入</td> + </tr> + <tr> + <td><code>$$</code></td> + <td>"$" を挿入します。</td> + </tr> + <tr> + <td><code>$&</code></td> + <td>マッチした部分文字列を挿入します。</td> + </tr> + <tr> + <td><code>$`</code></td> + <td>マッチした部分文字列の直前の文字列の部分を挿入します。</td> + </tr> + <tr> + <td><code>$'</code></td> + <td>マッチした部分文字列の直後の文字列の部分を挿入します。</td> + </tr> + <tr> + <td><code>$<em>n</em></code></td> + <td><code><em>n</em></code> は 100 未満の正の整数です。第一引数が {{jsxref("RegExp")}} オブジェクトだった場合に <em>n</em> 番目の括弧でキャプチャされた文字列を挿入します。1, 2, ... でインデックスされることに注意してください。</td> + </tr> + </tbody> +</table> + +<h3 id="Specifying_a_function_as_a_parameter" name="Specifying_a_function_as_a_parameter">引数としての関数の指定</h3> + +<p>第二引数として関数を指定することができます。このとき、関数はマッチが完了された後に実行されます。関数呼び出しの結果(返り値)は、置換文字列として使われます(注記: 上記の特殊な置換パターンはこの場合には適用<strong>されません</strong>)。第一引数の正規表現がグローバルだと、置換されるべきマッチごとに関数が複数回実行されうることに注意してください。</p> + +<p>関数に与えられる引数は次の通りです。</p> + +<table class="standard-table"> + <tbody> + <tr> + <td class="header">名前</td> + <td class="header">与えられる値</td> + </tr> + <tr> + <td><code>match</code></td> + <td>マッチした部分文字列(上記の <code>$&</code> に対応)です。</td> + </tr> + <tr> + <td><code>p1, p2, ...</code></td> + <td><code>replace()</code> の第一引数が {{jsxref("RegExp")}} オブジェクトだった場合、<em>n</em> 番目の括弧でキャプチャされたグループの文字列(上記の <code>$1</code>, <code>$2</code>, などに対応)です。例えば <code>/(\a+)(\b+)/</code> が与えられた場合、<code>p1</code> は <code>\a+</code> に対するマッチ、<code>p2</code> は <code>\b+</code> に対するマッチとなります。</td> + </tr> + <tr> + <td><code>offset</code></td> + <td>マッチした部分文字列の、分析中の文字列全体の中でのオフセットです(例えば、文字列全体が <code>'abcd'</code> で、マッチした部分文字列が <code>'bc'</code> ならば、この引数は 1 となります)。</td> + </tr> + <tr> + <td><code>string</code></td> + <td>分析中の文字列全体です。</td> + </tr> + </tbody> +</table> + +<p>(引数の正確な個数は、第一引数が {{jsxref("RegExp")}} オブジェクトかどうか、そうならばさらに括弧でキャプチャされるサブマッチがいくつ指定されているかに依ります。)</p> + +<p>以下の例は <code>newString</code> に <code>'abc - 12345 - #$*%'</code> をセットします。</p> + +<pre class="brush: js">function replacer(match, p1, p2, p3, offset, string) { + // p1 is nondigits, p2 digits, and p3 non-alphanumerics + return [p1, p2, p3].join(' - '); +} +var newString = 'abc12345#$*%'.replace(/([^\d]*)(\d*)([^\w]*)/, replacer); +console.log(newString); // abc - 12345 - #$*% +</pre> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Defining_the_regular_expression_in_replace()" name="Defining_the_regular_expression_in_replace()"><code>replace()</code> で正規表現を利用する</h3> + +<p>以下の例では、<code>replace</code> メソッドで正規表現を利用しています。</p> + +<pre class="brush: js">var str = 'Twas the night before Xmas...'; +var newstr = str.replace(/xmas/i, 'Christmas'); +console.log(newstr); // Twas the night before Christmas... +</pre> + +<h3 id="Using_global_and_ignore_with_replace()" name="Using_global_and_ignore_with_replace()"><code>ignore</code> フラグと <code>global</code> フラグの利用</h3> + +<p>グローバルな置換は正規表現だけで行われます。以下の例では、正規表現で大文字と小文字の違いを無視するフラグ (<code>i</code>) とグローバルマッチのフラグ (<code>g</code>)を利用し <code>replace()</code> は'apples'が出てくるたびに'oranges'に置換します。</p> + +<pre class="brush: js">var re = /apples/gi; +var str = 'Apples are round, and apples are juicy.'; +var newstr = str.replace(re, 'oranges'); +console.log(newstr); // oranges are round, and oranges are juicy. +</pre> + +<p>この出力は 'oranges are round, and oranges are juicy' となります。</p> + +<h3 id="Switching_words_in_a_string" name="Switching_words_in_a_string">文字列内の単語の交換</h3> + +<p>文字列内の単語の位置を交換します。<code>$1</code> と <code>$2</code> を置き換えるパターンを使用しています。</p> + +<pre class="brush: js">var re = /(\w+)\s(\w+)/; +var str = 'John Smith'; +var newstr = str.replace(re, '$2, $1'); +console.log(newstr); // Smith, John +</pre> + +<p>この出力は 'Smith, John' となります。</p> + +<h3 id="Using_an_inline_function_that_modifies_the_matched_characters" name="Using_an_inline_function_that_modifies_the_matched_characters">マッチした文字を修正するインライン関数の使用</h3> + +<p>次の例では、文字列内に出現する大文字のすべては小文字に変換され、ハイフンがマッチした位置の直前に挿入されます。ここで重要なことは、追加の操作は、マッチしたアイテムが置換されて戻される前に必要とされるということです。</p> + +<p>置換する関数はマッチした断片をその関数の引数として適用します。そして、その引数を大文字小文字変形し、戻り値の直前にハイフンを連結します。</p> + +<pre class="brush: js">function styleHyphenFormat(propertyName) { + function upperToHyphenLower(match, offset, string) { + return (offset > 0 ? '-' : '') + match.toLowerCase(); + } + return propertyName.replace(/[A-Z]/g, upperToHyphenLower); +} +</pre> + +<p><code>styleHyphenFormat('borderTop')</code>を入力すると 'border-top'を返します。</p> + +<p>最終的な置換が作成される前にサブマッチの<em>結果</em> をさらに変形したい場合、関数を使わなくてはなりません。これは、<code>toLowerCase()</code> メソッドの前にマッチを評価することを強制します。関数無しにこれをマッチに使用した場合、その <code>toLowerCase()</code> メソッドは効果がないでしょう。</p> + +<pre class="brush:js">var newString = propertyName.replace(/[A-Z]/, '-' + '$&'.toLowerCase()); // 動作しないでしょう</pre> + +<p>これは、<code>'$&'.toLowerCase()</code> は、まずその文字がパターンとして使用される前に (<code>'$&'</code> という結果である ) 文字列リテラルとして評価されるだろうからです。</p> + +<h3 id="Replacing_a_Fahrenheit_degree_with_its_Celsius_equivalent" name="Replacing_a_Fahrenheit_degree_with_its_Celsius_equivalent">華氏温度を同等の摂氏温度と置き換える</h3> + +<p>以下の例は、ある華氏温度をそれと同等の摂氏温度と置き換えます。その華氏温度は F で終わる数でなければなりません。その関数は C で終わる摂氏を返します。例えば、入力される数が 212F である場合、その関数は 100C を返します。入力される数が 0F であった場合、その関数は -17.77777777777778C を返します。</p> + +<p>その正規表現 <code>test</code> は、任意の数が F で終わっているかチェックします。華氏温度の数は、関数の 第二引数 <code>p1</code> を通して、その関数にアクセスできます。その関数は文字列内で渡された華氏温度をベースとした摂氏の数を <code>f2c</code> にセットします。それから、<code>f2c</code> は、摂氏の数を返します。この関数は Perl の s///e フラグ {{訳注('s は substitute (置換する)の略。e は evaluate(評価する)の略です。詳細は <a href="http://perldoc.perl.org/perlop.html#Regexp-Quote-Like-Operators" title="perlop - perldoc.perl.org">perlop の Regexp Quote-Like Operators の項</a>(<a href="http://perldoc.jp/docs/perl/perlop.pod#Regexp32Quote-Like32Operators" title="perlop - Perl の演算子と優先順位 - perldoc.jp - #正規表現のクォート風の演算子">※perldoc.jp による日本語訳</a>)を参照してください。')}} と似ています。</p> + +<pre class="brush: js">function f2c(x) { + function convert(str, p1, offset, s) { + return ((p1 - 32) * 5/9) + 'C'; + } + var s = String(x); + var test = /(-?\d+(?:\.\d*)?)F\b/g; + return s.replace(test, convert); +} +</pre> + +<h3 id="Use_an_inline_function_with_a_regular_expression_to_avoid_for_loops" name="Use_an_inline_function_with_a_regular_expression_to_avoid_for_loops">インライン関数と正規表現で <code>for</code> ループを回避する</h3> + +<p>次の例では、あるパターンを持つ文字列を解析してオブジェクトの配列に変換します。</p> + +<p><strong>入力:</strong></p> + +<p><code>x</code>, <code>-</code>, <code>_</code> からなる文字列です。</p> + +<pre class="line-numbers language-html"><code class="language-html">x-x_ +x---x---x---x--- +x-xxx-xx-x- +x_x_x___x___x___</code></pre> + +<p><strong>出力ルール:</strong></p> + +<p><code>'x'</code> は <code>'on'</code> への切り替えを、<code>'-'</code> (ハイフン) は <code>'off'</code> への切り替えを表すとし、<code>'_'</code> (アンダースコア) は x の後に続いて <code>'on'</code> の長さを表すものとします。on と off の切り替わりをオブジェクトの配列で返します。</p> + +<pre class="brush: json">[ + { on: true, length: 1 }, // 一番最初の "x" で on になります。 + { on: false, length: 1 }, // その次の "-" で off になります。 + { on: true, length: 2 } // その次の "x" で on になり、"_" が一つ続いているため、長さは 2 になります。 + ... +] +</pre> + +<p><strong>スニペット</strong><strong>:</strong></p> + +<pre class="brush: js">var str = 'x-x_'; +var retArr = []; +str.replace(/(x_*)|(-)/g, function(match, p1, p2) { + if (p1) { retArr.push({ on: true, length: p1.length }); } + if (p2) { retArr.push({ on: false, length: 1 }); } +}); + +console.log(retArr); +</pre> + +<p>このスニペットは <code>for</code> を使わずに、上記の入出力ルールを満たす 3 オブジェクトからなる配列を生成します。</p> + +<h2 id="See_also" name="See_also">仕様</h2> + +<ul> +</ul> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">仕様書</th> + <th scope="col">策定状況</th> + <th scope="col">コメント</th> + </tr> + <tr> + <td>{{SpecName('ES3')}}</td> + <td>{{Spec2('ES3')}}</td> + <td>初期定義。JavaScript 1.2 で実装される。</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-15.5.4.11', 'String.prototype.replace')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES6', '#sec-string.prototype.replace', 'String.prototype.replace')}}</td> + <td>{{Spec2('ES6')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.replace', 'String.prototype.replace')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザー実装状況</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.String.replace")}}</p> + +<h2 id="Firefox-specific_notes" name="Firefox-specific_notes">Firefox 固有の注記</h2> + +<ul> + <li><code>flags</code> は Gecko のみで利用できる非標準の第3引数です : <var>str</var>.replace(<var>regexp</var>|<var>substr</var>, <var>newSubStr</var>|<var>function, flags</var>)</li> + <li>Gecko 27 {{geckoRelease(27)}} 以降、このメソッドは ECMAScript 標準に準拠するために補正されました。<code>replace()</code> がグローバルの正規表現とともに呼び出された場合、{{jsxref("RegExp.lastIndex")}} プロパティが(もし指定されていたなら)<code>0</code> にリセットされます ({{bug(501739)}})。</li> + <li>Gecko 39 {{geckoRelease(39)}} 以降、<code>flags</code> 引数は非推奨となり、コンソールに警告を投げます ({{bug(1142351)}})。</li> + <li>Gecko 47 {{geckoRelease(47)}} 以降、非標準の <code>flags</code> 引数は非リリース版でサポートされず、もうすぐ完全に削除されます ({{bug(1245801)}}).</li> + <li>Gecko 49 {{geckoRelease(49)}} 以降、非標準の <code>flags</code> 引数はもうサポートされません ({{bug(1108382)}}).</li> +</ul> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("String.prototype.match()")}}</li> + <li>{{jsxref("RegExp.prototype.exec()")}}</li> + <li>{{jsxref("RegExp.prototype.test()")}}</li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/search/index.html b/files/ja/web/javascript/reference/global_objects/string/search/index.html new file mode 100644 index 0000000000..4ec081e9ad --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/search/index.html @@ -0,0 +1,82 @@ +--- +title: String.prototype.search() +slug: Web/JavaScript/Reference/Global_Objects/String/search +tags: + - JavaScript + - Method + - Prototype + - Reference + - Regular Expressions + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/search +--- +<div>{{JSRef}}</div> + +<p><strong><code>search()</code></strong> メソッドは、対象の {{jsxref("String")}} オブジェクトが正規表現で一致するかどうかを調べるためのメソッドです。</p> + +<div>{{EmbedInteractiveExample("pages/js/string-search.html")}}</div> + +<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox notranslate"><var>str</var>.search(<var>regexp</var>)</pre> + +<h3 id="Parameters" name="Parameters">引数</h3> + +<dl> + <dt><code><var>regexp</var></code></dt> + <dd><a href="/ja/docs/Web/JavaScript/Guide/Regular_Expressions">regular expression</a>正規表現オブジェクトです。</dd> + <dd>正規表現でないオブジェクト <code><var>regexp</var></code> が渡された場合は {{jsxref("RegExp")}} オブジェクトに <code>new RegExp(<var>regexp</var>)</code> を使用して暗黙的に変換されます。</dd> +</dl> + +<h3 id="Return_value" name="Return_value">返値</h3> + +<p>与えられた文字列と正規表現の間で最初にマッチした箇所のインデックスを返します。マッチしなかった場合は <code>-1</code> を返します。</p> + +<h2 id="Description" name="Description">解説</h2> + +<p>あるパターンが見つかるかどうかを知りたい場合<em>や</em>、文字列の中の位置を知りたい場合は、 <code>search()</code> メソッドを利用してください。 (存在するかどうかを知りたいだけの場合は、 <code>RegExp</code> に同様のメソッドである {{jsxref("RegExp.prototype.test()", "test()")}} メソッドがあり、これは論理値を返します。</p> + +<p>より多くの情報が欲しい場合は (実行速度が遅くなりますが) {{jsxref("String.prototype.match()", "match()")}} メソッドを使用してください (同様のメソッドとして、{{jsxref("RegExp.prototype.exec()", "exec()")}} メソッドがあります)。</p> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Using_search" name="Using_search">search() の使用</h3> + +<p>次の例は、2つの異なる正規表現オブジェクトで文字列を検索し、成功した検索 (正の値) と失敗した検索 (<code>-1</code>) を表示します。</p> + +<pre class="brush: js notranslate">let str = "hey JudE" +let re = /[A-Z]/g +let reDot = /[.]/g +console.log(str.search(re)) // 最初の大文字 "J" の位置である 4 を返します +console.log(str.search(reDot)) // '.' ドット記号が見つからないので -1 を返します</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.search', 'String.prototype.search')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.String.search")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li><a href="/ja/docs/Web/JavaScript/Guide/Regular_Expressions">JavaScript の正規表現の使用</a></li> + <li>{{jsxref("String.prototype.match()")}}</li> + <li>{{jsxref("RegExp.prototype.exec()")}}</li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/slice/index.html b/files/ja/web/javascript/reference/global_objects/string/slice/index.html new file mode 100644 index 0000000000..aeea092161 --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/slice/index.html @@ -0,0 +1,120 @@ +--- +title: String.prototype.slice() +slug: Web/JavaScript/Reference/Global_Objects/String/slice +tags: + - JavaScript + - Method + - Prototype + - Reference + - String + - メソッド +translation_of: Web/JavaScript/Reference/Global_Objects/String/slice +--- +<div>{{JSRef}}</div> + +<p><strong><code>slice()</code></strong> メソッドは、元の文字列を変更せず、文字列の一部分を取り出し、それを新しい文字列として返します。</p> + +<div>{{EmbedInteractiveExample("pages/js/string-slice.html", "taller")}}</div> + +<p class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</p> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox"><var>str</var>.slice(<var>beginIndex</var>[, <var>endIndex</var>])</pre> + +<h3 id="Parameters" name="Parameters">引数</h3> + +<dl> + <dt><code><var>beginIndex</var></code></dt> + <dd> + <p>取り出しを開始する位置を示す 0 から始まるインデックスです。負の値の場合、 <code><var>str</var>.length + <var>beginIndex</var></code> として扱われます。 (例えば <code><var>beginIndex</var></code> が <code>-3</code> の場合、 <code><var>str</var>.length - 3</code> として扱われます。)</p> + + <p><code><var>beginIndex</var></code> が <code><var>str</var>.length</code> 以上である場合、 <code>slice()</code> は空文字列を返します。</p> + </dd> + <dt><code><var>endIndex</var></code> {{optional_inline}}</dt> + <dd> + <p>取り出しを終える<em>前の</em> 0 から始まるインデックスです。このインデックスにある文字は含まれません。</p> + + <p><code><var>endIndex</var></code> を省略した場合、 <code>slice()</code> は文字列の末尾までを取り出します。負の値の場合、 <code><var>str</var>.length + <var>endIndex</var></code> として扱われます。 (例えば <code><var>endIndex</var></code> が <code>-3</code> の場合、 <code><var>str</var>.length - 3</code> として扱われます。)</p> + </dd> +</dl> + +<h3 id="Return_value" name="Return_value">返値</h3> + +<p>文字列の取り出された部分を含んだ新しい文字列です。</p> + +<h2 id="Description" name="Description">解説</h2> + +<p><code>slice()</code> は 1 つの文字列からテキストを取り出し、新しい文字列を返します。一方の文字列におけるテキストへの変更は、他の文字列に影響を与えません。</p> + +<p><code>slice()</code> は <code><var>endIndex</var></code> を含まずにテキストを取り出します。 <code><var>str</var>.slice(1, 4)</code> は、 2 番目から 4 番目までの文字 (<code>1</code>, <code>2</code>, <code>3</code> のインデックスの文字) を取り出します。</p> + +<p>例えば <code><var>str</var>.slice(2, -1)</code> は、文字列から 3 番目の文字から最後から 2 番目の文字までを取り出します。</p> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Using_slice_to_create_a_new_string" name="Using_slice_to_create_a_new_string"><code>slice()</code> を使って新しい文字列をつくる</h3> + +<p>以下の例は、新しい文字列を生成するために <code>slice()</code> を使っています。</p> + +<pre class="brush: js">let str1 = 'The morning is upon us.', // the length of str1 is 23. + str2 = str1.slice(1, 8), + str3 = str1.slice(4, -2), + str4 = str1.slice(12), + str5 = str1.slice(30); +console.log(str2) // OUTPUT: he morn +console.log(str3) // OUTPUT: morning is upon u +console.log(str4) // OUTPUT: is upon us. +console.log(str5) // OUTPUT: "" +</pre> + +<h3 id="Using_slice_with_negative_indexes" name="Using_slice_with_negative_indexes">負のインデックスで <code>slice()</code> を使う</h3> + +<p>下記の例は負のインデックスで <code>slice()</code> を使っています。</p> + +<pre class="brush: js">let str = 'The morning is upon us.' +str.slice(-3) // returns 'us.' +str.slice(-3, -1) // returns 'us' +str.slice(0, -1) // returns 'The morning is upon us' +</pre> + +<p>この例は、文字列の末尾から前方に <code>11</code> 番目を開始インデックスとし、先頭から後方に <code>16</code> 番目を終了インデックスとします。</p> + +<pre class="brush: js">console.log(str.slice(-11, 16)) // => "is u"</pre> + +<p>こちらは先頭から後方に <code>11</code> 番目を開始インデックスとし、末尾から前方に <code>7</code> 番目を終了インデックスとします。</p> + +<pre class="brush: js">console.log(str.slice(11, -7)) // => " is u"</pre> + +<p>これらの引数は、末尾から前方に <code>5</code> 番目を開始インデックスとし、末尾から前方に <code>1</code> 番目を終了インデックスとします。</p> + +<pre class="brush: js">console.log(str.slice(-5, -1)) // => "n us"</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.slice', 'String.prototype.slice')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.String.slice")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("String.prototype.substr()")}}</li> + <li>{{jsxref("String.prototype.substring()")}}</li> + <li>{{jsxref("Array.prototype.slice()")}}</li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/small/index.html b/files/ja/web/javascript/reference/global_objects/string/small/index.html new file mode 100644 index 0000000000..a826ac6df3 --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/small/index.html @@ -0,0 +1,74 @@ +--- +title: String.prototype.small() +slug: Web/JavaScript/Reference/Global_Objects/String/small +tags: + - Deprecated + - HTML wrapper methods + - JavaScript + - Method + - Prototype + - Reference + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/small +--- +<div>{{JSRef}} {{deprecated_header}}</div> + +<p><strong><code>small()</code></strong> メソッドは、文字列が小さなフォントで表示されるように HTML の {{HTMLElement("small")}} 要素を生成します。</p> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox notranslate"><var>str</var>.small()</pre> + +<h3 id="Return_value" name="Return_value">返値</h3> + +<p>HTML の {{HTMLElement("small")}} 要素を含む文字列です。</p> + +<h2 id="Description" name="Description">解説</h2> + +<p><code>small()</code> メソッドは、文字列を <code><small></code> 要素の中に、 "<code><small>str</small></code>" のように埋め込みます。</p> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="small_の使用">small() の使用</h3> + +<p>以下の例では文字列のメソッドを使用して、文字列の大きさを変更しています。</p> + +<pre class="brush: js notranslate">var worldString = 'Hello, world'; + +console.log(worldString.small()); // <small>Hello, world</small> +console.log(worldString.big()); // <big>Hello, world</big> +console.log(worldString.fontsize(7)); // <font size="7">Hello, world</fontsize> +</pre> + +<p>{{domxref("ElementCSSInlineStyle/style", "element.style")}} オブジェクトを使用すると、要素の <code>style</code> 属性を使用して、次のようにもっと汎用的に操作することができます。</p> + +<pre class="brush: js notranslate">document.getElementById('yourElemId').style.fontSize = '0.7em'; +</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.small', 'String.prototype.small')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.String.small")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("String.prototype.fontsize()")}}</li> + <li>{{jsxref("String.prototype.big()")}}</li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/split/index.html b/files/ja/web/javascript/reference/global_objects/string/split/index.html new file mode 100644 index 0000000000..a62cb1ce48 --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/split/index.html @@ -0,0 +1,226 @@ +--- +title: String.prototype.split() +slug: Web/JavaScript/Reference/Global_Objects/String/split +tags: + - JavaScript + - Method + - Prototype + - Reference + - Regular Expressions + - String + - プロトタイプ + - メソッド + - 正規表現 +translation_of: Web/JavaScript/Reference/Global_Objects/String/split +--- +<div>{{JSRef}}</div> + +<p><span class="seoSummary"><strong><code>split()</code></strong> メソッドは、 {{jsxref("String")}} を指定した区切り文字列で分割することにより、文字列の配列に分割します。</span></p> + +<div>{{EmbedInteractiveExample("pages/js/string-split.html", "taller")}}</div> + +<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox"><var>str</var>.split([<var>separator</var>[, <var>limit</var>]])</pre> + +<h3 id="Parameters" name="Parameters">引数</h3> + +<dl> + <dt><code><var>separator</var></code> {{optional_inline}}</dt> + <dd> + <p>分割を行うところにある文字列です。文字列または{{jsxref("Global_Objects/RegExp", "正規表現", "", 1)}}を指定することができます。</p> + + <ul> + <li><code><var>separator</var></code> が複数の文字を含んだ文字列である場合、分割にはその文字列の並び全体が見つかることが必要です。</li> + <li><code><var>separator</var></code> が省略されたり <code><var>str</var></code> の中に現れなかったりした場合は、返却される配列には文字列全体から成る要素が1つだけ含まれます。</li> + <li><code><var>separator</var></code> が文字列の先頭または末尾、またはその両方に現れた場合、配列の先頭、末尾、または先頭と末尾の両方が、それぞれ空文字列になります。</li> + <li><code><var>separator</var></code> が空文字列 (<code>""</code>) の場合、 <code><var>str</var></code> は個々の UTF-16 「文字」の配列になります。</li> + </ul> + + <div class="blockIndicator warning"> + <p><strong>警告:</strong> 空文字列 (<code>""</code>) を区切り文字列として使用すると、文字列が<em>ユーザーが知覚可能な文字</em> (<a href="https://unicode.org/reports/tr29/#Grapheme_Cluster_Boundaries">書記素クラスター</a>) に分割されるわけでは<strong>なく</strong>、 Unicode 文字 (コードポイント)、ただし UTF-16 コード単位です。これは<a href="http://unicode.org/faq/utf_bom.html#utf16-2">サロゲートペア</a>を破壊します。 <a href="https://stackoverflow.com/a/34717402">StackOverflow の “How do you get a string to a character array in JavaScript?”</a> を参照してください。</p> + </div> + </dd> + <dt><code>limit</code> {{optional_inline}}</dt> + <dd> + <p>非負の整数で、分割する数を制限します。指定された場合、文字列は <code>separator</code> が現れるたびに分割されますが、 <code>limit</code> の数の項目が配列に配置されると停止します。残りのテキストは配列に入りません。</p> + + <ul> + <li>制限数に達する以前に文字列の末尾に達した場合は、配列の要素が <code>limit</code> よりも少なくなることがあります。</li> + <li><code>limit</code> が <code>0</code> の場合は、分割は行われません。</li> + </ul> + </dd> +</dl> + +<h3 id="Return_value" name="Return_value">返値</h3> + +<p>文字列の {{jsxref("Array")}} で、指定された文字列で <code>separator</code> が現れるたびに分割されたものです。</p> + +<h2 id="Description" name="Description">解説</h2> + +<p><code>separator</code> は見つかると文字列から削除され、部分文字列が配列に入って返されます。</p> + +<p><code>separator</code> が、キャプチャする括弧を含む正規表現だった場合、 <code>separator</code> が一致するごとに、キャプチャする括弧の結果が (未定義の結果であった場合を含め) 出力配列に追加されます。</p> + +<p><code>separator</code> が配列であった場合、その配列が String に変換された上で区切り文字列として使用されます。</p> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Using_split" name="Using_split"><code>split()</code> の使用</h3> + +<div id="split_empty_string"> +<p>文字列が空の場合、 <code>split()</code> は空の配列ではなく、1つの空文字列を含む配列を返します。文字列と区切り文字列が共に空文字列の場合、空の配列が返ります。</p> + +<pre class="brush: js">const myString = '' +const splits = myString.split() + +console.log(splits) + +// ↪ [""] +</pre> +</div> + +<p>以下の例は、指定された区切りを使って、文字列を文字列の配列に分割する関数を定義します。文字列を分割した後、その関数は元の文字列(分割する前)、使用した区切り、配列中の要素の数、そして、個々の配列要素を示すメッセージを表示します。</p> + +<pre class="brush: js">function splitString(stringToSplit, separator) { + const arrayOfStrings = stringToSplit.split(separator) + + console.log('元の文字列: ', stringToSplit) + console.log('区切り文字列: ' , separator) + console.log('配列の要素数は', arrayOfStrings.length, '件: ', arrayOfStrings.join(' / ')) +} + +const tempestString = 'Oh brave new world that has such people in it.' +const monthString = 'Jan,Feb,Mar,Apr,May,Jun,Jul,Aug,Sep,Oct,Nov,Dec' + +const space = ' ' +const comma = ',' + +splitString(tempestString, space) +splitString(tempestString) +splitString(monthString, comma) +</pre> + +<p>この例は次のような出力結果を生み出します。</p> + +<pre>元の文字列: "Oh brave new world that has such people in it." +区切り: " " +配列は 10 要素: Oh / brave / new / world / that / has / such / people / in / it. + +元の文字列: "Oh brave new world that has such people in it." +区切り: "undefined" +配列は 1 要素: Oh brave new world that has such people in it. + +元の文字列: "Jan,Feb,Mar,Apr,May,Jun,Jul,Aug,Sep,Oct,Nov,Dec" +区切り: "," +配列は 12 要素: Jan / Feb / Mar / Apr / May / Jun / Jul / Aug / Sep / Oct / Nov / Dec +</pre> + +<h3 id="Removing_spaces_from_a_string" name="Removing_spaces_from_a_string">文字列からの空白の削除</h3> + +<p>以下の例では、<code>split()</code> は、0 回以上の空白とそれに続くセミコロン、それにさらに続く 0 回以上の空白を探し、それらが見つかったとき、文字列から空白を削除します。<code>nameList</code> は、<code>split()</code> の結果として返された配列です。</p> + +<pre class="brush: js">const names = 'Harry Trump ;Fred Barney; Helen Rigby ; Bill Abel ;Chris Hand ' + +console.log(names) + +const re = /\s*(?:;|$)\s*/ +const nameList = names.split(re) + +console.log(nameList) +</pre> + +<p>これは 2 つの行を出力します。1 行目は元の文字列を出力し、2 行目は <code>split</code> メソッドの実行結果の配列を出力します。</p> + +<pre>Harry Trump ;Fred Barney; Helen Rigby ; Bill Abel ;Chris Hand +[ "Harry Trump", "Fred Barney", "Helen Rigby", "Bill Abel", "Chris Hand", "" ] +</pre> + +<h3 id="Returning_a_limited_number_of_splits" name="Returning_a_limited_number_of_splits">限られた数の分割結果を返す</h3> + +<p>以下の例では、<code>split()</code> は 文字列中の 0 回以上の空白を探し、見つかった最初の 3 つの分割結果を返します。</p> + +<pre class="brush: js">const myString = 'Hello World. How are you doing?' +const splits = myString.split(' ', 3) + +console.log(splits) +</pre> + +<p>このスクリプトは以下の例を出力します。</p> + +<pre>["Hello", "World.", "How"] +</pre> + +<h3 id="Splitting_with_a_RegExp_to_include_parts_of_the_separator_in_the_result" name="Splitting_with_a_RegExp_to_include_parts_of_the_separator_in_the_result"><code>RegExp</code> で分割して結果に区切り文字列の一部を含める</h3> + +<p><code>separator</code> がキャプチャの括弧 <code>(</code><code>)</code> を含む正規表現である場合、一致した結果が配列に含まれます。</p> + +<pre class="brush: js">const myString = 'Hello 1 word. Sentence number 2.' +const splits = myString.split(/(\d)/) + +console.log(splits) +</pre> + +<p>このスクリプトは、以下を表示します。</p> + +<pre>[ "Hello ", "1", " word. Sentence number ", "2", "." ] +</pre> + +<div class="blockIndicator note"> +<p><strong>メモ: </strong><code>\d</code> は<a href="/ja/docs/Web/JavaScript/Guide/Regular_Expressions/Character_Classes">文字クラス</a>で、0から9の数字に一致します。</p> +</div> + +<h3 id="Reversing_a_String_using_split" name="Reversing_a_String_using_split"><code>split()</code> を使った文字列を反転</h3> + +<div class="warning"> +<p>この手法は文字列を正しく反転できるとは限りません。</p> + +<pre class="brush: js">const str = 'asdfghjkl' +const strReverse = str.split('').reverse().join('') +// 'lkjhgfdsa' + +// split() が配列を返し、 reverse() および join() が適用できます +</pre> + +<p>Unicode 対応の分割を使用している場合でも、文字列に書記素クラスターが含まれていると機能しません (代わりに <a href="https://github.com/mathiasbynens/esrever">esrever</a> などを使ってください)。</p> + +<pre class="brush: js">const str = 'résumé' +const strReverse = str.split(/(?:)/u).reverse().join('') +// => "́emuśer" +</pre> + +<p><strong>ボーナス:</strong> {{jsxref("Operators/Comparison_Operators", "===", "#Identity_strict_equality_(===)")}} 演算子を使用すると、元の文字列が回文であるかどうかが判定できます。</p> +</div> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.split', 'String.prototype.split')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.String.split")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("String.prototype.charAt()")}}</li> + <li>{{jsxref("String.prototype.indexOf()")}}</li> + <li>{{jsxref("String.prototype.lastIndexOf()")}}</li> + <li>{{jsxref("Array.prototype.join()")}}</li> + <li><a href="/ja/docs/Web/JavaScript/Guide/Regular_Expressions">JavaScript での正規表現の使用</a></li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/startswith/index.html b/files/ja/web/javascript/reference/global_objects/string/startswith/index.html new file mode 100644 index 0000000000..b8c5c200eb --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/startswith/index.html @@ -0,0 +1,98 @@ +--- +title: String.prototype.startsWith() +slug: Web/JavaScript/Reference/Global_Objects/String/startsWith +tags: + - ECMAScript 2015 + - JavaScript + - Method + - Prototype + - Reference + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/startsWith +--- +<div>{{JSRef}}</div> + +<p><span class="seoSummary"><strong><code>startsWith()</code></strong> メソッドは文字列が引数で指定された文字列で始まるかを判定して <code>true</code> か <code>false</code> を返します。</span></p> + +<div>{{EmbedInteractiveExample("pages/js/string-startswith.html")}}</div> + +<p class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</p> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox notranslate"><var>str</var>.startsWith(<var>searchString</var>[, <var>position</var>])</pre> + +<h3 id="Parameters" name="Parameters">引数</h3> + +<dl> + <dt><code><var>searchString</var></code></dt> + <dd>文字列の先頭で検索される文字の集合です。</dd> + <dt><code><var>position</var></code> {{optional_inline}}</dt> + <dd><code><var>searchString</var></code> を検索し始めるこの文字列の中の位置です。既定値は <code>0</code> です。</dd> +</dl> + +<h3 id="Return_value" name="Return_value">返値</h3> + +<p>文字列が指定された文字列で始まる場合は <strong><code>true</code></strong>、それ以外の場合は <strong><code>false</code></strong> です。</p> + +<h2 id="Description" name="Description">解説</h2> + +<p>文字列が特定の文字列で始まるかどうかを判断できます。(英文字の)大文字・小文字は区別されます。</p> + +<h2 id="例">例</h2> + +<h3 id="Using_startsWith" name="Using_startsWith">startsWith() の使用</h3> + +<pre class="brush: js notranslate">//startswith +let str = 'To be, or not to be, that is the question.' + +console.log(str.startsWith('To be')) // true +console.log(str.startsWith('not to be')) // false +console.log(str.startsWith('not to be', 10)) // true +</pre> + +<h2 id="Polyfill" name="Polyfill">ポリフィル</h2> + +<p>このメソッドは ECMAScript 2015 で追加されました。すべてのJavaScriptの実装でまだ利用可能ではないかもしれません。しかしながら、次のコードで<code>String.prototype.startsWith()</code>をエミュレートできます。</p> + +<pre class="brush: js notranslate">if (!String.prototype.startsWith) { + Object.defineProperty(String.prototype, 'startsWith', { + value: function(search, rawPos) { + var pos = rawPos > 0 ? rawPos|0 : 0; + return this.substring(pos, pos + search.length) === search; + } + }); +} +</pre> + +<p>少々重いですがより強力 (ES2015に完全準拠) な互換実装を <a href="https://github.com/mathiasbynens/String.prototype.startsWith">Mathias Bynens が GitHub</a> で公開しています。</p> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.startswith', 'String.prototype.startsWith')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.String.startsWith")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("String.prototype.endsWith()")}}</li> + <li>{{jsxref("String.prototype.includes()")}}</li> + <li>{{jsxref("String.prototype.indexOf()")}}</li> + <li>{{jsxref("String.prototype.lastIndexOf()")}}</li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/strike/index.html b/files/ja/web/javascript/reference/global_objects/string/strike/index.html new file mode 100644 index 0000000000..6d2e1d53da --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/strike/index.html @@ -0,0 +1,70 @@ +--- +title: String.prototype.strike() +slug: Web/JavaScript/Reference/Global_Objects/String/strike +tags: + - Deprecated + - HTML wrapper methods + - JavaScript + - Method + - Prototype + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/strike +--- +<div>{{JSRef}} {{deprecated_header}}</div> + +<p><strong><code>strike()</code></strong> メソッドは、文字列が取り消されたテキストとして表示されるように HTML の {{HTMLElement("strike")}} 要素を生成します。</p> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox notranslate"><var>str</var>.strike()</pre> + +<h3 id="Return_value" name="Return_value">返値</h3> + +<p>HTML の {{HTMLElement("strike")}} 要素を含む文字列です。</p> + +<h2 id="Description" name="Description">解説</h2> + +<p><code>strike()</code> メソッドは、文字列を <code><strike></code> 要素の中に、 "<code><strike>str</strike></code>" のように埋め込みます。</p> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="strike_の使用">strike() の使用</h3> + +<p>以下の例では文字列のメソッドを使用して、文字列の形式を変更しています。</p> + +<pre class="brush: js notranslate">var worldString = 'Hello, world'; + +console.log(worldString.blink()); // <blink>Hello, world</blink> +console.log(worldString.bold()); // <b>Hello, world</b> +console.log(worldString.italics()); // <i>Hello, world</i> +console.log(worldString.strike()); // <strike>Hello, world</strike> +</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.strike', 'String.prototype.strike')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.String.strike")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("String.prototype.blink()")}}</li> + <li>{{jsxref("String.prototype.bold()")}}</li> + <li>{{jsxref("String.prototype.italics()")}}</li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/string/index.html b/files/ja/web/javascript/reference/global_objects/string/string/index.html new file mode 100644 index 0000000000..87f34ce131 --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/string/index.html @@ -0,0 +1,64 @@ +--- +title: String() コンストラクター +slug: Web/JavaScript/Reference/Global_Objects/String/String +tags: + - Constructor + - JavaScript + - Reference + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/String +--- +<div>{{JSRef}}</div> + +<p><strong><code>String</code></strong> コンストラクターは新しい {{jsxref("String")}} オブジェクトを生成するために使用します。関数として呼び出された場合は、{{Glossary("string", "プリミティブ文字列", "", 1)}}への型変換を行うので、普通はより便利です。</p> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox notranslate">new String(<var>thing</var>) +String(<var>thing</var>)</pre> + +<h3 id="Parameters" name="Parameters">引数</h3> + +<dl> + <dt><code><var>thing</var></code></dt> + <dd>文字列に変換するもの。</dd> +</dl> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="String_constructor_and_String_function" name="String_constructor_and_String_function">String コンストラクターと String 関数</h3> + +<p>String 関数と String コンストラクターは異なる結果を生み出します。</p> + +<pre class="brush: js notranslate">typeof String('Hello world'); // string +typeof new String('Hello world'); // object +</pre> + +<p>ここでは、この関数は約束通り ({{Glossary("primitive", "プリミティブ")}}型の) 文字列を生成します。しかし、コンストラクターは String 型 (オブジェクトのラッパー) のインスタンスを生成しますので、 String コンストラクターを使用するのは稀だといえます。</p> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string-constructor', 'String constructor')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.String.String")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li><a href="/ja/docs/Web/JavaScript/Guide/Text_formatting">JavaScript ガイドのテキスト処理</a></li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/sub/index.html b/files/ja/web/javascript/reference/global_objects/string/sub/index.html new file mode 100644 index 0000000000..2306c584b8 --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/sub/index.html @@ -0,0 +1,70 @@ +--- +title: String.prototype.sub() +slug: Web/JavaScript/Reference/Global_Objects/String/sub +tags: + - Deprecated + - HTML wrapper methods + - JavaScript + - Method + - Prototype + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/sub +--- +<div>{{JSRef}} {{deprecated_header}}</div> + +<p><strong><code>sub()</code></strong> メソッドは、文字列が下付き文字として表示されるように HTML の {{HTMLElement("sub")}} 要素を生成します。</p> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox notranslate"><var>str</var>.sub()</pre> + +<h3 id="Return_value" name="Return_value">返値</h3> + +<p>HTML の {{HTMLElement("sub")}} 要素を含む文字列です。</p> + +<h2 id="Description" name="Description">解説</h2> + +<p><code>sub()</code> メソッドは、文字列を <code><sub></code> 要素の中に、 "<code><sub>str</sub></code>" のように埋め込みます。</p> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Using_sub_and_sup_methods" name="Using_sub_and_sup_methods">sub() および sup() メソッドの使用</h3> + +<p>以下の例は、 <code>sub()</code> と {{jsxref("String.prototype.sup()", "sup()")}} メソッドを使用して文字列を整形しています。</p> + +<pre class="brush: js notranslate">var superText = '上付き文字'; +var subText = '下付き文字'; + +console.log('これは' + superText.sup() + 'の見え方を示しています。'); +// "これは<sup>上付き文字</sup>の見え方を示しています。" + +console.log('これは' + subText.sub() + 'の見え方を示しています。'); +// "これは<sub>下付き文字</sub>の見え方を示しています。" +</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.sub', 'String.prototype.sub')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.String.sub")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("String.prototype.sup()")}}</li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/substr/index.html b/files/ja/web/javascript/reference/global_objects/string/substr/index.html new file mode 100644 index 0000000000..e12769162b --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/substr/index.html @@ -0,0 +1,120 @@ +--- +title: String.prototype.substr() +slug: Web/JavaScript/Reference/Global_Objects/String/substr +tags: + - Deprecated + - JavaScript + - Method + - Prototype + - Reference + - String + - メソッド +translation_of: Web/JavaScript/Reference/Global_Objects/String/substr +--- +<div>{{JSRef}}</div> + +<p class="seoSummary"><strong><code>substr()</code></strong> メソッドは、文字列の一部を、指定した位置から後方向指定した文字数だけ返します。</p> + +<div>{{EmbedInteractiveExample("pages/js/string-substr.html")}}</div> + +<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox notranslate"><var>str</var>.substr(<var>start</var>[, <var>length</var>])</pre> + +<h3 id="Parameters" name="Parameters">引数</h3> + +<dl> + <dt><code><var>start</var></code></dt> + <dd>返却する部分文字列に含まれる最初の文字の位置です。</dd> + <dt><code><var>length</var></code></dt> + <dd>任意です。取り出す文字の数です。</dd> +</dl> + +<h3 id="Return_value" name="Return_value">返値</h3> + +<p>指定された文字列の指定された部分が入った新しい文字列です。</p> + +<h2 id="Description" name="Description">解説</h2> + +<p><code>substr()</code> は、 <code><var>str</var></code> のうち <code><var>length</var></code> 文字分を、 <code><var>start</var></code> の位置から数えて抽出します。</p> + +<ul> + <li><code><var>start</var></code> が正の数である場合、文字列の先頭から数えた位置になります。この値は <code><var>str</var>.length</code> が上限になります。</li> + <li><code><var>start</var></code> が負の数である場合、文字列の末尾から数えた位置になります。この値は <code>-<var>str</var>.length</code> が下限になります。</li> + <li>注: Microsoft の JScript では、 <code><var>start</var></code> の引数が負の数であっても文字列の末尾からの位置にはなりません。</li> + <li><code><var>length</var></code> が省略された場合、 <code>substr()</code> は文字列の末尾までの文字を抽出します。</li> + <li><code><var>length</var></code> が {{jsxref("undefined")}} である場合、 <code>substr()</code> は文字列の末尾までの文字を抽出します。</li> + <li><code><var>length</var></code> が負の数である場合、 <code>0</code> として扱われます。</li> + <li><code><var>start</var></code> および <code><var>length</var></code> において、 {{jsxref("NaN")}} は <code>0</code> として扱われます。</li> +</ul> + +<h2 id="Polyfill" name="Polyfill">ポリフィル</h2> + +<p>Microsoft の JScript は start の位置として負の数に対応していません。この機能を使用したい場合は、このバグを回避するために、次の互換コードを使用することができます。</p> + +<pre class="brush: js notranslate">// only run when the substr() function is broken +if ('ab'.substr(-1) != 'b') { + /** + * Get the substring of a string + * @param {integer} start where to start the substring + * @param {integer} length how many characters to return + * @return {string} + */ + String.prototype.substr = function(substr) { + return function(start, length) { + // call the original method + return substr.call(this, + // did we get a negative start, calculate how much it is from the beginning of the string + // adjust the start parameter for negative value + start < 0 ? this.length + start : start, + length) + } + }(String.prototype.substr); +} +</pre> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Using_substr" name="Using_substr">substr() の使用</h3> + +<pre class="brush: js notranslate">var aString = 'Mozilla'; + +console.log(aString.substr(0, 1)); // 'M' +console.log(aString.substr(1, 0)); // '' +console.log(aString.substr(-1, 1)); // 'a' +console.log(aString.substr(1, -1)); // '' +console.log(aString.substr(-3)); // 'lla' +console.log(aString.substr(1)); // 'ozilla' +console.log(aString.substr(-20, 2)); // 'Mo' +console.log(aString.substr(20, 2)); // '' +</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.substr', 'String.prototype.substr')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.String.substr")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("String.prototype.slice()")}}</li> + <li>{{jsxref("String.prototype.substring()")}}</li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/substring/index.html b/files/ja/web/javascript/reference/global_objects/string/substring/index.html new file mode 100644 index 0000000000..19edd685f1 --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/substring/index.html @@ -0,0 +1,182 @@ +--- +title: String.prototype.substring() +slug: Web/JavaScript/Reference/Global_Objects/String/substring +tags: + - JavaScript + - Method + - Prototype + - Reference + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/substring +--- +<div>{{JSRef}}</div> + +<p><strong><code>substring()</code></strong> メソッドは <code>string</code> オブジェクトの開始・終了位置の間、または文字列の最後までの部分集合を返します。</p> + +<div>{{EmbedInteractiveExample("pages/js/string-substring.html")}}</div> + +<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox notranslate"><var>str</var>.substring(<var>indexStart</var>[, <var>indexEnd</var>])</pre> + +<h3 id="Parameters" name="Parameters">引数</h3> + +<dl> + <dt><code><var>indexStart</var></code></dt> + <dd>返される部分文字列の、最初の文字を含んだ位置です。</dd> + <dt><code><var>indexEnd</var></code> {{optional_inline}}</dt> + <dd>返される部分文字列から外される最初の文字の位置です。</dd> +</dl> + +<h3 id="Return_value" name="Return_value">返値</h3> + +<p>与えられた文字列から抽出された区間を含む新しい文字列です。</p> + +<h2 id="Description" name="Description">解説</h2> + +<p><code>substring()</code> は <code><var>indexStart</var></code> から <code><var>indexEnd</var></code> の直前までの文字を取り出します。特に、</p> + +<ul> + <li><code><var>indexEnd</var></code> が省略された場合、<code>substring()</code> は文字列の最後までの文字を取り出します。</li> + <li><code><var>indexStart</var></code> が <code><var>indexEnd</var></code> と等しい場合、 <code>substring()</code> は空の文字列を返します。</li> + <li><code><var>indexStart</var></code> が <code><var>indexEnd</var></code> より大きかった場合、 <code>substring()</code> は 2 つの引数が交換されたものとして実行されます。下記の例をご覧ください。</li> +</ul> + +<p>引数が <code>0</code> 未満、または <code>stringName.length</code> を超えた場合、それはそれぞれ <code>0</code> と <code>stringName.length</code> として扱われます。</p> + +<p>いずれかの引数が {{jsxref("NaN")}} の場合、それは <code>0</code> として扱われます。</p> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Using_substring" name="Using_substring">substring() の使用</h3> + +<p>以下の例では <code>substring()</code> を使用して、 <code>Mozilla</code> という文字列から文字を取り出して表示します。</p> + +<pre class="brush: js notranslate">let anyString = 'Mozilla' + +// 'M' と表示 +console.log(anyString.substring(0, 1)) +console.log(anyString.substring(1, 0)) + +// 'Mozill' と表示 +console.log(anyString.substring(0, 6)) + +// 'lla' と表示 +console.log(anyString.substring(4)) +console.log(anyString.substring(4, 7)) +console.log(anyString.substring(7, 4)) + +// 'Mozilla' と表示 +console.log(anyString.substring(0, 7)) +console.log(anyString.substring(0, 10)) +</pre> + +<h3 id="Using_substring_with_length_property" name="Using_substring_with_length_property">substring() と length プロパティの使用</h3> + +<p>次の例では <code>substring()</code> メソッドと {{jsxref("String.length", "length")}} プロパティを使用して、、特定の文字列の最後の文字を抜き出しています。この方法では、上記の例と同じようあなたが最初と最後の位置を知っている必要がないこと考えると、覚えやすいかもしれません。</p> + +<pre class="brush: js notranslate">// 最後の 4 文字の 'illa' を表示します +let anyString = 'Mozilla' +let anyString4 = anyString.substring(anyString.length - 4) +console.log(anyString4) + +// 最後の 5 文字の 'zilla' を表示します +let anyString = 'Mozilla' +let anyString5 = anyString.substring(anyString.length - 5) +console.log(anyString5) +</pre> + +<h3 id="The_difference_between_substring_and_substr" name="The_difference_between_substring_and_substr">substring() と substr() の違い</h3> + +<p><code>substring()</code> メソッドと {{jsxref("String.substr", "substr()")}} メソッドとの間には微妙な違いがあるので、混乱しないように注意してください。</p> + +<p><code>substring()</code> の引数は開始位置と終了位置を表しますが、 <code>substr()</code> の引数は開始位置と返される文字列に含まれる文字数を表します。</p> + +<p>さらに、 <code>substr()</code> は <strong>ECMAScript の古い機能</strong>とみなされており、将来のバージョンでは削除される可能性があるため、できれば使用しないのが最良です。</p> + +<pre class="brush: js notranslate">let text = 'Mozilla' +console.log(text.substring(2,5)) // => "zil" +console.log(text.substr(2,3)) // => "zil"</pre> + +<h3 id="Differences_between_substring_and_slice" name="Differences_between_substring_and_slice">substring() と slice() の違い</h3> + +<p><code>substring()</code> メソッドと {{jsxref("String.slice", "slice()")}} メソッドはほぼ同じですが、特に負の数の引数の扱いについて、いくつかの微妙な違いがあります。</p> + +<p><code>substring()</code> メソッドは <code><var>indexStart</var></code> が <code><var>indexEnd</var></code> よりも大きい場合に二つの引数をするので、文字列が返されます。 {{jsxref("String.slice", "slice()")}} メソッドはこの場合には空文字列を返します。</p> + +<pre class="brush: js notranslate">let text = 'Mozilla' +console.log(text.substring(5, 2)) // => "zil" +console.log(text.slice(5, 2)) // => "" +</pre> + +<p>どちらかまたは両方の引数が負の数または <code>NaN</code> であった場合、 <code>substring()</code> メソッドはこれらを <code>0</code> として扱います。</p> + +<pre class="brush: js notranslate">console.log(text.substring(-5, 2)) // => "Mo" +console.log(text.substring(-5, -2)) // => "" +</pre> + +<p><code>slice()</code> も <code>NaN</code> の引数を <code>0</code> として扱いますが、負の数を指定した場合は、文字列の末尾からの文字数で位置を探します。</p> + +<pre class="brush: js notranslate">console.log(text.slice(-5, 2)) // => "" +console.log(text.slice(-5, -2)) // => "zil" +</pre> + +<p>負の数を使用した例は {{jsxref("String.slice", "slice()")}} のページをご覧ください。</p> + +<h3 id="Replacing_a_substring_within_a_string" name="Replacing_a_substring_within_a_string">文字列内の部分文字列の置き換え</h3> + +<p>次の例は、文字列内の部分文字列を置き換えます。これは単独の文字と部分文字列の両方を置き換えます。例の最後にある関数呼び出しは、 <code>Brave New World</code> という文字列を <code>Brave New Web</code> に置き換えます。</p> + +<pre class="brush: js notranslate">// fullS という文字列内で oldS を newS に置き換えます。 +function replaceString(oldS, newS, fullS) { + for (let i = 0; i < fullS.length; ++i) { + if (fullS.substring(i, i + oldS.length) == oldS) { + fullS = fullS.substring(0, i) + newS + fullS.substring(i + oldS.length, fullS.length) + } + } + return fullS +} + +replaceString('World', 'Web', 'Brave New World') +</pre> + +<p>なお、これは <code>oldS</code> が <code>newS</code> の部分文字列である場合に無限ループに陥ります。 — 例えば、 '<code>World</code>' を '<code>OtherWorld</code>' で置き換える場合などです。</p> + +<p>置き換えるのにより良い方法は以下の通りです。</p> + +<pre class="brush: js notranslate">function replaceString(oldS, newS, fullS) { + return fullS.split(oldS).join(newS) +} +</pre> + +<p>上述のコードは、 substring の操作の例を提供します。部分文字列を置き換える必要があるとき、多くの場合 {{jsxref("String.prototype.replace()")}} を使用します。</p> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.substring', 'String.prototype.substring')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.String.substring")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("String.prototype.substr()")}}</li> + <li>{{jsxref("String.prototype.slice()")}}</li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/sup/index.html b/files/ja/web/javascript/reference/global_objects/string/sup/index.html new file mode 100644 index 0000000000..1584d973fa --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/sup/index.html @@ -0,0 +1,71 @@ +--- +title: String.prototype.sup() +slug: Web/JavaScript/Reference/Global_Objects/String/sup +tags: + - Deprecated + - HTML wrapper methods + - JavaScript + - Method + - Prototype + - Reference + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/sup +--- +<div>{{JSRef}} {{deprecated_header}}</div> + +<p><strong><code>sup()</code></strong> メソッドは、文字列が上付き文字として表示されるように HTML の {{HTMLElement("sup")}} 要素を生成します。</p> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox notranslate"><var>str</var>.sup()</pre> + +<h3 id="Return_value" name="Return_value">返値</h3> + +<p>HTML の {{HTMLElement("sup")}} 要素を含む文字列です。</p> + +<h2 id="Description" name="Description">解説</h2> + +<p><code>sup()</code> メソッドは、文字列を <code><sup></code> 要素の中に、 "<code><sup>str</sup></code>" のように埋め込みます。</p> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Using_sub_and_sup_methods" name="Using_sub_and_sup_methods">sub() および sup() メソッドの使用</h3> + +<p>以下の例は、 {{jsxref("String.prototype.sub()", "sub()")}} と <code>sup()</code> メソッドを使用して文字列を整形しています。</p> + +<pre class="brush: js notranslate">var superText = '上付き文字'; +var subText = '下付き文字'; + +console.log('これは' + superText.sup() + 'の見え方を示しています。'); +// "これは<sup>上付き文字</sup>の見え方を示しています。" + +console.log('これは' + subText.sub() + 'の見え方を示しています。'); +// "これは<sub>下付き文字</sub>の見え方を示しています。" +</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.sup', 'String.prototype.sup')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.String.sup")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("String.prototype.sub()")}}</li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/tolocalelowercase/index.html b/files/ja/web/javascript/reference/global_objects/string/tolocalelowercase/index.html new file mode 100644 index 0000000000..cbe8197973 --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/tolocalelowercase/index.html @@ -0,0 +1,92 @@ +--- +title: String.prototype.toLocaleLowerCase() +slug: Web/JavaScript/Reference/Global_Objects/String/toLocaleLowerCase +tags: + - Internationalization + - JavaScript + - Method + - Prototype + - Reference + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/toLocaleLowerCase +--- +<div>{{JSRef}}</div> + +<p><strong><code>toLocaleLowerCase()</code></strong> メソッドは、呼び出した文字列の値を、ロケールに依存した対応付けに基づいて小文字にに変換して返します。</p> + +<div>{{EmbedInteractiveExample("pages/js/string-tolocalelowercase.html")}}</div> + +<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox notranslate"><var>str</var>.toLocaleLowerCase() +<var>str</var>.toLocaleLowerCase(locale) +<var>str</var>.toLocaleLowerCase([locale, locale, ...]) +</pre> + +<h3 id="Parameters" name="Parameters">引数</h3> + +<dl> + <dt><code>locale</code> {{optional_inline}}</dt> + <dd><code>locale</code> 引数は、ロケールに依存した対応に基づいた小文字への変換に使用されるロケールを示します。複数のロケールが {{jsxref("Array")}} で与えられた場合は、<a href="https://tc39.github.io/ecma402/#sec-bestavailablelocale">利用可能な最良のロケール</a>が使用されます。既定のロケールはホスト環境の現在のロケールです。</dd> +</dl> + +<h3 id="Return_value" name="Return_value">返値</h3> + +<p>呼び出した文字列をロケールに依存した対応に基づいて小文字に変換したものを表す新しい文字列です。</p> + +<h3 id="Exceptions" name="Exceptions">例外</h3> + +<ul> + <li>A {{jsxref("RangeError")}} ("invalid language tag: xx_yy") は <code>locale</code> 引数が妥当な言語タグでない場合に発生します。</li> + <li>A {{jsxref("TypeError")}} ("invalid element in locales argument") は、配列の要素が文字列型でなかった場合に発生します。</li> +</ul> + +<h2 id="Description" name="Description">解説</h2> + +<p><code>toLocaleLowerCase()</code> メソッドは、ロケール固有の大文字小文字の対応付けに従って小文字に変換された文字列の値を返します。 <code>toLocaleLowerCase()</code> はその文字列自体に影響を与えません。ほとんどの場合は {{jsxref("String.prototype.toLowerCase()", "toLowerCase()")}} と同じ結果が得られますが、トルコ語のように大文字小文字のマッピングが Unicode 既定の大文字小文字のマッピングに従っていないロケールの場合は、異なる結果が得られる可能性があります。</p> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Using_toLocaleLowerCase" name="Using_toLocaleLowerCase">toLocaleLowerCase() の使用</h3> + +<pre class="brush: js notranslate">'ALPHABET'.toLocaleLowerCase(); // 'alphabet' + +'\u0130'.toLocaleLowerCase('tr') === 'i'; // true +'\u0130'.toLocaleLowerCase('en-US') === 'i'; // false + +let locales = ['tr', 'TR', 'tr-TR', 'tr-u-co-search', 'tr-x-turkish']; +'\u0130'.toLocaleLowerCase(locales) === 'i'; // true</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.tolocalelowercase', 'String.prototype.toLocaleLowerCase')}}</td> + </tr> + <tr> + <td>{{SpecName('ES Int Draft', '#sup-string.prototype.tolocalelowercase', 'String.prototype.toLocaleLowerCase')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.String.toLocaleLowerCase")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("String.prototype.toLocaleUpperCase()")}}</li> + <li>{{jsxref("String.prototype.toLowerCase()")}}</li> + <li>{{jsxref("String.prototype.toUpperCase()")}}</li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/tolocaleuppercase/index.html b/files/ja/web/javascript/reference/global_objects/string/tolocaleuppercase/index.html new file mode 100644 index 0000000000..a8c9297c02 --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/tolocaleuppercase/index.html @@ -0,0 +1,96 @@ +--- +title: String.prototype.toLocaleUpperCase() +slug: Web/JavaScript/Reference/Global_Objects/String/toLocaleUpperCase +tags: + - Internationalization + - JavaScript + - Method + - Prototype + - Reference + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/toLocaleUpperCase +--- +<div>{{JSRef}}</div> + +<p><strong><code>toLocaleUpperCase()</code></strong> メソッドは、呼び出した文字列の値を、ロケールに依存した対応付けに基づいて大文字に変換して返します。</p> + +<div>{{EmbedInteractiveExample("pages/js/string-tolocaleuppercase.html")}}</div> + +<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox notranslate"><var>str</var>.toLocaleUpperCase() +<var>str</var>.toLocaleUpperCase(locale) +<var>str</var>.toLocaleUpperCase([locale, locale, ...]) +</pre> + +<h3 id="Parameters" name="Parameters">引数</h3> + +<dl> + <dt><code>locale</code> {{optional_inline}}</dt> + <dd><code>locale</code> 引数は、ロケールに依存した対応に基づいた大文字への変換に使用されるロケールを示します。複数のロケールが {{jsxref("Array")}} で与えられた場合は、<a href="https://tc39.github.io/ecma402/#sec-bestavailablelocale">利用可能な最良のロケール</a>が使用されます。既定のロケールはホスト環境の現在のロケールです。</dd> +</dl> + +<h3 id="Return_value" name="Return_value">返値</h3> + +<p>呼び出した文字列をロケールに依存した対応に基づいて大文字に変換したものを表す新しい文字列です。</p> + +<h3 id="Exceptions" name="Exceptions">例外</h3> + +<ul> + <li>A {{jsxref("RangeError")}} ("invalid language tag: xx_yy") は <code>locale</code> 引数が妥当な言語タグでない場合に発生します。</li> + <li>A {{jsxref("TypeError")}} ("invalid element in locales argument") は、配列の要素が文字列型でなかった場合に発生します。</li> +</ul> + +<h2 id="Description" name="Description">解説</h2> + +<p><code>toLocaleUpperCase()</code> メソッドは、ロケール固有の大文字小文字の対応付けに従って大文字に変換された文字列の値を返します。 <code>toLocaleUpperCase()</code> はその文字列自体に影響を与えません。ほとんどの場合は {{jsxref("String.prototype.toUpperCase()", "toUpperCase()")}} と同じ結果が得られますが、トルコ語のように大文字小文字のマッピングが Unicode 既定の大文字小文字のマッピングに従っていないロケールの場合は、異なる結果が得られる可能性があります。</p> + +<p>また、変換は必ずしも文字の 1:1 の対応付けであるとは限らず、一部の文字は大文字に変換されたときに2文字 (それ以上の場合も) になる可能性があることに注意してください。そのため,結果の文字列の長さは入力の長さと異なる場合があります。これは変換が安定していないことも意味します。すなわち、次の式は <code>false</code> を返す可能性があります。<br> + <code>x.toLocaleLowerCase() === x.toLocaleUpperCase().toLocaleLowerCase()</code></p> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Using_toLocaleUpperCase" name="Using_toLocaleUpperCase">toLocaleUpperCase() の使用</h3> + +<pre class="brush: js notranslate">'alphabet'.toLocaleUpperCase(); // 'ALPHABET' + +'Gesäß'.toLocaleUpperCase(); // 'GESÄSS' + +'i\u0307'.toLocaleUpperCase('lt-LT'); // 'I' + +let locales = ['lt', 'LT', 'lt-LT', 'lt-u-co-phonebk', 'lt-x-lietuva']; +'i\u0307'.toLocaleUpperCase(locales); // 'I'</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.tolocaleuppercase', 'String.prototype.toLocaleUpperCase')}}</td> + </tr> + <tr> + <td>{{SpecName('ES Int Draft', '#sup-string.prototype.tolocaleuppercase', 'String.prototype.toLocaleUpperCase')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.String.toLocaleUpperCase")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("String.prototype.toLocaleLowerCase()")}}</li> + <li>{{jsxref("String.prototype.toLowerCase()")}}</li> + <li>{{jsxref("String.prototype.toUpperCase()")}}</li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/tolowercase/index.html b/files/ja/web/javascript/reference/global_objects/string/tolowercase/index.html new file mode 100644 index 0000000000..029753723f --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/tolowercase/index.html @@ -0,0 +1,67 @@ +--- +title: String.prototype.toLowerCase() +slug: Web/JavaScript/Reference/Global_Objects/String/toLowerCase +tags: + - JavaScript + - Method + - Prototype + - Reference + - String + - メソッド +translation_of: Web/JavaScript/Reference/Global_Objects/String/toLowerCase +--- +<div>{{JSRef}}</div> + +<p><strong><code>toLowerCase()</code></strong> メソッドは、呼び出す文字列の値を小文字に変換して返します。</p> + +<div>{{EmbedInteractiveExample("pages/js/string-tolowercase.html","shorter")}}</div> + +<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox"><code><var>str</var>.toLowerCase()</code></pre> + +<h3 id="Return_value" name="Return_value">返値</h3> + +<p>呼び出す文字列の値を小文字に変換した新しい文字列です。</p> + +<h2 id="Description" name="Description">解説</h2> + +<p><code>toLowerCase()</code> メソッドは、小文字に変換された文字列の値を返します。<code>toLowerCase()</code> メソッドは、文字列 <code>str</code> 自身の値には影響を与えません。</p> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Using_toLowerCase" name="Using_toLowerCase"><code>toLowerCase()</code> メソッドの使用</h3> + +<pre class="brush: js">console.log('ALPHABET'.toLowerCase()); // 'alphabet' +</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.tolowercase', 'String.prototype.toLowerCase')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.String.toLowerCase")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("String.prototype.toLocaleLowerCase()")}}</li> + <li>{{jsxref("String.prototype.toLocaleUpperCase()")}}</li> + <li>{{jsxref("String.prototype.toUpperCase()")}}</li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/tosource/index.html b/files/ja/web/javascript/reference/global_objects/string/tosource/index.html new file mode 100644 index 0000000000..7c624a8b10 --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/tosource/index.html @@ -0,0 +1,54 @@ +--- +title: String.prototype.toSource() +slug: Web/JavaScript/Reference/Global_Objects/String/toSource +tags: + - JavaScript + - Method + - Non-standard + - Prototype + - Reference + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/toSource +--- +<div>{{JSRef}} {{non-standard_header}}</div> + +<p><strong><code>toSource()</code></strong> はそのオブジェクトのソースコードを表す文字列を返します。</p> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox"><code>String.toSource() +<var>str</var>.toSource() +</code></pre> + +<h3 id="Return_value" name="Return_value">戻り値</h3> + +<p>呼び出し元のオブジェクトのソースコードを表す文字列です。</p> + +<h2 id="Description" name="Description">説明</h2> + +<p><code>toSource()</code> メソッドは以下の値を返します。</p> + +<p>組み込み {{jsxref("String")}} オブジェクトでは、<code>toSource()</code> はソースコードが存在しないことを示す以下の文字列を返します。</p> + +<pre class="brush: js">function String() { + [native code] +} +</pre> + +<p>{{jsxref("String")}} オブジェクトのインスタンスや、文字列リテラルでは、<code>toSource()</code> はそのソースコードを表す文字列を返します。</p> + +<p>このメソッドは、通常、JavaScript によって内部的に呼ばれ、コード中で明示的に呼ばれることはありません。</p> + +<h2 id="Specifications" name="Specifications">仕様</h2> + +<p>あらゆる標準仕様に含まれません。JavaScript 1.3 で実装されています。</p> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザー実装状況</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.String.toSource")}}</p> + +<h2 id="See_also" name="See_also">参照</h2> + +<p><a href="ja/Core_JavaScript_1.5_Reference/Global_Objects/Object/toSource">Object.prototype.toSource</a></p> diff --git a/files/ja/web/javascript/reference/global_objects/string/tostring/index.html b/files/ja/web/javascript/reference/global_objects/string/tostring/index.html new file mode 100644 index 0000000000..75806d633f --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/tostring/index.html @@ -0,0 +1,65 @@ +--- +title: String.prototype.toString() +slug: Web/JavaScript/Reference/Global_Objects/String/toString +tags: + - JavaScript + - Method + - Prototype + - Reference + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/toString +--- +<div>{{JSRef}}</div> + +<p><strong><code>toString()</code></strong> メソッドは指定されたオブジェクトを表す文字列を返します。</p> + +<div>{{EmbedInteractiveExample("pages/js/string-tostring.html")}}</div> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox notranslate"><code><var>str</var>.toString()</code></pre> + +<h3 id="Return_value" name="Return_value">返値</h3> + +<p>呼び出したオブジェクトを表す文字列です。</p> + +<h2 id="Description" name="Description">詳細</h2> + +<p>その {{jsxref("String")}} オブジェクトは、{{jsxref("Object")}} の <code>toString</code> メソッドを上書きします。つまり、{{jsxref("Object.prototype.toString()")}} を継承しません。{{jsxref("String")}} オブジェクトの <code>toString()</code> メソッドは、そのオブジェクトを表す文字列を返します( {{jsxref("String.prototype.valueOf()")}} と同等です)。</p> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Using_toString" name="Using_toString()"><code>toString</code> メソッドを使う</h3> + +<p>以下の例は、{{jsxref("String")}} オブジェクトを表す文字列の値を表示します。</p> + +<pre class="brush: js notranslate">var x = new String('Hello world'); + +alert(x.toString()) // 'Hello world' を表示します +</pre> + +<h2 id="Specifications" name="Specifications">仕様</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">仕様書</th> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.tostring', 'String.prototype.toString')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザー実装状況</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.String.toString")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("Object.prototype.toSource()")}}</li> + <li>{{jsxref("String.prototype.valueOf()")}}</li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/touppercase/index.html b/files/ja/web/javascript/reference/global_objects/string/touppercase/index.html new file mode 100644 index 0000000000..112a78b5ce --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/touppercase/index.html @@ -0,0 +1,90 @@ +--- +title: String.prototype.toUpperCase() +slug: Web/JavaScript/Reference/Global_Objects/String/toUpperCase +tags: + - JavaScript + - Method + - Prototype + - Reference + - String + - メソッド +translation_of: Web/JavaScript/Reference/Global_Objects/String/toUpperCase +--- +<div>{{JSRef}}</div> + +<p><strong><code>toUpperCase()</code></strong> メソッドは、呼び出す文字列の値を(文字列でない場合、文字列に変換して)大文字に変換して返します。</p> + +<div>{{EmbedInteractiveExample("pages/js/string-touppercase.html","shorter")}}</div> + +<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox"><var>str</var>.toUpperCase()</pre> + +<h3 id="Return_value" name="Return_value">戻り値</h3> + +<p>呼び出す文字列の値を大文字に変換した新しい文字列です。</p> + +<h3 id="Exceptions" name="Exceptions">例外</h3> + +<dl> + <dt>{{jsxref("TypeError")}}</dt> + <dd>{{jsxref("null")}} か {{jsxref("undefined")}} で呼ばれた場合(例えば、<code>String.prototype.toUpperCase.call(undefined)</code>)。</dd> +</dl> + +<h2 id="Description" name="Description">詳細</h2> + +<p><code>toUpperCase()</code> メソッドは、大文字に変換された文字列の値を返します。このメソッドは、文字列自身の値に影響を与えません(JavaScript の文字列は不変です)。</p> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Basic_usage" name="Basic_usage">基本的な使用</h3> + +<pre class="brush: js">console.log('alphabet'.toUpperCase()); // 'ALPHABET' +</pre> + +<h3 id="Conversion_of_non-string_this_values_to_strings" name="Conversion_of_non-string_this_values_to_strings">文字列でない <code>this</code> 値を文字列に変換する</h3> + +<p>このメソッドは <code>this</code> に文字列でない値を設定した場合、文字列に変換します。:</p> + +<pre class="brush: js">const a = String.prototype.toUpperCase.call({ + toString: function toString() { + return 'abcdef'; + } +}); + +const b = String.prototype.toUpperCase.call(true); + +// prints out 'ABCDEF TRUE'. +console.log(a, b); +</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.touppercase', 'String.prototype.toUpperCase')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.String.toUpperCase")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("String.prototype.toLocaleLowerCase()")}}</li> + <li>{{jsxref("String.prototype.toLocaleUpperCase()")}}</li> + <li>{{jsxref("String.prototype.toLowerCase()")}}</li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/trim/index.html b/files/ja/web/javascript/reference/global_objects/string/trim/index.html new file mode 100644 index 0000000000..6719c6041d --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/trim/index.html @@ -0,0 +1,86 @@ +--- +title: String.prototype.trim() +slug: Web/JavaScript/Reference/Global_Objects/String/trim +tags: + - ECMAScript 5 + - JavaScript + - Method + - Prototype + - Reference + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/Trim +--- +<div>{{JSRef}}</div> + +<p><strong><code>trim()</code></strong> メソッドは、文字列の両端の空白を削除します。このコンテクストでの空白には、空白文字(スペースやタブ、ノーブレークスペースなど)とすべての改行文字(LF や CR など)を含みます。</p> + +<div>{{EmbedInteractiveExample("pages/js/string-trim.html")}}</div> + +<p class="hidden">The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request.</p> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox notranslate"><code><var>str</var>.trim()</code></pre> + +<h3 id="Return_value" name="Return_value">戻り値</h3> + +<p>呼び出し元の文字列の両端から空白を取り除いた新しい文字列です。</p> + +<h2 id="Description" name="Description">説明</h2> + +<p><code>trim()</code> メソッドは両端の空白を取り除いた文字列を返します。<code>trim()</code> はその文字列自身の値には影響を与えません(非破壊メソッド)。</p> + +<h2 id="Polyfill" name="Polyfill">Polyfill</h2> + +<p>ネイティブで使用できない場合、他のコードの前に次のコードを実行することにより <code>String.trim()</code> が使用可能になります。</p> + +<pre class="brush: js notranslate">if (!String.prototype.trim) { + String.prototype.trim = function () { + return this.replace(/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g, ''); + }; +} +</pre> + + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Using_trim" name="Using_trim()"><code>trim()</code> を使う</h3> + +<p>以下の例は小文字の文字列 <code>'foo'</code> を表示します。</p> + +<pre class="brush: js notranslate">var orig = ' foo '; +console.log(orig.trim()); // 'foo' + +// 片方からだけ空白を取り除く .trim() の例。 + +var orig = 'foo '; +console.log(orig.trim()); // 'foo' +</pre> + +<h2 id="Specifications" name="Specifications">仕様</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.trim', 'String.prototype.trim')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザー実装状況</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.String.trim")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("String.prototype.trimStart()")}}</li> + <li>{{jsxref("String.prototype.trimEnd()")}}</li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/trimend/index.html b/files/ja/web/javascript/reference/global_objects/string/trimend/index.html new file mode 100644 index 0000000000..8e54bf313d --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/trimend/index.html @@ -0,0 +1,80 @@ +--- +title: String.prototype.trimEnd() +slug: Web/JavaScript/Reference/Global_Objects/String/trimEnd +tags: + - JavaScript + - Method + - Prototype + - Reference + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/trimEnd +--- +<div>{{JSRef}}</div> + +<p><strong><code>trimEnd()</code></strong> メソッドは、文字列の末尾のホワイトスペースを削除します。 <code>trimRight()</code> はこのメソッドのエイリアスです。</p> + +<div>{{EmbedInteractiveExample("pages/js/string-trimend.html")}}</div> + +<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox notranslate"><var>str</var>.trimEnd(); +<var>str</var>.trimRight();</pre> + +<h3 id="Return_value" name="Return_value">返値</h3> + +<p>呼び出した文字列から末尾 (右端) からホワイトスペースを削除した新しい文字列です。</p> + +<h2 id="Description" name="Description">解説</h2> + +<p><code>trimEnd()</code> と <code>trimRight()</code> メソッドは、右端のホワイトスペースを取り除いた文字列を返します。 <code>trimEnd()</code> または <code>trimRight()</code> は元の文字列自身の値に影響を与えません。</p> + +<h3 id="Aliasing" name="Aliasing">エイリアス</h3> + +<p>{{jsxref("String.prototype.padEnd")}} のような関数との一貫性を持たせるため、標準メソッドの名前は <code>trimEnd</code> となっています。しかし、ウェブの互換性の観点から、 <code>trimRight</code> が <code>trimEnd</code> のエイリアスとして残されます。エンジンによっては、以下のように解釈されます。</p> + +<pre class="brush: js notranslate">String.prototype.trimRight.name === "trimEnd";</pre> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Using_trimEnd" name="Using_trimEnd">trimEnd() の使用</h3> + +<p>以下の例では、小文字の文字列 <code>' foo'</code> を表示します。</p> + +<pre class="brush: js; highlight: [5] notranslate">var str = ' foo '; + +console.log(str.length); // 8 + +str = str.trimEnd(); +console.log(str.length); // 6 +console.log(str); // ' foo' +</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.trimend', 'String.prototype.trimEnd')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.String.trimEnd")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("String.prototype.trim()")}}</li> + <li>{{jsxref("String.prototype.trimStart()")}}</li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/trimstart/index.html b/files/ja/web/javascript/reference/global_objects/string/trimstart/index.html new file mode 100644 index 0000000000..b7c5a6210c --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/trimstart/index.html @@ -0,0 +1,116 @@ +--- +title: String.prototype.trimStart() +slug: Web/JavaScript/Reference/Global_Objects/String/trimStart +tags: + - JavaScript + - Method + - Prototype + - Reference + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/trimStart +--- +<div>{{JSRef}}</div> + +<p><strong><code>trimStart()</code></strong> メソッドは、文字列の先頭のホワイトスペースを削除します。 <code>trimLeft()</code> はこのメソッドのエイリアスです。</p> + +<div>{{EmbedInteractiveExample("pages/js/string-trimstart.html")}}</div> + +<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox notranslate"><var>str</var>.trimStart(); +<var>str</var>.trimLeft();</pre> + +<h3 id="Return_value" name="Return_value">返値</h3> + +<p>呼び出した文字列から先頭 (左端) からホワイトスペースを削除した新しい文字列です。</p> + +<h2 id="Description" name="Description">解説</h2> + +<p><code>trimStart()</code> と <code>trimLeft()</code> メソッドは、左端のホワイトスペースを取り除いた文字列を返します。 <code>trimLeft()</code> または <code>trimStart()</code> は元の文字列自身の値に影響を与えません。</p> + +<h3 id="Aliasing" name="Aliasing">エイリアス</h3> + +<p>{{jsxref("String.prototype.padStart")}} のような関数との一貫性を持たせるため、標準メソッドの名前は <code>trimStart</code> となっています。しかし、ウェブの互換性の観点から、 <code>trimLeft</code> が <code>trimStart</code> のエイリアスとして残されます。エンジンによっては、以下のように解釈されます。</p> + +<pre class="brush: js notranslate">String.prototype.trimLeft.name === "trimStart";</pre> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Using_trimStart" name="Using_trimStart">trimStart() の使用</h3> + +<p>以下の例では、小文字の文字列 <code>'foo '</code> を表示します。</p> + +<pre class="brush: js; highlight: [5] notranslate">var str = ' foo '; + +console.log(str.length); // 8 + +str = str.trimStart(); +console.log(str.length); // 5 +console.log(str); // 'foo ' +</pre> + +<h2 id="ポリフィル">ポリフィル</h2> + +<pre class="brush: js; highlight: [5] notranslate">//https://github.com/FabioVergani/js-Polyfill_String-trimStart + +(function(w){ + var String=w.String, Proto=String.prototype; + + (function(o,p){ + if(p in o?o[p]?false:true:true){ + var r=/^\s+/; + o[p]=o.trimLeft||function(){ + return this.replace(r,'') + } + } + })(Proto,'trimStart'); + +})(window); + + +/* +ES6: +(w=>{ + const String=w.String, Proto=String.prototype; + + ((o,p)=>{ + if(p in o?o[p]?false:true:true){ + const r=/^\s+/; + o[p]=o.trimLeft||function(){ + return this.replace(r,'') + } + } + })(Proto,'trimStart'); + +})(window); +*/</pre> + +<h2 id="Specifications" name="Specifications">仕様書</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">仕様書</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.trimstart', ' String.prototype.trimStart')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2> + +<div class="hidden">このページの互換性一覧表は構造化データから生成されています。データに協力していただけるのであれば、 <a class="external" href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> をチェックアウトしてプルリクエストを送信してください。</div> + +<p>{{Compat("javascript.builtins.String.trimStart")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("String.prototype.trim()")}}</li> + <li>{{jsxref("String.prototype.trimEnd()")}}</li> +</ul> diff --git a/files/ja/web/javascript/reference/global_objects/string/valueof/index.html b/files/ja/web/javascript/reference/global_objects/string/valueof/index.html new file mode 100644 index 0000000000..ab86db2e01 --- /dev/null +++ b/files/ja/web/javascript/reference/global_objects/string/valueof/index.html @@ -0,0 +1,64 @@ +--- +title: String.prototype.valueOf() +slug: Web/JavaScript/Reference/Global_Objects/String/valueOf +tags: + - JavaScript + - Method + - Prototype + - Reference + - String +translation_of: Web/JavaScript/Reference/Global_Objects/String/valueOf +--- +<div>{{JSRef}}</div> + +<p><strong><code>valueOf()</code></strong> メソッドは、{{jsxref("String")}} オブジェクトのプリミティブ値を返します。</p> + +<div>{{EmbedInteractiveExample("pages/js/string-valueof.html")}}</div> + +<h2 id="Syntax" name="Syntax">構文</h2> + +<pre class="syntaxbox notranslate"><code><var>str</var>.valueOf()</code></pre> + +<h3 id="Return_value" name="Return_value">戻り値</h3> + +<p>与えられた {{jsxref("String")}} オブジェクトのプリミティブ値を表す文字列。</p> + +<h2 id="Description" name="Description">詳細</h2> + +<p>{{jsxref("String")}} オブジェクトの <code>valueOf()</code> メソッドは、{{jsxref("String")}} オブジェクトの文字列型としてのプリミティブ値を返します。この値は、{{jsxref("String.prototype.toString()")}} の戻り値と等価です。</p> + +<p>このメソッドは通常、JavaScript によって内部的に呼ばれ、コード中で明示的に呼ばれることはありません。</p> + +<h2 id="Examples" name="Examples">例</h2> + +<h3 id="Using_valueOf" name="Using_valueOf()"><code>valueOf()</code> メソッドの使用</h3> + +<pre class="brush: js notranslate">var x = new String('Hello world'); +console.log(x.valueOf()); // "Hello world" を表示します +</pre> + +<h2 id="Specifications" name="Specifications">仕様</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">仕様書</th> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-string.prototype.valueof', 'String.prototype.valueOf')}}</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザー実装状況</h2> + +<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> + +<p>{{Compat("javascript.builtins.String.valueOf")}}</p> + +<h2 id="See_also" name="See_also">関連情報</h2> + +<ul> + <li>{{jsxref("String.prototype.toString()")}}</li> + <li>{{jsxref("Object.prototype.valueOf()")}}</li> +</ul> |