Variables, Fonctions & Nouveautés - javascript_tome_ii
publicité
J.B. Dadet DIASOLUKA Luyalu Nzoyifuanga JA V ASCRIPT (ProgrammationInternet)VOL. II +243 - 851278216 - 899508675 - 995624714 - 902263541 - 813572818 [email protected] Après le succès foudroyant du Vol I destiné à démontrer de façon pragmatique, pratique la puissance du JavaScript à résoudre même les problèmes Mathématiques ( *l ’ algorithmique d ’ analyse des nombres de Kaprekar, *le calcul du carr é d ’ un nombre, *le carr é parfait, *les tests conditionnels, *quelques diff é rences entre langage C et JavaScript, mais aussi *diff é rents é diteurs de texte et leurs particularit é s ), voici le VOL II basé sur Es8 (2018) et qui est premièrement destiné à enrichir mon mémento personnel mais aussi à aider les autres dans leurs premiers pas dans ce langage. Cette démarche saugrenue/surprenante, de commencer par le plus complexe pour continuer par le plus simple, s’explique par le fait que nous voulions d’abord faire l’apologie du langage =JavaScript JavaScript (ex LiveScript LiveScript, normalisé dans ECMASCRIPT ECMASCRIPT)= avant de nous lancer en douceur dans ses abysses et détails. Cette série présentera de façons très élégante, les concepts fondamentaux (de base, essentiels) permettant un engagement progressif, plus profond et plus efficace dans ce langage. C’est aussi, une fois de plus, l’occasion de remercier, honorer, glorifier, adorer et aduler le Grand Dieu, tout Puissant Cr é ateur de toutes choses qui existent (et celles qui n’existent pas encore mais qui existeront, visibles et cachées, connues et ignorées, imaginables et insoupçonnables...) pour toutes les merveilles qu’Il a toujours accomplies depuis bien avant même la création des univers, toutes les dimensions et tout ce qui s’y trouve y compris les intra- / extra-terrestres, les entités biologicoïdes (fantômes et esprits errants, sirènes, elfs, gnomes, lutins...), et les entit é s é th é riques non-biologiques ((extra-dimensionnels extra-dimensionnels extra-dimensionnels)) qui lui doivent tous aussi Respect et Vénérations, et qui s’il le veut, peut faire les pierres l’adorer en criant très fortement (Luc 19:40 Et Jésus répondant, leur dit; Je vous dis que si ceuxci se taisent, les pierres m ê mes crieront = chant des dûnes). DIASOLUKA Nz. Luyalu Docteur en Médecine, Chirurgie & Accouchements (1977), CNOM : 0866 - Spécialiste en ophtalmologie (1980) Informaticien-amateur, Programmeur et WebMaster. J.D.B. DIASOLUKA Nz. Luyalu JavaScript Tome-II INTRODUCTION : Javascript (JS, à ne pas confondre avec JAVA d’Oracle) initialem ent LiveScript, livré pour la 1ère fois avec Netscape 2 début 1996 est un langage de script léger (scripting language = lightw eight program m ing language) Orienté Objet (OOP) créé en 1995 par l’ingénieur Brendan Eich de Netscape (co-fondateur du projet M ozilla, de la fondation M ozilla et de la corporation M ozilla) et standardisé par l'organism e ECM A (European Com puter M anufacturers Association) en 1996 et 1997 basé sur ECM AScript (ES), et est régi par le TC39 (le Com ité technique 39 qui fait évoluer JavaScript). Initialem ent destiné à dynam iser les pages W eb c’est-à-dire les rendre interactives (dynam iques, conversationnelles, responsives, réactives à tem ps réel). JavaScript est un interpréteur (com pile à la volée), il exécute directem ent sans passer par la com pilation qui génère un code objet interm édiaire (pour les anciens program m es de form at .com ) ou directem ent exécutable (program m es .exe). Quelques dialectes de ECM AScript à ne pas confondre : JavaScript (enrichissem ent d'ECM AScript), JScript (variante de M icrosoftlancé avec Internet Explorer 3), Ecm aScript (version standardisée de JS, la prem ière en 1997), ActionScript (variante d'Adobe). JS est aujourd’hui l’outil par excellence pour m anipuler/gérer tous les aspects d’une page W eb (élém ents : balises, nodes de l’arbre hiérarchique [arborescence] HTM L : DOM = Docum ent Object M odel = un API ( Application Program m ing Interfaces ) perm ettant d’accéder à tous les noeuds [élém ent, chaîne, com m entaire] d’une page W EB), le style, les events (événem ents), lire et écrire les élém ents HTM L, valider les entrées, éditer le texte de la page W eb (ajouter, supprim er, m odifier/transform er), détecter le brow ser, créer les cookies, gérer les likes... JS n’est certes pas le seul langage pour ce faire, il y a aussi par exem ple le PHP, etc et le CSS avec ses «m edia queries», m ais JS a été parm i les preVariables & Functions - 2 / 34 - dimanche, 14. octobre 2018 (3:40 pm) J.D.B. DIASOLUKA Nz. Luyalu JavaScript Tome-II m iers, le plus populaire et le plus facile à m aîtriser perm ettant m êm e de m anipuler dynam iquem ent les feuilles de style CSS, il est aussi le plus facile à im plém enter et à utiliser car contrairem ent au PHP par exem ple, JS ne tient pas com pte de la plate-form e (serveur ou client=utilisateur final souvent un internaute). De plus, un program m e PHP DOIT préalablem ent être converti (par le brow ser) côté client en code JS avant de s’exécuter. JS s’exécute dans un navigateur, m ais peut aussi s’utiliser dans d’autres environnem ents (Serveur W eb : scripts ASP ; Plates-form es : projet Node.js ; bases de données : M ongoDB, Apache CouchDB (AdobeAcrobat) ; des consoles interactives d'exécution com m e le Rhino...). JS a débordé de ses prem iers objectifs, il est m êm e utilisé com m e tout langage évolué (C/C++...) dans l’élaboration de logiciels com plets et volum ineux entièrem ent écrits en JS, dont des traitem ents de textes, des logiciels de gestion... Entrons dans le but de notre sujet, le JavaScript norm e ES8 (ECM AScript 2018). Variables & Functions - 3 / 34 - dimanche, 14. octobre 2018 (3:40 pm) J.D.B. DIASOLUKA Nz. Luyalu JavaScript Tome-II CHAPITRE 1 : Les COMMENTAIRES dans JavaScript Si dans HTML les commentaires (textes inertes) se présentent sous une seule forme comme suit : <!-- Bloc de commenatires --> JS quant à lui accepte quatre formes de commentaires : 1. Commentaire multiligne : /* lignes de commentaires */ 2. Commentaires en ligne : : 2.a. Le double « slash » // Commente jusqu’en fin de ligne. 2.b. <!-- Commentaire en ligne 2.c. -> commentaire en ligne Attention : Ne confondez pas l’opérateur JavaScript de commentaire en ligne « -> », l’opérateur de fonction fléchée « => » et l’opérateur de countdown « jusqu’à » « --> » : <script type="text/javascript"> "use strict"; function countdown(n) { while (n --> 6) // "Tant que n-- > 6" console.log(n+" --> "+Math.log(n)); } countdown(11) </script> 10 --> 2.302585092994046 9 --> 2.1972245773362196 8 --> 2.0794415416798357 7 --> 1.9459101490553132 6 --> 1.791759469228055 Variables & Functions - 4 / 34 - test.html:4:7 test.html:4:7 test.html:4:7 test.html:4:7 test.html:4:7 dimanche, 14. octobre 2018 (3:40 pm) J.D.B. DIASOLUKA Nz. Luyalu JavaScript Tome-II En fait « --> » n’est pas un opérateur comme tel, mais simplement le complexe [ opérateur de décrémentation « -- » espacé de son opérande (de gauche) et suivi directement du signe supérieur à « > » ] donnant « -- > » : Son similaire (aussi un peu truqué) : <script type="text/javascript"> "use strict"; function countdown(n) { while (n ++< 10) // Incrément APRÈS. console.log(n+" ++< "+Math.log(n)); } countdown(5) </script> 6 ++< 1.791759469228055 7 ++< 1.9459101490553132 8 ++< 2.0794415416798357 9 ++< 2.1972245773362196 10 ++< 2.302585092994046 test.html:4:7 test.html:4:7 test.html:4:7 test.html:4:7 test.html:4:7 CHAPITRE 2 : Les VARIABLES dans JavaScript Comme tout langage de Programmation, JS utilise des variables (identifiants de cellules-mémoire) locales ou globales, des fonctions, et des objets (comportant des propriétés et méthodes= fonctions propres (intrinsèques, internes, intégrées / incorporées). Les variables servent à associer un nom (identifiant) à un contenu d’une cellule-mémoire de l’ordinateur ; ça peut être une donnée (un nombre, un littéral, un objet) ou un code exécutable (function). Mots-réservés à éviter comme identifiant : abstract, arguments, boolean, break, byte, case, catch, char, class, const, continue, debugger, default, delete, do, double, else, enum, eval, export, extends, false, final, finally, float, for, function, goto, if, implements, import, in, instanceof, int, interface, let, long, NaN, native, new, null, package, private, protected, public, return, short, static, super, switch, synchronized, this, throw, throws, transient, true, try, typeof, var, void, volatile, while, with, yield. Le code et les données dans JS doivent impérativement être contenus dans l’élément SCRIPT imbriqué dans l’élément HEAD ou BODY tous deux dans l’élément HTML. Pour ne pas ralentir le chargement de la page, placez les scripts juste avant la balise de fermeture </body>. Variables & Functions - 5 / 34 - dimanche, 14. octobre 2018 (3:40 pm) J.D.B. DIASOLUKA Nz. Luyalu JavaScript Tome-II Syntaxe globale de l’élément SCRIPT pour du code local : <html> <head> <script type="text/javascript" language="JavaScript"> ... </script> </head> <body> <script language="JavaScript" type="text/javascript"> ... </script> </body> <script language="JavaScript" type="text/javascript"> ... </script> </html> Syntaxe de SCRIPT pour du code [dans un fichier] externe : <script language="JavaScript" type="text/javascript" src=URL> </script> <script language="JavaScript" type="text/javascript" src="myOwnSubdirectory/myOwn2ndJavaScript.js"> </script> URL est l’emplacement du fichier de script qui peut être local à votre poste de travail ou dans un réseau (LAN ou WEB) selon la syntaxe : src="http://www.server.com/scriptfile.js" ou src="directory/scriptfile.js"> Déclaration / définition de variable : Une variable peut être déclarée ou non, initialisée (valeur par défaut) ou pas (« undefined »). Variables & Functions - 6 / 34 - dimanche, 14. octobre 2018 (3:40 pm) J.D.B. DIASOLUKA Nz. Luyalu Déclaration explicite de variable non initialisée : JavaScript Tome-II var v; <script> const v ; alert(v) ; </script> Voici ce que JS affiche à son exécution (alert() est une méthode (fonction) de l’objet window, elle affiche un pop-up [=fenêtre surgissante] à l’écran) : undefined Initialisation de variable non explicitement déclarée (définition et déclaration implicite de variable, valable seulement en mode normal = sloppy moce). Ici, on initialise la variable à la date en cours. <script> v=new Date() ; alert(v) </script> Tue Dec 19 2017 18:20:49 GMT+0100 (Paris, Madrid) Variables clés-valeurs (intuitif) ; <script type="text/javascript"> "use strict"; // Les clés-vals dans l'objet o. var o = {20:5, k:4, 30:7, no:0, 10:9}; for(var [cle,val] of Object.entries(o)) console.log("*"+cle+' ^ '+val); Object.entries(o).forEach(([cle,val]) => console.log(cle+' : '+val)); </script> *10 ^ 9 *20 ^ 5 *30 ^ 7 *k ^ 4 *no ^ 0 / / / / / 10 : 9 20 : 5 30 : 7 k : 4 no : 0 Variables & Functions test.html:6:8 test.html:6:8 test.html:6:8 test.html:6:8 test.html:6:8 - 7 / 34 - / / / / / 9:8 9:8 9:8 9:8 9:8 dimanche, 14. octobre 2018 (3:40 pm) J.D.B. DIASOLUKA Nz. Luyalu JavaScript Tome-II Le mode (variante) strict de JavaScript : JavaScript standard est un langage hypercompliant (très peu rigoureux, plutôt très tolérant). Pour le rendre plus rigoureux / exigeant, utilisez le pragma / directive « use strict »; » comme toute première directive/instruction (donc au tout début) du boc du corps de la fonction après les « (){ » ou juste après la balise <script>. Les détails sur « use strict; » sur : https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Strict_mode. La portée du pragma / directive « use strict»; » est seulement dans la portée lexicale « lexical scope ». Donc, deux modes de fonctionnement du JavaStript : Le JavaScript standard (mode non strict = « sloppy mode ») et le JavaScript strict. Le mode strict s'applique seulement à des scripts entiers ou à des fonctions individuelles, mais pas à des blocs d'instructions (entourés d'accolades = curly brackets {}). Les fonctions imbriquées d’une fonction en mode strict sont elles aussi de mode strict. Le mode strict est activé avec le pragma "use use strict"; Cette directive doit figurer juste après la balise d’ouverture <script> ou l’accolade ouvrante du corps d’une fonction, c’est-à-dire avant toute autre instruction à part les commentaires. Trois caractéristiques du mode strict : 1. Convertit les erreurs silencieuses de JavaScript en erreurs bruyantes, levant une exception. 2. Corrige les erreurs qui rendent difficiles es optimisations., le code s’exécute ainsi plus rapidement. 3. Interdit les mot-clés susceptibles d'être définis dans les futures versions de ECMAScript (implements, interface, let, package, private, protected, public, static, yield). En JS standard, une variable n’a pas besoin d’être préalablement déclarée avant sa première utilisation. et elle peut être déclarée/définie et même redéclarée / redéfinie même après des ou toutes les instructions et n’a pas de typage fixe (une variable peut recevoir une donnée d’un autre type que Variables & Functions - 8 / 34 - dimanche, 14. octobre 2018 (3:40 pm) J.D.B. DIASOLUKA Nz. Luyalu JavaScript Tome-II celui de sa définition, le type de la variable est défini seulement au moment de l’affectation = typage faible et dynamique, pratique pour les variables temporaires). Toute variable temporaire strictement locale à une fonction doit être déclarée var. En mode strict TOUTE variable DOIT être déclarée avant ou après sa première utilisation, les variable globales doivent l’être déclarées explicitement. On ne peut pas non plus : 1. Modifier les variables globales en lecture seule (read-only) comme le NaN, undefined, Infinity, ou une propriété en lecture seule... 2. Affecter à une propriété qui n’a qu’une méthode get 3. Affecter une nouvelle propriété à un objet non extensible comme un object littéral. 4. Supprimer une propriété non-supprimable comme le prototype. 5. Redéfinir les propriétés nommées dans un object literal. 6. Utiliser deux fois un même nom de paramètre. 7. Le mode octal ne s’écrit plus 0nb (zéro nb) mais 0onb (zéro o_minuscule_ou_majuscule nb) 8. Définir des propriétés sur des « valeurs primitives » (voir plus loin) : Undefined, Null, Boolean, Number, String, et Symbol : Le type « number » possède exactement 18’437’736’874’454’810’627 (264 253 + 3) valeurs double-précision 64-bit format IEEE 754-2008. Les erreurs suivantes sont tolérées en JS standard, en donnant un faux résultat. Elles ne sont pas tolérées en mode strict. <script type="text/javascript"> false.true = true; (2018).propriete = "prop"; "une chaîne".de = "chaine"; console.log(false.true) console.log((2018).propriete) console.log("une chaîne".de) </script> //Undefined //Undefined //Undefined 9. Utiliser arguments comme nom ID de variable <script type="text/javascript"> var arguments = Math.PI; console.log(arguments); // 3.141592653589793 </script> Variables & Functions - 9 / 34 - dimanche, 14. octobre 2018 (3:40 pm) J.D.B. DIASOLUKA Nz. Luyalu JavaScript Tome-II 10. Interdiction du mot-clé with : <script type="text/javascript"> let x = {a:2018 , m:"Janvier"} with(x) console.log(a) , console.log(m); // 2018 Janvier </script> En mode « "use strict"; » <script type="text/javascript"> "use strict"; let x = {a:2018 , m:"Janvier"} with(x) console.log(a) , console.log(m); // SyntaxError: strict mode code may not contain </script> Scope (contexte d’exécution), Domaine, Portée, Étendue, Visibilité, Accessibilité et durée de vie avec le mot-clé « var » : <script type="text/javascript"> v=25; function fct(){ // Déclaration/définition de fonction v='...série d\'instructions...'; console.log("v="+v); // v=...série d'instructions var v=100; // déclarée locale, APRÈS avoir été utilisée. } fct(); // Appel à la fonction console.log("v="+v); /* v=25 */ // v=...série d'instructions... // v=25 </script> test.html:7:4 test.html:14:2 La déclaration var : Le mot-clé var sert à deux choses : 1. Déclarer une variable locale « visible / accessible seulement dans le scope (portée ou étendue, corps de la fonction) de sa déclaration » qui Variables & Functions - 10 / 34 - dimanche, 14. octobre 2018 (3:40 pm) J.D.B. DIASOLUKA Nz. Luyalu JavaScript Tome-II est le domaine du bloc de la fonction dans laquelle la variable est déclarée, même pas par à une éventuelle fonction englobante. Dès que la fonction est quittée, l’espace lui affecté (qu’elle pointe) est désalloué (libéré) avec tout son contenu (code et données [variables locales]) : Durée de vie = période d’exécution de la fonction. Sans le mot-clé var, la variable est visible de partout (portée/visibilité globale) dans le fichier en cours et dans d’autres fichiers. 2. Déclarer (créer un espace-mémoire de stockage pour) une variable non initialisée. Déclarée comme var en dehors de toute fonction (mais dans un élément SCRIPT), la variable est du scope WINDOW = globale (à ne pas confondre avec WINDOWS). <script> function f() { var v=new Date() ; } alert(v) // Uncaught ReferenceError: v is not defined </script> Exécution : Ici, la fonction f() n’est pas invoquée et donc jamais exécutée. La variable v n’est donc ni effectivement déclarée, ni définie ni initialisée. Elle est donc invisible aussi bien dans le bloc de la fonction qu’en dehors de la fonction. « var.html » est le nom de notre fichier HTML avec JS Même après appel/exécution de la fonction f() dans laquelle la variable déclarée var (locale) a été définie, elle est toujours invisible en dehors [du bloc] de cette fonction. <script> function f() { var v=new Date() ; } f(); alert(v); </script> // Uncaught ReferenceError: v is not defined Variables & Functions - 11 / 34 - dimanche, 14. octobre 2018 (3:40 pm) J.D.B. DIASOLUKA Nz. Luyalu JavaScript Tome-II Sans le mot-clé var, la variable v est visible et accessible de partout même dans une autre fonction (portée globale) : <script> function f() { v=new Date("11,Aug,1953") ; } f(); // Appelée APRÈS définition. fv(); // Appelée AVANT définition. function fv(){ alert(v); } </script> Tue Aug 11 1953 00:00:00 GMT+0100 (Paris, Madrid) Lors du chargement d’un fichier, les objets sont parsés (analysés), particulièrement les scopes des portées des variables. C’est à la fin du chargement de tout le fichier (event = onload) que débute l’exécution des fonctions non inline. Dans JS les déclarations de variable pouvant se faire n’importe où, une redéclaration dans le même scope d’une variable globale en variable locale avec var rend sa visibilité locale. Variables & Functions - 12 / 34 - dimanche, 14. octobre 2018 (3:40 pm) J.D.B. DIASOLUKA Nz. Luyalu JavaScript Tome-II <script type="text/javascript"> j=11, m = -25, a=1953; function fext(){ j=3957; // m=8; // var a=2017; // var j; // Jusqu'ici j est globale, = 11. m globale écrase -25 -> 8 Déf variable a=2017 locale. Force j en locale malgré déjà utilisée. function fint(){ var m=new Date(); // m locale à fint() = Date. console.log("* Dans fint()") console.log("m="+m+" j="+j+" a="+a) } // Fin function fext(){ fint() ; console.log("* Dans fext(), "+ "m="+m+" j="+j+" a="+a) // Ds fext() et partout, m=8 } // Fin function fext(){ fext(); // j et a = globales, m = modifiée ds fext(), console.log("* Dans espace gobale: "+ " j="+j+" m="+m+" a="+a) // 11 8 1953 </script> // * Dans fint() // m=Fri Oct 12 2018 08:56:25 GMT+0100 a=2017 test.html:13:7 // * Dans fext(), m=8 j=3957 a=2017 // * Dans espace gobale: j=11 m=8 a=1953 test.html:12:4 (Paris, Madrid) j=3957 test.html:18:4 test.html:27:2 Les blocs ordinaires n’ont pas de portée limitée. À la sortie d’une boucle, les variables locales (var) du bloc de la boucle persistent : <script type="text/javascript"> j=11, m = -25, a=1953; for(k=0;k<5;k++){ var m=new Date(); // m locale à fimbriquee(). } console.log("k="+k+" , m = "+m.toLocaleString()); // k=5 , m = 23/12/2017 à 02:12:19 </script> Autre exemple : Variables & Functions - 13 / 34 - dimanche, 14. octobre 2018 (3:40 pm) J.D.B. DIASOLUKA Nz. Luyalu JavaScript Tome-II <script> for (k = 0; k <= 5; k++){ var f = function() { return function(x){return k + x;}; } if (k == 0) {fct1 = f(); }; if (k == 5) {fct2 = f(); }; } console.log(fct1(3)); console.log(fct2(6)); </script> // 9 // 12 Note : Une propriété d’un objet ou membre/élément d’Array ne peuvent se déclarer avec var. Signalons que les indexes dans une Array sont juste des propriétés énumerables avec comme noms, des entiers, et sont semblables aux propriétés d'un objet en général. Signalons aussi que chaque propriété d’un objet possède 4 attributs : https://www.ecma-international.org/ecma-262/8.0/ 6.1.7.1 Property Attributes Attributes are used in this specification to define and explain the state of Object properties. A data property associates a key value with the attributes listed in Table 2. Table 2: Attributes of a Data Property Attribute Name Value Domain Description [[Value]] Any ECMAScript The value retrieved by a get access of the language type property. [[Writable]] Boolean If false, attempts by ECMAScript code to change the property's [[Value]] attribute using [[Set]] will not succeed. [[Enumerable]] Boolean If true, the property will be enumerated by a for-in enumeration (see 13.7.5). Otherwise, the property is said to be non-enumerable. [[Configurable]] Boolean If false, attempts to delete the property, change the property to be an accessor property, or change its attributes (other than [[Value]], or changing [[Writable]] to false) will fail. Variables & Functions - 14 / 34 - dimanche, 14. octobre 2018 (3:40 pm) J.D.B. DIASOLUKA Nz. Luyalu Illustration : JavaScript Tome-II <script> let ob={3:"Cataracte" , glc:"Glaucome" , "arr":["Cataracte" , "Glaucome"]} console.log(Object.getOwnPropertyDescriptors(ob)) /* Affiche Object { 3: {…}, glc: {…}, arr: {…} } 3:{value: "Cataracte", writable: true, enumerable: true, configurable: true} arr:{value: Array(2), writable: true, enumerable: true, configurable: true} glc:{value: "Glaucome", writable: true, enumerable: true, configurable: true} __proto__:Object */ /* let ob={3:"Cataracte" , glc:"Glaucome" , "arr":["Cataracte" , "Glaucome"]} */ console.log(Object.getOwnPropertyDescriptors(ob[3])) /* Object { 0: {…}, 1: {…}, 2: {…}, 3: {…}, 4: {…}, 5: {…}, 6: {…}, 7: {…}, 8: {…}, length: {…} } 0:{value: "C", writable: false, enumerable: true, configurable: false} 1:{value: "a", writable: false, enumerable: true, configurable: false} 2:{value: "t", writable: false, enumerable: true, configurable: false} 3:{value: "a", writable: false, enumerable: true, configurable: false} 4:{value: "r", writable: false, enumerable: true, configurable: false} 5:{value: "a", writable: false, enumerable: true, configurable: false} 6:{value: "c", writable: false, enumerable: true, configuVariables & Functions - 15 / 34 - dimanche, 14. octobre 2018 (3:40 pm) J.D.B. DIASOLUKA Nz. Luyalu rable: false} JavaScript Tome-II 7:{value: "t", writable: false, enumerable: true, configurable: false} 8:{value: "e", writable: false, enumerable: true, configurable: false} length:{value: 9, writable: false, enumerable: false, configurable: false} __proto__:Object */ /* let ob={3:"Cataracte" , glc:"Glaucome" , "arr":["Cataracte" , "Glaucome"]} */ console.log(Object.getOwnPropertyDescriptors(ob["3"])) /* Object { 0: {…}, 1: {…}, 2: {…}, 3: {…}, 4: {…}, 5: {…}, 6: {…}, 7: {…}, 8: {…}, length: {…} } 0:{value: "C", writable: false, enumerable: true, configurable: false} 1:{value: "a", writable: false, enumerable: true, configurable: false} 2:{value: "t", writable: false, enumerable: true, configurable: false} 3:{value: "a", writable: false, enumerable: true, configurable: false} 4:{value: "r", writable: false, enumerable: true, configurable: false} 5:{value: "a", writable: false, enumerable: true, configurable: false} 6:{value: "c", writable: false, enumerable: true, configurable: false} 7:{value: "t", writable: false, enumerable: true, configurable: false} 8:{value: "e", writable: false, enumerable: true, configurable: false} length:{value: 9, writable: false, enumerable: false, conVariables & Functions - 16 / 34 - dimanche, 14. octobre 2018 (3:40 pm) J.D.B. DIASOLUKA Nz. Luyalu figurable: false} JavaScript Tome-II __proto__:Object */ /* let ob={3:"Cataracte" , glc:"Glaucome" , "arr":["Cataracte" , "Glaucome"]} */ console.log(Object.getOwnPropertyDescriptors(ob.glc)) /* Object { 0: {…}, 1: {…}, 2: {…}, 3: {…}, 4: {…}, 5: {…}, 6: {…}, 7: {…}, length: {…} } 0:{value: "G", writable: false, enumerable: true, configurable: false} 1:{value: "l", writable: false, enumerable: true, configurable: false} 2:{value: "a", writable: false, enumerable: true, configurable: false} 3:{value: "u", writable: false, enumerable: true, configurable: false} 4:{value: "c", writable: false, enumerable: true, configurable: false} 5:{value: "o", writable: false, enumerable: true, configurable: false} 6:{value: "m", writable: false, enumerable: true, configurable: false} 7:{value: "e", writable: false, enumerable: true, configurable: false} length:{value: 8, writable: false, enumerable: false, configurable: false} __proto__:Object */ /* let ob={3:"Cataracte" , glc:"Glaucome" , "arr":["Cataracte" , "Glaucome"]} */ console.log(Object.getOwnPropertyDescriptors(ob["glc"])) /* Object { 0: {…}, 1: {…}, 2: {…}, 3: {…}, 4: {…}, 5: {…}, Variables & Functions - 17 / 34 - dimanche, 14. octobre 2018 (3:40 pm) J.D.B. DIASOLUKA Nz. Luyalu 6: {…}, 7: {…}, length: {…} } JavaScript Tome-II 0:{value: "G", writable: false, enumerable: true, configurable: false} 1:{value: "l", writable: false, enumerable: true, configurable: false} 2:{value: "a", writable: false, enumerable: true, configurable: false} 3:{value: "u", writable: false, enumerable: true, configurable: false} 4:{value: "c", writable: false, enumerable: true, configurable: false} 5:{value: "o", writable: false, enumerable: true, configurable: false} 6:{value: "m", writable: false, enumerable: true, configurable: false} 7:{value: "e", writable: false, enumerable: true, configurable: false} length:{value: 8, writable: false, enumerable: false, configurable: false} __proto__:Object */ /* let ob={3:"Cataracte" , glc:"Glaucome" , "arr":["Cataracte" , "Glaucome"]} */ console.log(Object.getOwnPropertyDescriptors(ob["arr"])) /* Object { 0: {…}, 1: {…}, length: {…} } 0:{value: "Cataracte", writable: true, enumerable: true, configurable: true} 1:{value: "Glaucome", writable: true, enumerable: true, configurable: true} length:{value: 2, writable: true, enumerable: false, configurable: false} __proto__:Object */ Variables & Functions - 18 / 34 - dimanche, 14. octobre 2018 (3:40 pm) J.D.B. DIASOLUKA Nz. Luyalu /* JavaScript Tome-II let ob={3:"Cataracte" , glc:"Glaucome" , "arr":["Cataracte" , "Glaucome"]} */ console.log(Object.getOwnPropertyDescriptors(ob["arr"][0])) /* Object { 0: {…}, 1: {…}, 2: {…}, 3: {…}, 4: {…}, 5: {…}, 6: {…}, 7: {…}, 8: {…}, length: {…} } 0:{value: "C", writable: false, enumerable: true, configurable: false} 1:{value: "a", writable: false, enumerable: true, configurable: false} 2:{value: "t", writable: false, enumerable: true, configurable: false} 3:{value: "a", writable: false, enumerable: true, configurable: false} 4:{value: "r", writable: false, enumerable: true, configurable: false} 5:{value: "a", writable: false, enumerable: true, configurable: false} 6:{value: "c", writable: false, enumerable: true, configurable: false} 7:{value: "t", writable: false, enumerable: true, configurable: false} 8:{value: "e", writable: false, enumerable: true, configurable: false} length:{value: 9, writable: false, enumerable: false, configurable: false} __proto__:Object */ /* let ob={3:"Cataracte" , glc:"Glaucome" , "arr":["Cataracte" , "Glaucome"]} */ console.log(Object.getOwnPropertyDescriptors(ob["arr"][1])) /* Variables & Functions - 19 / 34 - dimanche, 14. octobre 2018 (3:40 pm) J.D.B. DIASOLUKA Nz. Luyalu JavaScript Tome-II Object { 0: {…}, 1: {…}, 2: {…}, 3: {…}, 4: {…}, 5: {…}, 6: {…}, 7: {…}, length: {…} } 0:{value: "G", writable: false, enumerable: true, configurable: false} 1:{value: "l", writable: false, enumerable: true, configurable: false} 2:{value: "a", writable: false, enumerable: true, configurable: false} 3:{value: "u", writable: false, enumerable: true, configurable: false} 4:{value: "c", writable: false, enumerable: true, configurable: false} 5:{value: "o", writable: false, enumerable: true, configurable: false} 6:{value: "m", writable: false, enumerable: true, configurable: false} 7:{value: "e", writable: false, enumerable: true, configurable: false} length:{value: 8, writable: false, enumerable: false, configurable: false} __proto__:Object */ </script> An accessor property associates a key value with the attributes listed in Table 3. Table 3: Attributes of an Accessor Property Attribute Name [[Get]] Value Domain Description Object | Undefined If the value is an Object it must be a function object. The function's [[Call]] internal method (Table 6) is called with an empty arguments list to retrieve the property value each time a get access of the property is performed. Variables & Functions - 20 / 34 - dimanche, 14. octobre 2018 (3:40 pm) J.D.B. DIASOLUKA Nz. Luyalu [[Set]] JavaScript Tome-II Object | Undefined If the value is an Object it must be a function object. The function's [[Call]] internal method (Table 6) is called with an arguments list containing the assigned value as its sole argument each time a set access of the property is performed. The effect of a property's [[Set]] internal method may, but is not required to, have an effect on the value returned by subsequent calls to the property's [[Get]] internal method. [[Enumerable]] Boolean If true, the property is to be enumerated by a for-in enumeration (see 13.7.5). Otherwise, the property is said to be nonenumerable. [[Configurable]] Boolean If false, attempts to delete the property, change the property to be a data property, or change its attributes will fail. If the initial values of a property's attributes are not explicitly specified by this specification, the default value defined in Table 4 is used. Table 4: Default Attribute Values Attri[[Value]] [[Get]] [[Set]] [[Writable]] [[Enumerable]] [[Configurable]] Default Value undefined undefined undefined false false false Plusieurs façons d’appeler une fonction : <script type="text/javascript"> "use strict"; // Direct fct("","deuxième"); // Ds fct = fct(,deuxième) // Via alias var funcname=fct funcname(); // Ds fct = fct(undefined,undefined) Variables & Functions - 21 / 34 - dimanche, 14. octobre 2018 (3:40 pm) J.D.B. DIASOLUKA Nz. Luyalu JavaScript Tome-II // Via NOM de la fonction dans une chaîne window["fct"]("premier","deuxième"); // Ds fct = fct(premier,deuxième) // Fonction comme paramètre objet function go1(p,a1,a2){ p(a1,a2); } go1(fct,"année",2018) // Ds fct = fct(année,2018) // Fonction comme paramètre chaîne function go2(p,a1,a2){ window[p](a1,a2); } go2("fct",Math.PI,Math.E) // Ds fct = fct(3.141592653589793,2.718281828459045) // Avec eval() function go3(p){ eval(p); } go3("fct(Math.E,Math.PI)") // Ds fct = fct(2.718281828459045,3.141592653589793) ////////////////////////// // La fonction à appeler ////////////////////////// function fct(){ console.log( "Ds fct = " + fct.name + "("+arguments[0]+","+arguments[1]+")" ); } </script> Variables locales « static » en JavaScript ; Une « variable locale static » est une variable définie dans une fonction mais qui garde sa valeur même quand la fonction est quittée. JS ne comporte pas une telle sorte de donnée. Comment y suppléer ? En quittant une fonction comportant une fonction imbriquée et retournée par la la fonction contenante / englobante, tout l’environnement et les variables locales de la première fonction [contenante] persistent et peuvent servir de (être utilisés comme) variables static exactement comme celles Variables & Functions - 22 / 34 - dimanche, 14. octobre 2018 (3:40 pm) J.D.B. DIASOLUKA Nz. Luyalu JavaScript Tome-II des langages C/C++., et dans une fonction récursive. Cet environnement et ses variables persistent (durée de vie) , comme les variables globales, jusqu’à la décharge (fermeture) du document. <script type="text/javascript"> "use strict"; function f(){ var b = "b"; return function f2(){ // f() retourne adresse de f2. return b; // retourne la valeur de la variable b. } } var n = f(); alert(n()); </script> La fonction f() retourne un pointeur sur la fonction f2() qui elle, retourne la valeur en cours de la variable b, qui est "b". Du fait que la fonction f() est une fonction retournante, son environnement n'est pas détruit à sa sortie, et toutes ses variables y compris les LOCALES (déclarées var) sont préservées. var n = f(); La variable « n » reçoit la valeur retournée par f() qui est un pointeur sur la fonction interne retournée f2(). La fonction f2() est ce qu’on appelle « closure ». Puisque n contient l'adresse d'une fonction =en l'occurrence la fonction f2()=, on peut appeler cette dernière avec « n, suivie de parenthèses n() », ce qui affiche la valeur en cours de la variable b qui est dans l'environnement de f() qui n'a pas été altéré depuis la sortie de cette fonction f(). En appelant f(), par exemple alert(f()) alert(f()); on affiche le contenu à l'adresse retournée par f() =celle de la fonction f2()=, et le contenu à l'adresse d'une fonction cfr la f2(), c'est le code de cette fonction. L’identifiant f2 ne sert absolument à rien, sauf à faciliter les explications ici. La variable b peut être modifiée, mais bien entendu, seulement par les fonctions qui ont accès à elle, et durant la période de leur exécution. Altération d’une Variable locale statique : <script> "use strict"; function f() { Variables & Functions - 23 / 34 - dimanche, 14. octobre 2018 (3:40 pm) J.D.B. DIASOLUKA Nz. Luyalu JavaScript Tome-II var x=0 ; // pseudo static const f2 = function(y){ x += y ; return [y,x]; } return f2; } let fct=f(); for(let k=2;k<5;k++){ var r=fct(k * (Math.random()*10|0)); console.log("y==(k*Math)=="+r[0]+" | x=="+r[1]+ " | x+=y=="+(1*r[1]+r[0])); } </script> y==(k*Math)==10 | x==10 | x+=y==20 y==(k*Math)==30 | x==40 | x+=y==70 y==(k*Math)==20 | x==60 | x+=y==80 static.html:11:5 static.html:11:5 static.html:11:5 Note: Si vous écrivez « * x+=y=="+(r[1]+r[0])) » au lieu de « * x+=y=="+(1*r[1]+r[0])) » vous aurez une concaténation (addition de Strings ou littérale) au lieu d’une addition arithmétique. CHAPITRE 3 : SYNTAXE DES INSTRUCTIONS dans JavaScript En JS, une variable peut ou ne pas être déclarée (avec let, const ou var) avant sa première utilisation, sauf en mode strict ("use strict;" dans une chaîne exactement comme ici) où la déclaration est exigée, mais pas nécessairement avant la première utilisation, mais n’importe où dans la portée, même en mode strict. Es8 autorise une virgule à la fin de la liste de paramètres « function fct(var1 , var2 , var3 , ) », arguments « fct (9, "", {} , ){} » , littéraux de tableau « [10 , «txt» , {} , ] » et littéraux d’objet « {x: 1 , } ». I. Une variable [peut prendre ou changer de valeur n’importe quand et n’importe où dans sa portée. 1. La portée d’une variable déclarée avec le token « var » est tout le fichier si déclarée dans l’espace global, ou toute la fonction (et seulement cette fonction) si déclarée dans le bloc de la fonction. 2. La portée d’une variable déclarée avec le token « let » est seulement le BLOC le plus profond dans lequel elle a été dé- Variables & Functions - 24 / 34 - dimanche, 14. octobre 2018 (3:40 pm) J.D.B. DIASOLUKA Nz. Luyalu clarée et les sous-blocs de celui-ci. JavaScript Tome-II II. Une constante [déclarée avec le token « const »] DOIT être déclarée avant sa première utilisation et ne peut changer de valeur une fois déclarée, et donc elle doit obligatoirement être initialisée au moment de sa déclaration. 1. La portée d’une constante est (comme celle d’une variable let) seulement le BLOC le plus profond dans lequel elle a été déclarée et les sous-blocs de celui-ci. Dans le JavaScript standard une variable peut, outre changer de valeur, être redéclarée autant de fois qu’on le veut. En mode strict aucune variable ou constante ne peut être redéclarée. En mode non strict : <script type="text/javascript"> date = new Date(); console.log(date.toLocaleDateString()) // 27/01/2018 console.log(date.toLocaleString()) // 27/01/2018 à 01:40:32 console.log(date.toUTCString()) // Sat, 27 Jan 2018 00:40:32 GMT console.log(date.toGMTString()) // Sat, 27 Jan 2018 00:40:32 GMT </script> En mode strict : <script type="text/javascript"> "use strict"; date = new Date(); date = function(){}; date = _ => {}; date = (function(){return Math.PI})(); date = !function(){return Math.E}; console.log(date); /* var date; */ </script> ReferenceError: assignment to undeclared variable date test.html:3:10 [FIREFOX] Uncaught ReferenceError: date is not defined at test.html:3 [YANDEX] Variables & Functions - 25 / 34 - dimanche, 14. octobre 2018 (3:40 pm) J.D.B. DIASOLUKA Nz. Luyalu Utilisation de variable AVANT sa déclaration : JavaScript Tome-II <script type="text/javascript"> "use strict"; date = new Date(); date = function(){}; date = _ => {}; date = (function(){return Math.PI})(); date = !function(){return Math.E}; console.log(date); // false test.html:7:5 var date; </script> 1. Dans JS l’indentation (comme souvent le retour à la ligne et certains espaces blancs) n’est pas obligatoire, mais utile pour la révision (lisibilité) du code. 2. Deux instructions sur une même ligne DOIVENT être séparées par un point-virgule (semicolons), mais les instructions en fin de ligne ne sont pas tenues de se terminer par le point-virgule (à cause de l’Automatic Semicolon Insertion =ASI) vs au langage C, mais il est préférable de les placer pour vous signaler la fin d’une instruction, un point-virgule superflu ne dérange pas (instruction vide). 3. La virgule sert à chaîner des instructions (comme si faisant partie d’un même bloc). Notez les virgules en fin de lignes dans le code ci-dessous. Les blocs sont préférables quand c’est possible. <script type="text/javascript"> "use strict"; var v; for(var k=0, n=parseInt("10.25 illustr parseInt") ; k<=n ; ) v=Math.pow(k,k) , console.log("k="+k+". k^k = "+v+"; ") , k++ ; </script> /*0=1; 1=1; 2=4; 3=27; 4=256; 5=3125; 6=46656; 7=823543; 8=16777216; 9=387420489; 10=10000000000;*/ Note : Notez l’absence d’accolades pour la boucle « for », juste pour illustrer le chaînage d’instructions avec l’opérateur virgule. Mais pour faciliter la lecture et en prévision d’ajout d’autres instructions dans votre code, toutes les instructions des boucles (for, for...in, for each, while, do...while) et les fonctions fléchées devraient être contenues dans une paire d’accolades (curly braces) même quand c’est une instruction unique, ça facilite le débogage et l’ajout ultérieur de nouvelles instructions. Boucle « while » : Variables & Functions - 26 / 34 - dimanche, 14. octobre 2018 (3:40 pm) J.D.B. DIASOLUKA Nz. Luyalu JavaScript Tome-II <script type="text/javascript"> "use strict"; function suppress(arr, val) { var i; while ((i = arr.indexOf(val)) != -1) { arr.splice(i, 1); } return arr; } console.log(suppress([ "Louis", "Morena", "Keriyza", "Louis"], "Louis")); </script> // Array [ "Morena", "Keriyza" ] // (2) ["Morena", "Keriyza"] {FIREFOX} {YANDEX} Fonctions padStart() et padEnd() de Rembourrage avant/après : Pour rembourrer une chaîne avec un caractère ou une autre chaîne donnée (par défaut l’espace) pour faire une taille totale déterminée : <script type="text/javascript"> "use strict"; console.log('123'.padStart(16,"0")); // Padding avant // 0000000000000123 console.log('abc'.padEnd(16,"DIAS")); après /* abcDIASDIASDIASD */ </script> // Padding Méthodes entries() et values() permettent de retourner un objet de paires propriété/valeur : <script type="text/javascript"> const data = { name: 'Pet', age: 29, Sname: 'Kiw', High: 172 }; "use strict"; //tableau des paires de propriétés enumerable [key, value] d'un objet console.log(Object.entries(data)); /* (4) [Array(2), Array(2), Array(2), Array(2)] Variables & Functions - 27 / 34 - dimanche, 14. octobre 2018 (3:40 pm) J.D.B. DIASOLUKA Nz. Luyalu JavaScript Tome-II 0: (2) ["name", "Pet"]1: (2) ["age", 29] 2: (2) ["Sname", "Kiw"]3: (2) ["High", 172] length: 4__proto__: Array(0) */ // tableau des propres valeurs de propriété énumérables d'un objet console.log(Object.values(data)); // (4) ["Pet", 29, "Kiw", 172] </script> Plusieurs valeurs de retour d’une même fonction : Une fonction JS ne peut retourner qu’une seule valeur à la fois. Pour en retourner plusieurs, placez-les dans une structure (array ou objet) : <script type="text/javascript"> "use strict"; function retmultiple(){ const c = new Date(); return [ { s:c.getDay() , j:c.getDate(), m:c.getMonth() , a:c.getFullYear() , hr:c.getHours() , mn:c.getMinutes() , sc:c.getSeconds() , ms:c.getMilliseconds() } , [ c.getDay() , c.getDate(), c.getMonth() , c.getFullYear() , c.getHours() , c.getMinutes() , c.getSeconds() , c.getMilliseconds() ] ] } // Renvoi dans une array (tableau), d’un objet et une array. // Retournera dans un littéral d'objet : // jour de la semaine [0..6], jour du mois, // le mois [0..11] et l'année longue. const j=retmultiple() // 8 données renvoyées ds l'objet de l'array de retour. console.log("Auj = [" + j[0].s + "], le " + j[0].j + "/" + ++j[0].m + "/" + j[0].a + " - " + j[0].hr + ":" + j[0].mn + ":" + j[0].sc + ":" + j[0].ms) // 8 données renvoyées dans l'array de l'array de retour. console.log("Auj = [" + j[1][0] + "], le " + j[1][1] + "/" + ++j[1][2] + "/" + j[1][3]+ " - " + j[1][4] + ":" + j[1][5] + ":" + j[1][6] + ":" + j[1][7]) </script> // Auj = [2], le 23/1/2018 - 15:52:18:434 // Auj = [2], le 23/1/2018 - 15:52:18:434 Variables & Functions - 28 / 34 - dimanche, 14. octobre 2018 (3:40 pm) J.D.B. DIASOLUKA Nz. Luyalu JavaScript Tome-II CHAPITRE 4 : Définitions des termes JS selon ECMA : https:/www.ecma-international.org/ecma-262/8.0 On y trouve notamment les définitions officielles ECMA de (et donc les différences entre) « null », « undefined », « NAN », « Infinity »... 4.3 TERMS AND DEFINITIONS : 4.3.1 type : set of data values as defined in clause of this specification 4.3.2 primitive value : member of one of the types Undefined, Null, Boolean, Number, Symbol, or String as defined in clause. A primitive value is a datum that is represented directly at the lowest level of the language implementation. 4.3.3 object : member of the type Object. An object is a collection of properties and has a single prototype object. The prototype may be the null value. 4.3.4 constructor : function object that creates and initializes objects. The value of a constructor's prototype property is a prototype object that is used to implement inheritance and shared properties. 4.3.5 prototype : object that provides shared properties for other objects When a constructor creates an object, that object implicitly references the constructor's prototype property for the purpose of resolving property references. The constructor's prototype property can be referenced by the program expression constructor.prototype, and properties added to an object's prototype are shared, through inheritance, by all objects sharing the prototype. Alternatively, a new object may be created with an explicitly specified prototype by using the Object.create built-in function. 4.3.6 ordinary object : object that has the default behaviour for the essential internal methods that must be supported by all objects 4.3.7 exotic object : object that does not have the default behaviour for one or more of the essential internal methods. Any object that is not an ordinary object is an exotic object. 4.3.8 standard object : object whose semantics are defined by this specification 4.3.9 built-in object : object specified and supplied by an ECMAScript implementation. Standard built-in objects are defined in this specification. An ECMAScript implementation may specify and supply additional kinds of built-in objects. A built-in constructor is a built-in object that is also a constructor. 4.3.10 undefined value : primitive value used when a variable has not been assigned a value 4.3.11 Undefined type : type whose sole value is the undefined value 4.3.12 null value : primitive value that represents the intentional absence of any object value 4.3.13 Null type : type whose sole value is the null value 4.3.14 Boolean value : member of the Boolean type There are only two Boolean values, true and false. Variables & Functions - 29 / 34 - dimanche, 14. octobre 2018 (3:40 pm) J.D.B. DIASOLUKA Nz. Luyalu JavaScript Tome-II 4.3.15 Boolean type : type consisting of the primitive values true and false 4.3.16 Boolean object : member of the Object type that is an instance of the standard built-in Boolean constructor A Boolean object is created by using the Boolean constructor in a new expression, supplying a Boolean value as an argument. The resulting object has an internal slot whose value is the Boolean value. A Boolean object can be coerced to a Boolean value. 4.3.17 String value : primitive value that is a finite ordered sequence of zero or more 16-bit unsigned integer values. A String value is a member of the String type. Each integer value in the sequence usually represents a single 16-bit unit of UTF-16 text. However, ECMAScript does not place any restrictions or requirements on the values except that they must be 16-bit unsigned integers. 4.3.18 String type : set of all possible String values 4.3.19 String object : member of the Object type that is an instance of the standard built-in String constructor. A String object is created by using the String constructor in a new expression, supplying a String value as an argument. The resulting object has an internal slot whose value is the String value. A String object can be coerced to a String value by calling the String constructor as a function. 4.3.20 Number value : primitive value corresponding to a double-precision 64-bit binary format IEEE 754-2008 value. A Number value is a member of the Number type and is a direct representation of a number. 4.3.21 Number type : set of all possible Number values including the special “Nota-Number” (NaN) value, positive infinity, and negative infinity 4.3.22 Number object : member of the Object type that is an instance of the standard built-in Number constructor A Number object is created by using the Number constructor in a new expression, supplying a number value as an argument. The resulting object has an internal slot whose value is the number value. A Number object can be coerced to a number value by calling the Number constructor as a function. 4.3.23 Infinity : number value that is the positive infinite number value 4.3.24 NaN : number value that is an IEEE 754-2008 “Not-a-Number” value 4.3.25 Symbol value : primitive value that represents a unique, non-String Object property key 4.3.26 Symbol type : set of all possible Symbol values 4.3.27 Symbol object : member of the Object type that is an instance of the standard built-in Symbol constructor 4.3.28 function : member of the Object type that may be invoked as a subroutine In addition to its properties, a function contains executable code and state that determine how it behaves when invoked. A function's code may or may not be written in ECMAScript. 4.3.29 built-in function : built-in object that is a function. Examples of built-in functions include parseInt and Math.exp. An implementation may provide implementationdependent built-in functions that are not described in this specification. 4.3.30 property : part of an object that associates a key (either a String value or a Symbol value) and a value. Depending upon the form of the property the value may be Variables & Functions - 30 / 34 - dimanche, 14. octobre 2018 (3:40 pm) J.D.B. DIASOLUKA Nz. Luyalu JavaScript Tome-II represented either directly as a data value (a primitive value, an object, or a function object) or indirectly by a pair of accessor functions. 4.3.31 method : function that is the value of a property. When a function is called as a method of an object, the object is passed to the function as its this value. 4.3.32 built-in method : method that is a built-in function Standard built-in methods are defined in this specification, and an ECMAScript implementation may specify and provide other additional built-in methods. 4.3.33 attribute : internal value that defines some characteristic of a property 4.3.34 own property : property that is directly contained by its object 4.3.35 inherited property : property of an object that is not an own property but is a property (either own or inherited) of the object's prototype. Mais « null == undefined », mais « (null === undefined) == false ». « (undefined==true) == false » mais « (undefined==false) == false ». Mais aussi « null == 0 » mais « (undefined == NaN) == false ». var vnull = null; var rvnull = 3 * vnull; // Donne 0. var cudf; var rcudf = 1 * cudf; // Donne NaN « (NaN===NaN) == false » et « (NaN==NaN) == false ». => Pour tester IsNaN : 1. Fonction isNaN() : isNaN(NaN) === true ; isNaN("") == false ; isNaN("") === false ; isNaN("stg") === true ; isNaN(" ") == false ; isNaN(" ") === false ; 2. Méthode Number.isNaN() : Number.isNaN(NaN) === true ; Number.isNaN("") == false ; Number.isNaN("") === false ; Number.isNaN("stg") === false ; Number.isNaN(" ") == false ; Number.isNaN(" ") === false ; 3. typeof : Indique qu’un nombre n’est pas NaN. typeof 0/0 (donne NaN) ; ((typeof 0/0) == NaN) == false ; ((typeof 0/0) == NaN) === false ; typeof NaN === "number" ; Variables & Functions - 31 / 34 - dimanche, 14. octobre 2018 (3:40 pm) J.D.B. DIASOLUKA Nz. Luyalu JavaScript Tome-II 4. L’expression x != x : <script language="JavaScript"> "use strict"; let x = 15 console.log(x != x) // false console.log(typeof 0/0) // NaN console.log((0/0) != (0/0)) // true // Mais remarquez ceci : x=0/0 console.log(typeof x) // number console.log(x != x) // true </script> CHAPITRE 5 : Date() et new Date() « new Date » crée et retourne une instance de l’objet Date() avec la date et l’heure du moment, en appelant son constructeur l’objet-fonction Date(). « Date() » appelle directement la méthode « Date.toString() » [de cet objetfonction Date()] avec la date et l’heure du moment. <script type="text/javascript"> console.log(new Date()) // Date 2018-01-25T06:41:15.973Z "use strict"; console.log(Date()) // Thu Oct 11 2018 10:24:18 GMT+0100 (Paris, Madrid) </script> CHAPITRE 6 : Math.floor() ou (x-(xmodulo1)) ? <script type="text/javascript"> "use strict"; var x=4.75; console.log(Math.floor(x)) // 4 console.log(x-(x % 1)) // 4 console.log(x % 1) /* 0.75 */ </script> Tester si une chaîne est plus « lourde » qu’une deuxième : <script type="text/javascript"> var str1 = "ddd"; Variables & Functions - 32 / 34 - "use strict"; dimanche, 14. octobre 2018 (3:40 pm) J.D.B. DIASOLUKA Nz. Luyalu var str2 = " "aaaa" aaaa" console.log( console.log(str1.localeCompare( str1.localeCompare( str1.localeCompare(str2)); str2)); var str3 = " "ddd"; ddd"; console.log( console.log(str1.localeCompare( str1.localeCompare( str1.localeCompare(str3)); str3)); JavaScript Tome-II // 1 // 0 var str4 = " "dddd"; dddd"; console.log( console.log(str1.localeCompare( str1.localeCompare( str1.localeCompare(str4)); str4)); /* -1 */ </script> Précédence des opérateurs (de la plus forte à la plus basse) : ( $ signifie séparateur de groupe de même précédence) . (dot acc accès s champ) ++ -- - ~ ! delete new typeof void * / % + (addition) - (soustraction) + (concat (concaténation) nation) << >> >>> < <= > >= instanceof == != === !== & ^ | && || ?: = op= (pour += -=...*= /=) , (virgule = cha chaînage nage = évaluation valuation multiple) (3 + 2 * num).toString() === false // Affiche true !(3 + 2 * num).toString() === "") // false Recommandation : Pour tester un code JavaScript, allez au site http://jsfiddle.net/. Mots-clés : JAVASCRIPT, Programmation Internet, parseInt, parseFloat, toString, fonction fléchée, sloppy mode, mode strict, prototype, objet ordinaire, objet exotique, objet standard, built-in object, Scope, contexte d’exécution, Domaine, Portée, Étendue, Visibilité, Accessibilité, durée de vie, Es8, ECMASCRIPT, LiveScript, extra-dimensionnels, entités éthériques non-biologiques, TC39, ECMA, Kaprekar Variables & Functions - 33 / 34 - dimanche, 14. octobre 2018 (3:40 pm) J.D.B. DIASOLUKA Nz. Luyalu JavaScript Tome-II D IA SO LU K AN z. Luyalu Docteur en Médecine, Chirurgie & Accouchements (1977), CNOM : 0866 - Spécialiste en ophtalmologie (1980) Études humanités : Scientifique - Mathématiques & Physique. Informaticien-amateur, Programmeur et WebMaster. Chercheur indépendant, autonome et autofinancé, bénévole, sans aucun conflit d’intérêt ou liens d'intérêts ou contrainte promotionnelle 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 - 991239212 - 902263541 - 813572818 [email protected] Variables & Functions - 34 / 34 - dimanche, 14. octobre 2018 (3:40 pm)
