javascript tome iv - apply bind borrow call

Transcription

javascript tome iv - apply bind borrow call
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-II
.apply() , .bind() , .borrow() et .call()
Po u r D é b u t a n t
J AVA S C R I P T V O L . I I
J.B. Dadet DIASOLUKA Luyalu Nzoyifuanga
+243 - 851278216 - 899508675 - 991239212 - 902263541 - 813572818
Les méthodes « . apply ( ) » , « bind ( ) , « borrow ( ) » et « . call ( ) » :
On a vu que les fonctions sont des objets tout faits. Elles ont en effet des
méthodes (par exemple les méthodes Apply , Call , Bind ) :
I.
La méthode « Bind() » :
Elle permet de lier l’opérateur « this » à un environnement contextuel
précis.
Bind à la définition de l’event handler :
<button>Tirez un Candidat</button>
<textarea id="txtar" readonly></textarea>
<script type="text/javascript">
"use strict";
var candidat = {
profil :[
{ID:"Martinez G.", matric:11},
{ID:"Robinson T", matric:55},
///// {ID:"Melissa R", matric:00},
// SyntaxError: "0"-prefixed octal literals
and octal escape sequences are deprecated; for octal literals use the "0o" prefix instead [FIREFOX]
// Uncaught SyntaxError: Octal literals are
not allowed in strict mode. [YANDEX]
{ID:"Melissa R", matric:"00"},
Variables & Functions
1 / 25
jeudi, 4. avril 2019 (10:43 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-II
{ID:"Bledina S", matric:33},
{ID:"Gregton B", matric:22}
],
clickHandler:function (event) {
// this est lié à candidat (bind dans appel).
// Sans ce bind this réfère event-handler.
let len = this.profil.length;
var randomNum = (Math.random () * len | 0);
document.getElementById("txtar").innerText =
(this.profil[randomNum].ID + " #" +
this.profil[randomNum].matric+
" ***Sur les "+len+" Prétendants.");
}
};
document.getElementsByTagName("button")[0].addEventListener(
'click', candidat.clickHandler.bind(candidat),
false);
</script>
Exécution :
Tirez un Candidat
Robinson T #55 ***Sur les 5 Prétendants.
Bind au niveau de l’initialisation du pointeur
<script type="text/javascript">
"use strict";
// Candidats, variables globales
var place=" GLOBAL =window";
var data = [
{ID:"Gregoire G", Matric:22},
{ID:"Bolivia G", Matric:33},
{ID:"Petgorje G", Matric:44}
]
var user = {
Variables & Functions
2 / 25
jeudi, 4. avril 2019 (10:43 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-II
// Candidats, variables locales à objet user
place:" LOCAL =user",
data :[ // Propriété
{ID:"Belinda U", Matric:55},
{ID:"Nelson U", Matric:66},
{ID:"Lesmor U", Matric:77},
{ID:"Belafonté U", Matric:77},
{ID:"Zirgont U", Matric:88},
{ID:"Zamith U", Matric:99}
],
disp:function (event) { // Méthode
// Le même this dépend du bind.
const len=this.data.length;
var aleat = (Math.random () * len | 0);
window.cptr=0;
console.log ("******RETENU* = "+
this.data[aleat].ID + " " +
this.data[aleat].Matric);
console.log("Parmi "+len+" prétendants
("+this.place+") :");
this.data.map(function(dummy){console.log(++cptr+">
"+dummy.ID+" "+dummy.Matric)});
}
}
// Pointeur sur méthode disp de user
////
var dispVar = user.disp;
// En mode "use strict";
// TypeError: this is undefined test.html:22:12
// disp file:///K:/DADET/PROGS/test.html:22:12
// <anonyme> file:///K:/DADET/PROGS/test.html:28:4
// Pointeur lié à global
dispVar = user.disp.bind(window);
dispVar (); // Candidats de window
// Pointeur lié à user
var dispVar = user.disp.bind(user);
dispVar (); // Candidats de user
</script>
Variables & Functions
3 / 25
jeudi, 4. avril 2019 (10:43 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-II
Exécution :
******RETENU* = Petgorje G 44
Parmi 3 prétendants ( GLOBAL =window) :
1> Gregoire G 22
2> Bolivia G 33
3> Petgorje G 44
******RETENU* = Zirgont U 88
Parmi 6 prétendants ( LOCAL =user) :
1> Belinda U 55
2> Nelson U 66
3> Lesmor U 77
4> Belafonté U 77
5> Zirgont U 88
6> Zamith U 99
En mode standard (non «use strict»;) JS est très tolérant et laisse passer
l’instruction « var dispVar = user.disp; » qui était rejetée en
mode «use strict;». this est du scope global car c’est là que le pointeur à
la méthode disp() est défini.
Ici window englobe l’objet user.
<script type="text/javascript">
// "use strict";
// Candidats, variables globales
var place=" GLOBAL =window";
var data = [
{ID:"Gregoire G", Matric:22},
{ID:"Bolivia G", Matric:33},
{ID:"Petgorje G", Matric:44}
]
var user = {
// Candidats, variables locales à objet user
place:" LOCAL =user",
data :[ // Propriété
{ID:"Belinda U", Matric:55},
Variables & Functions
4 / 25
jeudi, 4. avril 2019 (10:43 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-II
{ID:"Nelson U", Matric:66},
{ID:"Lesmor U", Matric:77},
{ID:"Belafonté U", Matric:77},
{ID:"Zirgont U", Matric:88},
{ID:"Zamith U", Matric:99}
],
disp:function (event) { // Méthode
// Le même this dépend du bind.
const len=this.data.length;
var aleat = (Math.random () * len | 0);
window.cptr=0;
console.log ("******RETENU* = "+
this.data[aleat].ID + " " +
this.data[aleat].Matric);
console.log("Parmi "+len+" prétendants
("+this.place+") :");
this.data.map(function(dummy){console.log(++cptr+">
"+dummy.ID+" "+dummy.Matric)});
}
};
// Pointeur sur méthode disp de user
// En mode non "use strict";
var dispVar = user.disp;
dispVar (); // Candidats de window
// Pointeur liant this à global (window)
dispVar = user.disp.bind(window);
dispVar (); // Candidats de window
//Pointeur liant this à user
dispVar = user.disp.bind(user);
dispVar (); // Candidats de user
</script>
Exécution :
******RETENU* = Gregoire G 22
Parmi 3 prétendants ( GLOBAL =window) :
1> Gregoire G 22
Variables & Functions
5 / 25 jeudi, 4. avril 2019 (10:43 )
J.D.B. DIASOLUKA Nz. Luyalu
2> Bolivia G 33
3> Petgorje G 44
JavaScript Tome-II
******RETENU* = Bolivia G 33
Parmi 3 prétendants ( GLOBAL =window) :
1> Gregoire G 22
2> Bolivia G 33
3> Petgorje G 44
******RETENU* = Nelson U 66
Parmi 6 prétendants ( LOCAL =user) :
1> Belinda U 55
2> Nelson U 66
3> Lesmor U 77
4> Belafonté U 77
5> Zirgont U 88
6> Zamith U 99
II.
La méthode « borrow () » d’une fonction :
Ci-dessous l’objet « producer » et l’objet « user » sont de même niveau,
tous deux englobés dans l’environnement global, mais « producer » ne
possède pas la méthode de « user » pour traiter (afficher) ses propres
données. Au lieu de lier (BIND) la méthode « disp » de « user » à l’objet
« producer » comme ci-dessus, « producer » peut emprunter (BORROW) cette méthode à partir de « user » , dans l’acception que « producer » n’a pas déjà cette méthode comme propriété propre, qui serait écrasée:
La procédure est presque la même que ci-dessus (pour la partie de
droite), et que quand on définit une nouvelle propriété pour un objet
(pour la partie de gauche, mais au lieu d’une propriété ou une fonction
indépendante, on affecte à la nouvelle propriété celle d’un autre objet) :
<script type="text/javascript">
"use strict";
Variables & Functions
6 / 25
jeudi, 4. avril 2019 (10:43 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-II
// Candidats, variables globales
var producer = {
place:" LOCAL =producer",
data : [
{ID:"Gregoire G", Matric:22},
{ID:"Bolivia G", Matric:33},
{ID:"Petgorje G", Matric:44}
]
}
var user = {
// Candidats, variables locales à objet user
place:" LOCAL =user",
data :[ // Propriété
{ID:"Belinda U", Matric:55},
{ID:"Nelson U", Matric:66},
{ID:"Lesmor U", Matric:77},
{ID:"Belafonté U", Matric:77},
{ID:"Zirgont U", Matric:88},
{ID:"Zamith U", Matric:99}
],
disp:function (event) { // Méthode
// Le même this dépend du bind.
const len=this.data.length;
var aleat = (Math.random () * len | 0);
window.cptr=0;
console.log ("******RETENU* = "+
this.data[aleat].ID + " " +
this.data[aleat].Matric);
console.log("Parmi "+len+" prétendants
("+this.place+") :");
this.data.map(function(dummy){console.log(++cptr+">
"+dummy.ID+" "+dummy.Matric)});
}
}
// Pointeur liant this à user
var dispVar = user.disp.bind(user);
dispVar (); // Candidats de user
// Nouvelle Méthode de producer (producer.disp) =
Variables & Functions
7 / 25
jeudi, 4. avril 2019 (10:43 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-II
// Pointeur sur la méthode user.disp()
producer.disp = user.disp.bind(producer);
producer.disp(); // Candidats de producer
</script>
Exécution :
******RETENU* = Zirgont U 88
Parmi 6 prétendants ( LOCAL =user) :
1> Belinda U 55
2> Nelson U 66
3> Lesmor U 77
4> Belafonté U 77
5> Zirgont U 88
6> Zamith U 99
******RETENU* = Gregoire G 22
Parmi 3 prétendants ( LOCAL =producer) :
1> Gregoire G 22
2> Bolivia G 33
3> Petgorje G 44
III.
La méthode « call » d’une fonction :
La méthode « call » spécifiée à l’appel d’une fonction indique que le
« this » dans cette fonction pointera sur [les propriétés propres de]
l’objet spécifié comme premier argument de « call ». Les arguments qui
suivent après sont les arguments propres de la fonction appelée.
<script>
const hypoténuse = function () {
const a2=Math.pow(this.a , 2) ,
b2=this.b * this.b ;
console.log(
`Hypoténuse = ${Math.sqrt(a2 + b2)}`
);
};
Variables & Functions
8 / 25
jeudi, 4. avril 2019 (10:43 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-II
const oData = {
a:3 , b:4
};
// Appeler la fonction « hypoténuse »
// avec son « this » pointant sur
// les données de l'objet « oData ».
hypoténuse.call(oData); // Hypoténuse = 5
</script>
<script>
const hypoténuse = function (p) {
const a2=Math.pow(this.a , 2) ,
b2=this.b * this.b ;
console.log(
`Hypoténuse = ${Math.sqrt(a2 + b2)}`
);
console.log(
`Applicable sur `+
`${p["a"]}, ${p["b"]}, ${p["c"]}...`
);
};
const oData = {
a:3 , b:4
};
const applic = {
a:"triangle rect",
b:"carré",
c:"rectangle"
};
// Appeler la fonction « hypoténuse »
// avec son « this » pointant sur
// les données de l'objet « oData ».
Variables & Functions
9 / 25
jeudi, 4. avril 2019 (10:43 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-II
hypoténuse.call(oData, applic);
</script>
Pour voir la différence entre « call » et « apply » utilisons les éléments
d’une « array » comme arguments de « call » autre que l’objet pointé
par « this » et représenté par le premier argument de « call ».
Regardez bien « call » peut prendre plusieurs arguments, que nous avons
[du reste] recueillis, dans la fonction « hypoténuse » appelée, dans un
« paramètre du reste …p ».
Le deuxième argument d’« apply » doit quant à lui éventuellement être
une « array » comme on le verra un peu plus loin (et non pas une liste
de plus de un argument).
<script>
const hypoténuse = function (...p) {
const a2=Math.pow(this.a , 2) ,
b2=this.b * this.b ;
console.log(
`Hypoténuse = ${Math.sqrt(a2 + b2)}`
);
console.log(
`Applicable sur `+
`${p[0]}, ${p[1]}, ${p[2]}...`
);
};
const oData = {
a:3 , b:4
};
// Appeler la fonction « hypoténuse »
Variables & Functions
10 / 25
jeudi, 4. avril 2019 (10:43 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-II
// avec son « this » pointant sur
// les données de l'objet « oData ».
hypoténuse.call(oData, "triangle rect",
"carré", "rectangle");
</script>
IV.
La méthode « apply » d’une fonction :
Grossièrement, « apply » est comme le « call », mais son deuxième argument doit être [éventuellement] une « array ».
Toutefois, les éléments de cette « array » (2è argument de la méthode
« apply ») peuvent être réceptionnés dans la fonction appelée aussi bien
dans un « paramètre du reste », que par des « paramètres formels
ordinaires » chacun pour un élément de l’array d’appel.
<script>
const hypoténuse = function (p1,p2,p3, p4, p5) {
const a2=Math.pow(this.a , 2) ,
b2=this.b * this.b ;
console.log(
`Hypoténuse = ${Math.sqrt(a2 + b2)}`
);
console.log(`Applicable sur : `);
console.log(
`${p1}, ${p2}, ${p3}, ${p4}, ${p5}`
);
};
const oData = {
a:3 , b:4
}; // objet
Variables & Functions
11 / 25
jeudi, 4. avril 2019 (10:43 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-II
const applicArray = [
"triangle rect",
"carré",
"rectangle",
"hypercube", "..."
]; // Array
// Appeler la fonction « hypoténuse »
// avec son « this » pointant sur
// les données de l'objet « oData ».
hypoténuse.apply(oData, applicArray);
</script>
Ci-après, nous utilisons un « paramètre du reste » pour recevoir le
deuxième argument de « apply ».
<script>
const hypoténuse = function (...p) {
const a2=Math.pow(this.a , 2) ,
b2=this.b * this.b ;
console.log(
`Hypoténuse = ${Math.sqrt(a2 + b2)}`
);
console.log(`Applicable sur : `);
console.log(
`${p[0]}, ${p[1]}, ${p[2]}, ${p[3]}, ${p[4]}`
);
};
const oData = {
a:3 , b:4
}; // objet
Variables & Functions
12 / 25
jeudi, 4. avril 2019 (10:43 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-II
const applicArray = [
"triangle rect",
"carré",
"rectangle",
"hypercube", "..."
]; // Array
// Appeler la fonction « hypoténuse »
// avec son « this » pointant sur
// les données de l'objet « oData ».
hypoténuse.apply(oData, applicArray);
</script>
Exercice :
Utilisez tout à tour une « array de destructuration » et une « variable
array » pour réceptionner l’array 2è argument de « apply ».
Nous avons vu « bind » ci-haut, dans le cadre de « event handler ».
Voyons-le maintenant dans le contexte ci-dessus pour bien voir la différence avec « call » et les autres.
<script>
const hypoténuse = function (
a,b,c,d,e,f,g) {
const a2=Math.pow(this.a , 2) ,
b2=this.b * this.b ;
console.log(
`Hypoténuse = ${Math.sqrt(a2 + b2)}`
);
console.log(`Applicable sur : `);
console.log(
Variables & Functions
13 / 25
jeudi, 4. avril 2019 (10:43 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-II
`${a}, ${b}, ${c}, ${d}, ${e}`
);
};
const oData = {
a:3 , b:4
}; // objet
const applicArray = [
"triangle rect",
"carré",
"rectangle",
"hypercube", "..."
]; // Array
// « bind » s'utilise mieux
// dans une expression de fonction.
// Comme d'habitude, la définition
// n'exécute pas la fonction.
const foo = hypoténuse.bind(oData,
applicArray[0], applicArray[1], applicArray[2],
applicArray[3], applicArray[4], applicArray[5]);
console.log("=".repeat(30));
foo();
</script>
Variables & Functions
14 / 25
jeudi, 4. avril 2019 (10:43 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-II
Afficher la structure d’une fonction :
<script type="text/javascript">
"use strict";
/*1*/ function fct(){
console.log("function fct()")};
/*2*/ var fct2=function(){
console.log("var fct2=function()")};
/*3*/ let fct3 = _ => console.log(
"let fct3= _ =>");
fct3();
/*3b*/ _ => console.log("_ =>");
/*4*/ var fct4 = new Function(
console.log("var fct4 = new Function"));
/*5*/ var fct5 = (function(){
console.log("var fct5_1 = ((){})()")
}) (console.log("var fct5_2"));
/*6*/ !function(){
console.log("!function()")} // 2è appel
(console.log("!function()_1")) // 1è appel
(console.log("!function()_2")) // 3è appel
(console.log("!function()_3")); // Erreur
</script>
Exécution :
let fct3= _ =>
var fct4 = new Function
var fct5_2
var fct5_1 = ((){})()
!function()_1
!function()
!function()_2
TypeError: (intermediate value)(...) is not a function
Dans la console :
Variables & Functions
15 / 25
jeudi, 4. avril 2019 (10:43 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-II
fct()
length: 0
name: "fct"
prototype: Object { … }
__proto__: function ()
fct2()
length: 0
name: "fct2"
prototype: Object { … }
__proto__: function ()
fct3()
name: "fct3"
__proto__: function ()
fct4
anonymous()
arguments: null
caller: null
length: 0
name: "anonymous"
prototype: Object { … }
__proto__: function ()
fct5
undefined
Console.log qui est un outils de développement (débogueur) n’affiche
pas de la même façon que les autres instructions JS d’affichage.
<script type="text/javascript">
function la_fct(p){
// Sans autre paramètre que le nom de la fonction,
// donne son Type (expensible), affiché comme
poin-teur
console.log(la_fct);
Variables & Functions
16 / 25
jeudi, 4. avril 2019 (10:43 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-II
// Avec d'autres paramètres que le nom de la fonction,
// donne le Contenu = Code de la fonction.
console.log(p+" + "+la_fct);
}
function appeleur(){
la_fct("***ARGUMENT***",2)
}
appeleur();
</script>
Avec document.write :
Le code source de toutes les fonctions est affiché.
P.S.: nous avons ajouté un renvoi à la ligne avant ***ARGUMENT*** et
simplifié les commentaires.
<script type="text/javascript">
function la_fct(p){
document.write(la_fct); // Type,
dépliable
document.write(p+" + "+la_fct); // Contenu = Code.
}
</script>
***ARGUMENT*** + function la_fct(p){
document.write(la_fct); // Type, expansible
document.write(p+" + "+la_fct); // Contenu = Code. }
Avec console.log :
function la_fct()
***ARGUMENT*** + function la_fct(p){
// Sans autre paramètre que le nom de la fonction,
// donne son Type (expansible), affiché comme pointeur
console.log(la_fct);
Variables & Functions
17 / 25
jeudi, 4. avril 2019 (10:43 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-II
// Avec d'autres paramètres que le nom de la fonction,
// donne le Contenu = Code de la fonction.
console.log(p+" + "+la_fct);
}
Exemple simple :
<script type="text/javascript">
var Pomme = {
couleur: "rouge",
poids: 50,
};
console.log(Pomme);
console.log("Notre pomme : " + Pomme);
</script>
Exécution :
Object {couleur: "rouge", poids: 50}
Notre pomme : [object Object]
<script type="text/javascript">
var Pomme = {
couleur: "rouge",
poids: 50,
};
console.log(Pomme);
console.log("Notre pomme : " , Pomme);
</script>
Avec le nom d’un objet seul comme paramètre, console.log affiche selon
Variables & Functions
18 / 25
jeudi, 4. avril 2019 (10:43 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-II
les navigateurs, soit seulement le nom de l’objet comme pointeur qu’on
peut cliquer pour voir les détails de la structure de l’objet., soit directement ces détails.
Avec d'autres paramètres que le nom de l’objet seul, console.log donne
seulement la chaîne de caractères qui décrit l’élément (object Object
pour indiquer que l’objet en cours est une instance de l’objet Object),
car l’opérateur « + » agit comme opérateur de concaténation de chaînes
de caractères dès que l’un des opérande est une chaîne. Or la conversion
(transtypage = typecasting = type coercion = type conversion) d’un objet
en chaîne de caractères fait automatiquement appel à la méthode toString() de l’objet en cours, et quand celui-ci n’en dispose pas, elle appelle la toString() native de l’objet « Object » (le parent de tous les
objets que vous créez) qui n’affiche que ça.
Concernant le typecasting :
1. Dans les opérations arithmétiques les chaînes sont converties
("implied typecasting) en nombres ;
2. Dans les opérations de concaténation (toute addition impliquant
une chaîne de caractères) ce sont les autres types qui sont convertis en chaîne de caractères.
Voyez donc ceci à la console :
"88"+77 -> "8877"
88+"77" -> "8877"
"88+77" -> "88+77"
88+77 -> 165
"Somme = " + 4 + 7 -> "Somme = 47"
"Somme = "+1*4+7 -> "Somme = 47"
"Somme = "+1*(4+7) -> "Somme = 11"
"Somme = "+(4+7) -> "Somme = 11"
"Somme = "+-(-4-7) -> "Somme = 11"
"Somme = "+eval(4+7) -> "Somme = 11"
"Somme = "+eval(4)+eval(7) -> "Somme = 47"
Variables & Functions
19 / 25
jeudi, 4. avril 2019 (10:43 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-II
"Somme = "+parseInt(4)+parseInt(7) -> "Somme =
47"
Et dans un code :
<script type="text/javascript">
"use strict";
let n1=prompt("Donnez un nombre",
Math.floor(Math.random()*100));
const n2=prompt("Donnez un auttre nombre",
Math.floor(Math.random()*100));
console.log(n1+" + "+n2+" = ");
console.log(n1 + n2);
console.log(parseInt(n1) + parseInt(n2));
console.log(eval(n1) + eval(n2));
let n1e=eval(n1), n2e=eval(n2);
console.log(n1e + n2e);
let n1p=parseInt(n1), n2p=parseInt(n2);
console.log(n1p + n2p);
</script>
31 +
3123
54
54
23 =
(test.html:7:4)
(test.html:9:4)
(test.html:13:4)
test.html:6:4
54 (test.html:8:4)
54 (test.html:11:4)
Si vous voulez autre chose que ce que le Object.toString() natif de
l’objet Object (le parent de tous les autres objets) affiche, vous devez
donc l’implémenter dans votre en cours pour prévaloir sur (override)
celui (par défaut) de l’object Object.
Note :
object avec « o » minuscule = substantif générique.
Object avec « O » MAJUSCULE = Objet (structure de donnée) natif.
Implémentation d’une méthode toString() pour l’objet Pomme.
<script type="text/javascript">
Pomme = {
Variables & Functions
20 / 25
jeudi, 4. avril 2019 (10:43 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-II
couleur: "rouge",
poids: 50,
toString:function(){
v= "Couleur = "+this.couleur+
" poids = "+this.poids;
return v;
}
};
// Pointeur sur Pomme
console.log(Pomme);
// Appel implicite de Pomme.toString()
console.log("Notre Pomme : " + Pomme);
// Appel explicite de Pomme.toString()
console.log("Notre Pomme : " + Pomme.toString());
</script>
Exécution :
Notez que la Console permet d’afficher (dérouler) tous les niveaux de la
structure de la fonction et de ses membres (attributs y compris les objets
qui la constituent).
Cliquons sur « Object { couleur: "rouge", poids: 50 } »
dans la console pour avoir ceci :
{…}
couleur: "rouge"
poids: 50
__proto__: Object { … }
{…} symbolise un objet, puis vient son contenu (structure).
Voyons comment une fonction ordinaire est représentée dans la console :
Variables & Functions
21 / 25
jeudi, 4. avril 2019 (10:43 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-II
<script type="text/javascript">
function notre_fct(p1,p2){
couleur= p1;
var poids= p2;
toString=function(){
v= "Coul = "+couleur+" , pds = "+poids
return v;
}
}
// Pointeur sur notre_fct
console.log(notre_fct);
console.log("==> notre_fct = "+notre_fct);
</script>
Exécution :
function notre_fct()
==> notre_fct = function notre_fct(p1,p2){
couleur= p1;
var poids= p2;
toString=function(){
v= "Coul = "+couleur+" , pds = "+poids
return v;
}
}
Dans la console, cliquons sur « function notre_fct() » et à
l’intérieur, sur « __proto__ » (__proto__ = prototype du constructeur)
notre_fct()
arguments: null
caller: null
name: "notre_fct"
__proto__: ()
apply: function apply()
arguments: null
bind: function bind()
call: function call()
Variables & Functions
22 / 25
jeudi, 4. avril 2019 (10:43 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-II
caller: null
constructor: function Function()
isGenerator: function isGenerator()
length: 0
name: ""
toSource: function toSource()
toString: function toString()
Symbol(Symbol.hasInstance): undefined
__proto__: Object { … }
Kinshasa, le jeudi 4 avril 2019 (10:43:21 PM10:43 ).
Mots-clés :
fonctions,curry,currying,redéfinition,fonction fermeture,closure,paramètre du
reste,blocs de code,réutilisables,fonctions nommées,fonctions anonymes,expressions de fonctions immédiatement invoquées,eventHandler,affecter,variable,pointeur,script,types de fonction,syntaxes de
fonction.
Mercredi, 11. avril 2018 (23:34 [pm]).
Dernière mise à jour : jeudi 4 avril 2019 (10:43:21 PM).
DIASOLUKA Nz. Luyalu
Docteur en Médecine, Chirurgie & Accouchements
(1977),
CNOM : 0866 - Spécialiste en ophtalmologie (1980)
Informaticien-amateur, Programmeur et WebMaster.
Chercheur indépendant, autonome et autofinancé, bénévole,
sans aucun conflit ou lien d’intérêt ou contrainte promotionVariables & Functions
23 / 25
jeudi, 4. avril 2019 (10:43 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-II
nelle avec qui qu’il soit ou quelqu’organisme ou institution /
organisation que ce soit, étatique, paraétatique ou privé, industriel ou commercial en relation avec le sujet présenté.
+243 - 851278216 - 899508675 - 995624714 - 902263541 813572818
[email protected]
Autre Lecture :
https://www.scribd.com/document/374738470/Le-Plus-Grand-Secret-de-LaCreation
D’autres publications pouvant aussi intéresser :
• https://www.scribd.com/document/377036251/Le-Dosage-DesMedicaments-en-Cac-Cas
• https://www.scribd.com/document/377035454/Le-Hasard-DesThermometres-Non-contact-a-Infrarouge
• https://www.scribd.com/document/376222482/Petite-IntroductionAux-Fonctions-JavaScript
• https://www.scribd.com/document/376221919/La-Foi-en-Jesus-ChristPour-Quoi-Faire
• https://www.scribd.com/document/375689778/Lacuite-visuelleangulaire
• https://www.scribd.com/document/375349851/La-variable-This
• https://www.scribd.com/document/375024162/Fonctions-Imbriqueesen-JS
• https://www.scribd.com/document/374789297/Format-Interne-DesObjets-JavaScript
• https://www.scribd.com/document/374788758/Iterations-en-JavaScript
• https://www.scribd.com/document/374738470/Le-Plus-Grand-SecretVariables & Functions
24 / 25
jeudi, 4. avril 2019 (10:43 )
J.D.B. DIASOLUKA Nz. Luyalu
JavaScript Tome-II
de-La-Creation
• https://www.scribd.com/document/374597969/Nouvelle-Formule-dIMC-indice-de-doduite-Selon-Dr-Diasoluka
• https://www.scribd.com/document/373847209/Property-Descriptors
• https://www.scribd.com/document/373833282/l-Objet-Global-Window
• https://www.scribd.com/document/372665249/Javascript-Tome-II
• https://www.scribd.com/document/355291488/motilite-oculaire-2
• https://www.scribd.com/document/355291239/motilite-oculaire-I
• https://www.scribd.com/document/355290248/Script-d-Analyses-DesReflexes-Pupillomoteurs
• https://www.scribd.com/document/321168468/Renseignements-Id-etAnthropometriques
• https://www.scribd.com/document/320856721/Emission-31-Jul-2016
• https://www.scribd.com/document/318182982/Complication-Visuelledu-Traitement-de-La-Malaria
• https://www.scribd.com/document/318180637/Rapport-EntreOxymetrie-Et-Type-Respiration
• https://www.scribd.com/document/315746265/Classification-DesMedicaments
• https://www.scribd.com/document/315745909/IncongruencesHeresies-et-Heterodoxies-de-la-Notion-de-Laboratoire
• https://www.scribd.com/document/315745725/Rapport-EntreOxymetrie-Et-Type-Respiration
Variables & Functions
25 / 25
jeudi, 4. avril 2019 (10:43 )