You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: 1-js/07-object-properties/02-property-accessors/article-fr.md
+91-1Lines changed: 91 additions & 1 deletion
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -5,4 +5,94 @@ Il y a deux sortes de proriétés d'objet.
5
5
6
6
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.
7
7
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
+
getfullName() {
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
+
getfullName() {
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
+
getfullName() {
81
+
return`${this.name}${this.surname}`;
82
+
},
83
+
84
+
*!*
85
+
setfullName(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