aboutsummaryrefslogtreecommitdiff
path: root/files/fr/web/javascript/reference/objets_globaux/string/index.html
blob: acb1dd450ed07fe0cf3a8b15fde149f5f68bb856 (plain)
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
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
---
title: String
slug: Web/JavaScript/Reference/Objets_globaux/String
tags:
  - ECMAScript 2015
  - JavaScript
  - Reference
  - String
  - polyfill
translation_of: Web/JavaScript/Reference/Global_Objects/String
---
<div>{{JSRef}}</div>

<p>L'objet global <strong><code>String</code></strong> est un constructeur de chaînes de caractères.</p>

<h2 id="Syntaxe">Syntaxe</h2>

<p>Les littéraux de chaînes de caractères peuvent avoir l'une des formes suivantes :</p>

<pre class="syntaxbox">'texte de chaînes de caractères'
"texte de chaînes de caractères"
"中文 español English देवनागरी العربية português বাংলা русский 日本語 ਪੰਜਾਬੀ 한국어 עברית"</pre>

<p>Les chaînes peuvent également être créées en utilisant directement le constructeur <code>String</code> :</p>

<pre class="syntaxbox">String(texte)</pre>

<h3 id="Paramètres">Paramètres</h3>

<dl>
 <dt><code>texte</code></dt>
 <dd>Une valeur qu'on souhaite convertir en une chaîne de caractères.</dd>
</dl>

<h3 id="Littéraux_de_gabarits">Littéraux de gabarits</h3>

<p>Depuis ECMAScript 2015, les littéraux de chaînes de caractères sont également appelés des <a href="/fr/docs/Web/JavaScript/Reference/Gabarit_chaînes_caractères">littéraux de gabarits</a> :</p>

<pre class="syntaxbox">`Coucou monde`
`Coucou !
monde !`
`Coucou ${qui}`
tag `&lt;a&gt;${qui}&lt;/a&gt;`
</pre>

<h3 id="Échappement_des_caractères">Échappement des caractères</h3>

<p>En dehors des caractères classiques, des caractères spéciaux peuvent être encodés grâce à l'échappement :</p>

<table class="standard-table">
 <thead>
  <tr>
   <th scope="col">Code</th>
   <th scope="col">Résultat</th>
  </tr>
 </thead>
 <tbody>
  <tr>
   <td><code>\XXX</code> (<code>XXX</code> = 1 à 3 chiffres octaux pour l'intervalle 0 - 377)</td>
   <td>Caractère ISO-8859-1. Point de code Unicode entre U+0000 et U+00FF</td>
  </tr>
  <tr>
   <td><code>\'</code></td>
   <td>simple quote</td>
  </tr>
  <tr>
   <td><code>\"</code></td>
   <td>double quote</td>
  </tr>
  <tr>
   <td><code>\\</code></td>
   <td>barre oblique inversée</td>
  </tr>
  <tr>
   <td><code>\n</code></td>
   <td>nouvelle ligne</td>
  </tr>
  <tr>
   <td><code>\r</code></td>
   <td>retour chariot</td>
  </tr>
  <tr>
   <td><code>\v</code></td>
   <td>tabulation verticale</td>
  </tr>
  <tr>
   <td><code>\t</code></td>
   <td>tabulation</td>
  </tr>
  <tr>
   <td><code>\b</code></td>
   <td>retour arrière</td>
  </tr>
  <tr>
   <td><code>\f</code></td>
   <td>saut de page (<em>form feed</em>)</td>
  </tr>
  <tr>
   <td><code>\uXXXX</code> (<code>XXXX</code> étant 4 chiffres hexadécimaux pour l'intervalle of 0x0000 - 0xFFFF)</td>
   <td>Codet UTF-16. Point de code Unicode entre U+0000 et U+FFFF</td>
  </tr>
  <tr>
   <td><code>\u{X}</code> ... <code>\u{XXXXXX}</code> (<code>X…XXXXXX</code> étant 1 à 6 chiffres hexadécimaux pour l'intervalle 0x0 - 0x10FFFF)</td>
   <td>Codet UTF-32. Point de code Unicode entre U+0000 et U+10FFFF {{experimental_inline}}</td>
  </tr>
  <tr>
   <td><code>\xXX</code> (<code>XX</code> étant 2 chiffres hexadécimaux pour l'intervalle 0x00 - 0xFF)</td>
   <td>Caractère ISO-8859-1. Point de code Unicode entre U+0000 et U+00FF</td>
  </tr>
 </tbody>
</table>

<div class="note">
<p><strong>Note :</strong> À la différence d'autres langages, JavaScript ne différencie pas les chaînes contenues dans des doubles quotes (") de celles contenues dans des simples quotes ('). Pour cette raison, les chaînes d'échappement présentées ci-avant fonctionnent sur les chaînes, peu importe la façon dont elles sont encadrées.</p>
</div>

<h3 id="Littéraux_pour_les_chaînes_longues">Littéraux pour les chaînes longues</h3>

<p>Il peut arriver que le code contienne des chaînes plutôt longues. Plutôt que d'avoir des lignes qui s'étirent sur tout le fichier et dans un éditeur de code, il est possible de casser la chaîne sur plusieurs lignes sans que cela modifie le contenu de la chaîne. Il existe deux façons pour le faire :</p>

<pre class="brush: js">let chaîneLongue = "Voici une très longue chaîne qui a besoin " +
                   " d'être passée à la ligne parce que sinon " +
                   " ça risque de devenir illisible.";</pre>

<p>ou on peut utiliser le caractère barre oblique inversée "\" à la fin de chaque ligne pour indiquer que la chaîne continue sur la ligne suivante. Il faut bien faire attention à ce que la barre oblique soit bien le dernier caractère de la ligne avant le saut de ligne. Sinon, cela ne fonctionnera pas. Voilà comment se présente cette forme :</p>

<pre class="brush: js">let chaîneLongue = "Voici une très longue chaîne qui a besoin \
d'être passée à la ligne parce que sinon \
ça risque de devenir illisible.";</pre>

<h2 id="Description">Description</h2>

<p>Les chaînes de caractères sont utiles pour représenter des données textuelles. Les opérations les plus fréquentes qui concernent les chaînes de caractères sont : la vérification de leur {{jsxref("String.length", "longueur")}}, la concaténation de plusieurs chaînes grâce aux opérateurs <a href="/fr/docs/Web/JavaScript/Reference/Opérateurs/Opérateurs_arithmétiques#Addition_()">+ et +=</a>, étudier la présence et la position de fragments de chaînes avec les méthodes {{jsxref("String.prototype.indexOf", "indexOf()")}} et {{jsxref("String.prototype.substring", "substring()")}}.</p>

<h3 id="Accéder_à_un_caractère">Accéder à un caractère</h3>

<p>Il existe deux façons d'accéder à un caractère dans une chaîne. La première façon consiste à utiliser la méthode {{jsxref("String.prototype.charAt", "charAt()")}} :</p>

<pre class="brush: js">return 'chat'.charAt(2); // renvoie "a"</pre>

<p>La seconde méthode, introduite avec ECMAScript 5, est de manipuler la chaîne comme un tableau, où les caractères sont les éléments du tableau et ont un indice correspondant à leur position :</p>

<pre class="brush: js">return 'chat'[2]; // renvoie "a"</pre>

<p>En utilisant la seconde notation, il est impossible de supprimer ou d'affecter une valeur à ces propriétés. En effet, les propriétés concernées ne sont ni accessibles en écriture ni configurables. Pour plus d'informations, voir la page de {{jsxref("Object.defineProperty()")}}.</p>

<h3 id="Comparer_des_chaînes_de_caractères">Comparer des chaînes de caractères</h3>

<p>Les développeurs C utilisent la fonction <code>strcmp()</code> pour comparer des chaînes de caractères. En JavaScript, il est possible d'utiliser <a href="/fr/docs/Web/JavaScript/Reference/Opérateurs/Opérateurs_de_comparaison">les opérateurs inférieur et supérieur </a>:</p>

<pre class="brush: js">var a = "a";
var b = "b";
if (a &lt; b) { // true
  console.log(a + " est inférieure à " + b);
} else if (a &gt; b) {
  console.log(a + " est supérieure à " + b);
} else {
  console.log(a + " et " + b + " sont égales.");
}</pre>

<p>On peut obtenir un résultat semblable avec la méthode {{jsxref("String.prototype.localeCompare()", "localeCompare()")}} qui permet de prendre en compte la locale utilisée et qui est héritée par toutes les instances de <code>String</code>.</p>

<h3 id="Les_différences_entre_les_objets_String_et_le_type_primitif_pour_les_chaînes_de_caractères">Les différences entre les objets <code>String</code> et le type primitif pour les chaînes de caractères</h3>

<p>Les objets <code>String</code> sont créés en appelant le constructeur <code>new String()</code>. L'objet <code>String</code> encapsule le type de données primitif string de JavaScript en fournissant les méthodes décrites plus bas. La fonction globale <code>String()</code> peut également être appelée sans l'opérateur <code>new</code> pour créer une chaîne primitive. Les chaînes littérales dans le code JavaScript sont des chaînes primitives. (On a la même analogie pour {{jsxref("Boolean")}} et {{jsxref("Objets_globaux/Number","Numbers")}}.)</p>

<p>Étant donné que JavaScript effectue automatiquement les conversions entre chaînes primitives et objets String, toute méthode de l'objet <code>String</code> peut être appelée sur une chaîne primitive. JavaScript convertira automatiquement la chaîne en un objet <code>String</code> temporaire, appellera la méthode, puis détruira l'objet temporaire. Par exemple, on peut utiliser la propriété <code>String.length</code> sur une chaîne créée de manière littérale :</p>

<pre class="brush: js">var s_prim = "toto";
var s_obj = new String(s_prim);

console.log(typeof s_prim); // affiche "string"
console.log(typeof s_obj);  // affiche "object"</pre>

<p>(Une chaîne littérale peut être délimitée par des guillemets simples ou doubles.)</p>

<p>Les objets String peuvent être convertis en chaînes primitives à l'aide de <code>String.valueOf()</code>.</p>

<p>Les chaînes primitives et les objets String renvoient des résultats différents lorsqu'ils sont évalués en JavaScript. Les chaînes primitives sont traitées comme du code source, tandis que les objets String sont traités comme un objet de séquence de caractères. Par exemple :</p>

<pre class="brush: js">s1 = "2 + 2";                    // crée une chaîne primitive
s2 = new String("2 + 2");        // crée un objet String
console.log(eval(s1));           // renvoie le nombre 4
console.log(eval(s2));           // renvoie la chaîne "2 + 2"
console.log(eval(s2.valueOf())); // renvoie le nombre 4</pre>

<p>Pour ces raisons, il peut y avoir certains problèmes quand le code attend une chaîne primitive plutôt qu'un objet <code>String</code>. Généralement la distinction n'a pas besoin d'être utilisée.</p>

<p>Un objet <code>String</code> peut toujours être converti en son équivalent primitif grâce à la méthode {{jsxref("String.prototype.valueOf()", "valueOf()")}}.</p>

<pre class="brush: js">console.log(eval(s2.valueOf())); // renvoie  4</pre>

<div class="note"><strong>Note :</strong> Une autre approche pour gérer des chaînes de caractères en JavaScript consiste à utiliser <a href="/fr/Add-ons/Code_snippets/StringView"><code>StringView</code> – une représentation semblable à celle utilisée par le langage C pour traîter les chaînes comme des tableaux typés</a>.</div>

<h2 id="Propriétés">Propriétés</h2>

<dl>
 <dt>{{jsxref("String.prototype")}}</dt>
 <dd>permet d'ajouter des propriétés à tous les objets <code>String</code>.</dd>
</dl>

<h2 id="Méthodes">Méthodes</h2>

<dl>
 <dt>{{jsxref("String.fromCharCode()")}}</dt>
 <dd>Renvoie une chaine de caractères créée en utilisant la séquence de valeurs Unicode fournie.</dd>
 <dt>{{jsxref("String.fromCodePoint()")}}</dt>
 <dd>Renvoie une chaine de caractères créée en utilisant la séquence de points de code fournie.</dd>
 <dt>{{jsxref("String.raw()")}} {{experimental_inline}}</dt>
 <dd>Renvoie une chaine de caractères à partir d'un modèle brut de chaine de caractères.</dd>
</dl>

<h2 id="Instances_de_String">Instances de <code>String</code></h2>

<h3 id="Propriétés_2">Propriétés</h3>

<p>{{page('fr/docs/Web/JavaScript/Reference/Objets_globaux/String/prototype', 'Propriétés')}}</p>

<h3 id="Méthodes_2">Méthodes</h3>

<h4 id="Méthodes_non_liées_à_HTML">Méthodes non liées à HTML</h4>

<p>{{page('fr/docs/Web/JavaScript/Reference/Objets_globaux/String/prototype', 'Méthodes non liées à HTML')}}</p>

<h4 id="Méthodes_de_transformation_à_HTML">Méthodes de transformation à HTML</h4>

<p>{{page('fr/docs/Web/JavaScript/Reference/Objets_globaux/String/prototype', 'Méthodes de transformation HTML')}}</p>

<h2 id="Exemples">Exemples</h2>

<p>Il est possible d'utiliser <code>String</code> comme une alternative à {{jsxref("String.prototype.toString()", "toString()")}} car cela permet de traiter les valeurs {{jsxref("null")}}, {{jsxref("undefined")}} et les {{jsxref("Symbol","symboles","",1)}}. Ainsi :</p>

<pre class="brush: js">var chainesSortie= [];
for (let i = 0, n = valeursEntrée.length; i &lt; n; ++i) {
  chainesSortie.push(String(valeursEntrée[i]));
}</pre>

<h2 id="Spécifications">Spécifications</h2>

<table class="standard-table">
 <thead>
  <tr>
   <th scope="col">Spécification</th>
   <th scope="col">État</th>
   <th scope="col">Commentaires</th>
  </tr>
 </thead>
 <tbody>
  <tr>
   <td>{{SpecName('ES1')}}</td>
   <td>{{Spec2('ES1')}}</td>
   <td>Définition initiale.</td>
  </tr>
  <tr>
   <td>{{SpecName('ES5.1', '#sec-15.5', 'String')}}</td>
   <td>{{Spec2('ES5.1')}}</td>
   <td></td>
  </tr>
  <tr>
   <td>{{SpecName('ES2015', '#sec-string-objects', 'String')}}</td>
   <td>{{Spec2('ES2015')}}</td>
   <td></td>
  </tr>
  <tr>
   <td>{{SpecName('ESDraft', '#sec-string-objects', 'String')}}</td>
   <td>{{Spec2('ESDraft')}}</td>
   <td></td>
  </tr>
 </tbody>
</table>

<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2>

<p class="hidden">Le tableau de compatibilité de cette page a été généré à partir de données structurées. Si vous souhaitez contribuer à ces données, n'hésitez pas à envoyer une <em>pull request</em> sur <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</p>

<p>{{Compat("javascript.builtins.String",2)}}</p>

<h2 id="Voir_aussi">Voir aussi</h2>

<ul>
 <li>{{domxref("DOMString")}}</li>
 <li><a href="/fr/Add-ons/Code_snippets/StringView"><code>StringView</code></a></li>
 <li><a href="/fr/docs/Web/API/DOMString/Binary">Chaînes binaires</a></li>
</ul>