Skip to content

Commit 719c448

Browse files
committed
docs: add second section translation
1 parent a8e79ff commit 719c448

File tree

1 file changed

+91
-1
lines changed

1 file changed

+91
-1
lines changed

1-js/07-object-properties/02-property-accessors/article-fr.md

Lines changed: 91 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,4 +5,94 @@ Il y a deux sortes de proriétés d'objet.
55

66
Le premier type est *les propriétés de données*. Nous savons déjà comment travaillez avec. Toutes les propriétés que nous avons utilisé jusqu'à maintenant étaient des propriétés de données.
77

8-
Le second type de propriété est quelque chose de nouveau. C'est un accesseur de propriété. Ce sont essentiellement des fonctions qui exécute une récupération ou une déclaration de valeur, mais qui ressemblent à une propriété normale pour le code extérieur.
8+
Le second type de propriété est quelque chose de nouveau. C'est un accesseur de propriété. Ce sont essentiellement des fonctions qui exécute une récupération ou une déclaration de valeur, mais qui ressemblent à une propriété normale pour le code extérieur.
9+
10+
## Getters et Setters
11+
12+
Les accesseurs de propriétés sont représentés par des méthodes "getter" et "setter". Dans un objet littéral elles se demarquent par `get` et `set` :
13+
14+
```js
15+
let obj = {
16+
*!*get propName()*/!* {
17+
// Getter, le code va récupérer obj.propName
18+
},
19+
20+
*!*set propName(value)*/!* {
21+
// Setter, le code va définir obj.propName = value
22+
}
23+
};
24+
```
25+
26+
Le getter sert quand `obj.propName` est lu, le setter -- quand c'est assigné.
27+
28+
Par exemple, nous avons un objet `user` avec `name` et `surname` :
29+
30+
```js
31+
let user = {
32+
name: "John",
33+
surname: "Smith"
34+
};
35+
```
36+
37+
Maintenant nous voulons ajouter une propriété `fullName`, qui devrait être `"John Smith"`. Bien sûr, nous ne voulons pas copier-coller l'information existante, donc nous pouvons implementer un accesseur :
38+
39+
```js run
40+
let user = {
41+
name: "John",
42+
surname: "Smith",
43+
44+
*!*
45+
get fullName() {
46+
return `${this.name} ${this.surname}`;
47+
}
48+
*/!*
49+
};
50+
51+
*!*
52+
alert(user.fullName); // John Smith
53+
*/!*
54+
```
55+
56+
De l'extérieur, un accesseur de propriété ressemble à une propriété normale. C'est l'idée d'un accesseur. Nous n'*appellons* pas `user.fullName` comme une fonction, nous la *lisons* normallement : le getter agit sans le faire savoir.
57+
58+
Pour l'instant, `fullName` n'a qu'un getter. Si nous essayions d'assigner `user.fullName=`, il y aura une erreur :
59+
60+
```js run
61+
let user = {
62+
get fullName() {
63+
return `...`;
64+
}
65+
};
66+
67+
*!*
68+
user.fullName = "Test"; // Erreur (la propriété n'a qu'un getter)
69+
*/!*
70+
```
71+
72+
Corrigeons cela en ajoutant un setter pour `user.fullName` :
73+
74+
75+
```js run
76+
let user = {
77+
name: "John",
78+
surname: "Smith",
79+
80+
get fullName() {
81+
return `${this.name} ${this.surname}`;
82+
},
83+
84+
*!*
85+
set fullName(value) {
86+
[this.name, this.surname] = value.split(" ");
87+
}
88+
*/!*
89+
};
90+
91+
// Le setter est exécuté avec la valeur donnée.
92+
user.fullName = "Alice Cooper";
93+
94+
alert(user.name); // Alice
95+
alert(user.surname); // Cooper
96+
```
97+
98+
Comme résultat, nous avons une propriété "virtuelle" `fullName`. Elle est lisible et ecrivable.

0 commit comments

Comments
 (0)