1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
|
---
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>
<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>
|
