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
| <!DOCTYPE html>
<html lang="fr" dir="ltr">
<head>
<meta http-equiv="cache-control" content="public, max-age=60">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="author" content="Daniel Hagnoul">
<title>Test</title>
<style>
</style>
<script>
'use strict';
let
Animal = function( name ){
this.name = name;
},
Dog = function( name, pays ){
Animal.call( this, name );
this.pays = pays;
};
/*
* Création du prototype de Animal, un objet vide et
* ajout de méthodes
*/
Animal.prototype = Object.create( {}, {
"sayName": {
"value" : function(){
return this.name;
},
"enumerable" : true,
"configurable" : true
},
"race": {
"value" : "indéterminée",
"enumerable" : true,
"configurable" : true,
"writable" : true
}
});
/*
* Création du prototype de Dog (héritage simple), un nouvel
* objet contenant les méthodes de l'objet Animal.prototype et
* ajout de méthodes.
*/
Dog.prototype = Object.create( Animal.prototype, {
"sayName": {
"value" : function( str ){ // Surcharge de la méthode sayName
return ( str + Animal.prototype.sayName.call( this ) );
},
"enumerable" : true,
"configurable" : true
},
"bark": {
"value" : function(){
return "Woof!";
},
"enumerable" : true,
"configurable" : true
},
});
document.addEventListener( 'DOMContentLoaded', ev => {
}, false );
window.addEventListener( 'load', ev => {
let
MonChien = new Dog( "Youki", "Belgique" ),
AutreChien = new Dog( "Caline", "France" );
AutreChien.race = "Bichon";
console.log( "MonChien.sayName() = ", MonChien.sayName( "Mon joli toutou s'appelle " ) );
console.log( "MonChien.bark() = ", MonChien.bark() );
console.log( "MonChien : ", MonChien );
console.log( "MonChien instanceof Dog : ", MonChien instanceof Dog );
console.log( "MonChien instanceof Animal : ", MonChien instanceof Animal );
console.log( "AutreChien.race : ", AutreChien.race );
console.log( "MonChien.race : ", MonChien.race );
console.log( "AutreChien.sayName() : ", AutreChien.sayName( "Mon joli toutou s'appelle " ) );
console.log( "AutreChien.bark() : ", AutreChien.bark() );
/*
* On peut ajouter des propriétés à un objet existant
*/
Object.defineProperties( AutreChien, {
"vacciner" : {
"value" : true,
"enumerable" : true,
"writable" : true
}
});
console.log( "vacciner : ", AutreChien.vacciner, MonChien.vacciner );
console.log( "MonChien keys : ", Object.keys( MonChien ) );
console.log( "AutreChien keys : ", Object.keys( AutreChien ) );
/*
MonChien.sayName() = Mon joli toutou s'appelle Youki
MonChien.bark() = Woof!
MonChien : Dog {name: "Youki", pays: "Belgique", sayName: function, bark: function, sayName: function…}
MonChien instanceof Dog : true
MonChien instanceof Animal : true
AutreChien.race : Bichon
MonChien.race : indéterminée
AutreChien.sayName() : Mon joli toutou s'appelle Caline
AutreChien.bark() : Woof!
vacciner : true undefined
MonChien keys : ["name", "pays"]
AutreChien keys : ["name", "pays", "race", "vacciner"]
*/
}, false );
</script>
</head>
<body>
<main>
</main>
</body>
</html> |
