Javascript & Algorithmique

JAVASCRIPT ET
ALGORITHMIQUE
(A l-Khwârizmî)
N ° I - lundi 11 mars 2019 (7:36:03 AM)
Pour Débuter
J.B. Dadet. DIASOLUKA Nz. Luyalu
La prétention primaire de cette série est de tremper vos mains [ peut-être pour votre
toute première fois ] dans le langage de programmation Internet « JavaScript »
(démarqué de la forme originale inventée par SUN) en vous enseignant par l’exemple
ses principes et sa puissance avec moult algorithmes pour informa-tiser d’autres
domaines.
L’objectif final de cette série d’opuscules est de motiver tout un chacun à devenir un
crac de la programmation Internet et à l’Algorithmique.
JavaScript est le langage de choix pour le développement de pages Web dynamiques

DHTML (Dynamic HTML) ou HTML DOM (HTML Document Object Mo-
del), bien que parfois se comportant contre toute attente.
HTML DOM définit un moyen standard pour accéder à, et manipuler un docu-

ment HTML, le présentant dans une structure arborisée (tree-structure ou node
tree) comportant éléments, attributs et du texte, par exemple :
 Document
o Root Element : <HTML>
 Element : <Head>
 Element : <Title>
 Text : <Mon Titre>
o Element : <Body>
 Element : <a>
 Attribute : "href"
 Text : "Mon lien"
 Element : <div>
 Text : "Ma division"
Ne ratez aucun numéro : Please, Click for details inside ●●●>
-[0]851278216 -[0]991239212 -[0]899508675 -[0]15149280 -[0]813572818
JAVASCRIPT && ALGORITHMIQUE
MS-JAVASCRIPT & ALGORITHMIQUE
Définition :
JavaScript est un langage orienté objet plus ou moins basé sur le langage C++
dans sa syntaxe, sa logique et ses opérateurs (voir le fascicule sur « les opéra-
teurs spécifiques du langage C++ » du même auteur).
Pour exécuter les exemples contenus dans cette série, vous pouvez saisir le code
source soit
1. dans l’ardoise javascript d’un navigateur, soit
2. dans un fichier [d’extension] *.html ou *.js avec un éditeur de texte gratuit

dont :
 JavaScript :
editlivejava, FJSE, JetBRAIN Intelli J IDEA, eclipse-java-ganymede, jxhtmledit,
scriptomania,
 CSS :
topstyle, css_editor, EngInSite CSS Editor, RapidCSS ,
 Perl :
ActivePerl, DzPERL, perl-studio, ou Python…
 PHP :
DzPHP, PHPPRO, PHPXEDIT, php, php_editor_php, phpBB, phpedit, phpmagic,
phpmkr, rapidphp, Top PHP Studio, tphpstudio, Winsyntax ,
 HTML :
BowPad, Sublime Text, EditPlus, EditPad Pro, NotePad++, Crimson ou Emerald
(Emurasoft EmEditor), AkelPad, FocusWriter, UltraEdit, UEStudio, 010 Editor, ged-
it, jEdit, JetBrains WebStorm, IntelliJ IDEA, Kate, Editra, crisp, Aptana Studio, At-
om, Menicucci Editeur, TEdit, ED for Windows, AptEdit, BestAddressHTML, webuild,
Boxertexteditor, CodeLobster, LopeEdit, dida, ConText, SuperEdit, TextPad,
lundi 11 mars 2019 -2/49- 07:36:03

Brackets, Codelobster PHP, Dynamic HTML Editor, EC_edit, TotalEdit, Araneae,
CoffeeHTML, CuteHTML, WebExpert, AceHTML, HTML Constellation, HtmlEdit,
HTMLEditor, HotHTML, Arachnophilia, MultiEdit (MeLS), HotDog, HippoEdit, prEdi-
tor, Pad, PSPad, Htmlpad, NotePad, NotePad2, WebPad, Another Notepad, gsnote,
NoteTab, Stylizer, HandyHTML Studio, GetDiz, FrontPage, Amaya (pas pour le JS),
scHTML, KissHTML, Professional Editor (pred), PurpleEditor, Aurora WebEditor,
Pub, Komodo Edit, kompozer, Nvu, lightPad, mpweb, wzhtml, QuickWeb, Simple
Web, Simple-HTML-Editor, TSWebEditor, Source Editor, Notes SE, Claris Home
Page, EnhancedHTML, ezhtmledit, ezyhtmleditor, CodeSnap, hippou, Hypertext-
Builder, html2000, HTML Direct, Lambda HTML, LocHTML, html, Sothink HTML,
HTML Editor VB6, HTMLiar, HtmlCodeCleaner, HTMLKit, FreshHTML, CSE HTML Vali-
dator, CodeChameleon, Text Hawk, WEB-O-RAMA, webformer, WeBuilder, WebZar,
HB14, TIDY, EditRocket, Visual Studio Code, ou
 XML :
eWebEDIT, cooktop, editml, pebb, pxe, selexml, stylus-studio-enterprise, Xed,
XedPro, XMLFox, xmlnotepad, XMLobjective, XMLSpyEclipse, XMLViewer, XMLwrit-
er, Oxygen XML…
Certains de ces éditeurs excellent par leur aisance à :
1. Manipuler les très gros fichiers de plus de 2 mégas, ou sont
2. Pourvu d’un visualiseur de la miniature de l’ensemble du fichier sur le bord

droit de la fenêtre de l’éditeur qui en le survolant avec la souris, ouvre une
fenêtre pop-up mobile de zoom, permettant de voir le contenu du fichier à
ce niveau, et en cliquant dessus vous ramène à cet endroit dans le fichier.
3. pourvus de la fonctionnalité tri (parfois avec suppression des doublons), ou
4. peuvent supprimer les doublons sans tri, ou permettent d’ouvrir plusieurs

fenêtres [liées] pour un même fichier, ou
5. permettent la recherche [incrémentale] | remplacement dans des fichiers

disques ou tous les fichiers ouverts, ou
6. peuvent écraser (écrire sur) les fichiers en lecture seule, ou
7. permettent les macros, ou
lundi 11 mars 2019 -3/49- 07:36:03

8. permettent d’insérer automatiquement les balises de formatage gras, italic,
ou souligné comme dans un traitement de texte, ou
9. ferment automatiquement les balises ou mettent en surbrillance les paires de

balises ou simplement la balise sélectionnée, d’autres sont dotés de la
10. fonctionnalité « auto complétion », d’autres
11. proposent automatiquement une liste d’attributs et leurs valeurs pour la

balise sélectionnée, d’autres brillent par leur
12. coloration syntactique, ou
13. transmettre la coloration syntactique dans un traitement de texte lors

d’un « copier-coller ».
14. d’autres y transmettent aussi la numérotation des lignes lors du même

« copier-coller ».
15. la rapidité à se charger soi-même et
16. la rapidité à charger des très gros fichiers et à naviguer dans ces gros fi-
chiers, d’autres permettent une
17. saisie en WYSIWYG (mode graphique, plus lents) alors que d’autres per-
mettent seulement une
18. prévisualisation (la saisie plus véloce se fait en mode texte)…
19. Configuration avec le fichier de configuration universelle « EditorCon-

fig ».
Tous ou la plupart sont téléchargeables sur Internet et gratuits : freeware,

cardware ou shareware = durée limitée « d’utilisation gratuite = période
d’essai », mais aucun d’eux ne réunit toutes les qualités reprises ici ou sou-
haiteés.
lundi 11 mars 2019 -4/49- 07:36:03

Les PADS par principe ne permettent d’éditer qu’un seul fichier à la fois, mais
beaucoup permettent d’ouvrir et d’éditer plusieurs fichiers à la fois.
Amusons-nous donc un peu avec la mathématique et le JavaScript (ou

JScript ou JS), par exemple le calcul du carré d’un nombre ( n² ) = « somme des
n premiers nombres entiers impairs » : 25 = 5² = 1 + 3 + 5 + 7 + 9.
<script> Carré de 1 = 1 (1)

for(k=1 ; k<=12 ; k++) { Carré de 2 = 4 (4)
a=c=cpt=0 Carré de 3 = 9 (9)
for(n=1 ; cpt<k ; n++) { Carré de 4 = 16 (16)
Carré de 5 = 25 (25)
if(n%2) { Carré de 6 = 36 (36)
a+=k ; c+=n ; cpt++ Carré de 7 = 49 (49)
} Carré de 8 = 64 (64)
} Carré de 9 = 81 (81)
document.write( Carré de 10 = 100 (100)
"Carré de "+k+" = "+c+" ("+a+")<br>") Carré de 11 = 121 (121)
} Carré de 12 = 144 (144)
</script>
c = Somme des n premiers nombres entiers impairs,

a = somme du nombre autant de fois lui-même (carré classique du nombre).
Un programme qui vérifie que la somme de n carrés parfaits consécutifs est

égale à l’expression n ( n + 1 ) ( 2 n + 1 ) / 6 . Rappel : si le dernier chiffre d’un en-
tier est 2, 3, 7 ou 8 ; ou si son résidu est 2, 3, 5, 6 ou 8, l’entier n'est pas un carré.
<script>
c=0 ; tmp="" ; s="" ; t=0
for(m=1 ; m<16 ; m++) {
p= Math.pow(m,2)
c+=p ; tmp+=s+p ; t+=p ; s="+"
if(m*(m+1)*(2*m+1)/6 == c)
document.write(
m + ") " + tmp + " (="+t+") = "+ m + "*(" + m + "+1)*(2*" +
m + "+1)/6 = " + m + "*(" + (m+1) + ")*(" + (2*m+1) +
")/6 = " + m*(m+1)*(2*m+1)/6 +" = "+c+"<br>")
}
</script>
Exécution :
1) 1 (=1) = 1*(1+1)*(2*1+1)/6 = 1*(2)*(3)/6 = 1 = 1
2) 1+4 (=5) = 2*(2+1)*(2*2+1)/6 = 2*(3)*(5)/6 = 5 = 5
3) 1+4+9 (=14) = 3*(3+1)*(2*3+1)/6 = 3*(4)*(7)/6 = 14 = 14
4) 1+4+9+16 (=30) = 4*(4+1)*(2*4+1)/6 = 4*(5)*(9)/6 = 30 = 30
5) 1+4+9+16+25 (=55) = 5*(5+1)*(2*5+1)/6 = 5*(6)*(11)/6 = 55 = 55
…
lundi 11 mars 2019 -5/49- 07:36:03

14) 1+4+9+16+25+36+49+64+81+100+121+144+169+196 (=1015) = 14*(14+1)*(2*14+1)/6
= 14*(15)*(29)/6 = 1015 = 1015
15) 1+4+9+16+25+36+49+64+81+100+121+144+169+196+225 (=1240) =
15*(15+1)*(2*15+1)/6 = 15*(16)*(31)/6 = 1240 = 1240
Chaque carré parfait est divisible par 3 ou 4 ou quand on lui soustrait 1. Chaque
carré parfait est divisible par 5 ou l’est quand on lui additionne ou soustrait 1,
puisque le carré d’un nombre se termine nécessairement par l’un des chiffres :
1 , 4 , 5 , 6 , 9 , 0.
<script> 9 :
var i=1, t=0 ; tmp=s="" * 81 DIVISIBLE par 3 =
for(; i<15 ; i++) { 81-1 (80) => non divisible par 3
document.write( 81+1 (82) => non divisible par 3
* 81 non divisible par 4
"<br><br>"+i+" :<br>") 81-1 (80) => DIVISIBLE par 4 = 20
p= Math.pow(i,2) 81+1 (82) => non divisible par 4
* 81 non divisible par 5
c(3) ; c(4) ; c(5) 81-1 (80) => DIVISIBLE par 5 = 16
} 81+1 (82) => non divisible par 5
function c(d){
if(!(p%d)) document.write(
"* "+p+" DIVISIBLE par "+d+" = "+"<br>")
else if(p%d) document.write(
"* "+p+" non divisible par "+d+"<br>")
if((p-1)%d) document.write(
p+"-1 ("+(p-1)+") => non divisible par "+d+"<br>")
else document.write(
p+"-1 ("+(p-1)+") => DIVISIBLE par "+d+" = "+(p-1)/d+"<br>")
if((p+1)%d) document.write(
p+"+1 ("+(p+1)+") => non divisible par "+d+"<br>")
else document.write(
p+"+1 ("+(p+1)+") => DIVISIBLE par "+d+" = "+(p+1)/d+"<br>")
}
</script>
Retrancher 1 d’un carré parfait impair donne un multiple de 8.
<script>
var i=1, t=0 ; tmp=s="" ; flag=0
for(; i<1000000 ; i++) {
p= Math.pow(i,2)
if(p%2) if((p-1)%8) {
document.write(i + "* " + p + " INDIVISIBLE "+
"par " + 8 + " = " + (p-1)/8 + "<br>")
flag++
}
}
if(!flag) document.write(
lundi 11 mars 2019 -6/49- 07:36:03

"Aucune exception trouvée jusqu'à "+i)
</script>
Exécution :
Aucune exception trouvée jusqu'à 1000000
On peut écrire des identités avec des carrés lorsque le premier terme du
membre de gauche est 3, 10, 21, 36, ... (voir les 39 premiers membres de
l’identité dans l’Array du code de programme ci-dessous). On a ainsi des identi-
tés de successivement 2, 3, 4, ... termes dans le premier membre (de gauche) et
1, 2, 3, ... termes dans le deuxième membre (de droite), dont les quatre pre-
mières identités :
 32 + 42 = 52 = 25
 102 + 112 + 122 = 132 + 142 = 365
 212 + 222 + 232 + 242 = 252 + 262 + 272 = 2030
 362 + 372 + 382 + 392 + 402 = 412 + 422 + 432 + 442 = 7230
<script>
p=new Array (
3,10,21,36,55,78,105,136,171,210,253,300,
351,406,465,528,595,666,741,820,903,990,
1081,1176,1275,1378,1485,1596,1711,1830,
1953,2080,2211,2346,2485,2628,2775,2926,3081)
pl=p.length
for(k=0;k<pl;k++){
g=d=0; t="{ [ "; s=""
qtt=k+2; n=p[k]
for(m=0;m<qtt;m++) {
t+="<b>"+n+"</b>^2 ("
g+=v=Math.pow(n++,2)
t+=v+") "
if(m<qtt-1) t+="+ "
}
t+=" ] <b>(="+g+")</b> } ==<br> { [ ";
g=d=0
for(m=0;m<qtt-1;m++) {
t+="<b>"+n+"</b>^2 ("
g+=v=Math.pow(n++,2)
t+=v+") "
if(m<qtt-2) t+="+ "
}
t+=" ] <b>(="+g+")</b> }"
document.write("*"+t+" <b><=></b> <b>"+g+"</b><br>")
}
</script>
lundi 11 mars 2019 -7/49- 07:36:03

Exécution :
*{ [ 3^2 (9) + 4^2 (16) ] (=25) } ==
{ [ 5^2 (25) ] (=25) } <=> 25
*{ [ 10^2 (100) + 11^2 (121) + 12^2 (144) ] (=365) } ==
{ [ 13^2 (169) + 14^2 (196) ] (=365) } <=> 365
*{ [ 21^2 (441) + 22^2 (484) + 23^2 (529) + 24^2 (576) ] (=2030) } ==
{ [ 25^2 (625) + 26^2 (676) + 27^2 (729) ] (=2030) } <=> 2030
*{[36^2(1296)+37^2(1369)+38^2(1444)+39^2(1521)+40^2(1600)](=7230)} ==
{[41^2(1681)+42^2(1764)+43^2(1849)+44^2(1936)](=7230)} <=> 7230
*{[55^2(3025)+56^2(3136)+57^2(3249)+58^2(3364)+59^2(3481)+60^2(3600)](=19855)} ==
{[61^2(3721)+62^2(3844)+63^2(3969)+64^2(4096)+65^2(4225)](=19855)} <=> 19855
Comme le C, JS est casse sensible : var1 != Var1 != vAr1.
Le nom de variable (ou de fonction ou de paramètre) peut avoir n’importe

quelle longueur mais doit respecter les 3 règles suivantes :
 Commencer par une lettre (MAJUSCULE ou minuscule), ou un trait de
soulignement (_), ou un signe du dollar.
 Les lettres suivantes peuvent être comme ci-dessus (lettres, underscore ou
dollar) et en plus, des chiffres.
 Ne pas être un mot réservé.
JS diffère du C++ en ce que dans le JS *il n’est pas obligatoire de terminer une
instruction par un « ; » quand l’instruction est en fin de ligne (mais il le faut
quand deux instructions distinctes sont sur une même ligne physique), *la défi-
nition de variables n’exige pas le mot clé var et on ne spécifie pas explicitement
leur type (format d’encodage) : JS est un « loosely typed language with auto-
matic coercion [= conversion implicite] », les variables n’ont pas de type fixe ;
elles prennent le type implicite de la valeur qui y est stockée, facilitant les af-
fectations :
<SCRIPT>
window.onload=ftTables;
function ftTables(){
var tTables1 = document.body.createTextRange();
var tTables2 = tTables1.duplicate();
alert(tTables1.text +"\n==\n"+ tTables2.text)
}
</SCRIPT>
<BODY>
<DIV ID=d>Contenu de DIV. </DIV>
<P ID=p>Contenu de P. </P>
<A Href="" ID=a>Contenu de A. </A>
</BODY>
lundi 11 mars 2019 -8/49- 07:36:03
Dans une expression arithmétique à plusieurs types de données, les nombres

sont convertis dans le type à plus forte précision, puis les nombres sont éven-
tuellement convertis en string.
JS a six types de données : number, string, object, et Boolean, les deux autres (à
ne pas confondre avec NaN ou « not a Number ») étant null (non instanciée ou
déclarée – pas identique au null de C++) et undefined (instanciée =déclarée ou
définie= mais n’a jamais reçu une valeur explicite) ;
Le type de données Number : integer (entier) et floating-point numbers).

 Integers : positifs, 0, ou négatifs représentables en base de numération
 décimale (10),
 octale (8) introduit par un 0 suivi par des digits de 0 à 7 (s’il contient 8
et/ou 9 il est automatiquement traité/considéré comme décimal, et s’il
contient un « e » il génère une erreur, et s’il contient une virgule (plutôt
point) il est considéré comme « decimal floating point » donc non octal),
 ou hexadécimale (16) introduit par "0x" ou "0X" suivi par des digits 0 à 9
et/ou des lettres de A à F (ou a à f) 0xF == 15d et 0x10 == 16d. Tout ce qui
vient après une virgule (plutôt point) est rejeté / ignoré. Un « e » ne gé-
nère pas une erreur mais ne signifie pas exponentiel (e.g. docu-
ment.write(0x10e9) => 4329 et document.write(0x10e10) => 69136).
 Floating-point number (réel) peut être positif ou négatif et contenir une vir-
gule (decimal point), ou un "e" ou “E” (notation scientifique donnant la puis-
sance de 10) suivi d’un entier positif ou négatif, soit les deux, selon le stan-
dard IEEE 754 de représentation numérique. Les nombres hexadécimaux et
octaux peuvent être négatifs mais jamais fractionnaires. Des valeurs numé-
riques spéciales :
 NaN, ou not a Number (Pas un nombre)
 Positive Infinity (infini positif)
 Negative Infinity (infini négatif)
 Positive 0 (0 positif)
 Negative 0 (0 négatif)
Attention avec les expressions booléennes : si la constante prédéfinie false

(ou !true) ==0 (MININT), true (ou !false) a une valeur indéterminée souvent «
lundi 11 mars 2019 -9/49- 07:36:03
1 » par défaut ou « -1 » (MAXINT) dans certains langages, en général toute va-
leur (+) ou (-) différente de zéro ou de false, est considérée comme true.
D’autres différences entre JS et C :
*La fonction main(), les arrays (tableaux) multi-dimensionnelles ne sont pas

gérées comme dans le C et en particulier toutes les lignes d’une array ne doi-
vent pas nécessairement avoir le même nombre d’éléments dans toutes les co-
lonnes et même toutes les lignes ne doivent pas nécessairement être de la même
dimension (les arrays y sont comme des paquets d’informations), *Les variables
système argc et argv … ; de plus et surtout *Les pointeurs (y compris les para-
mètres par référence) ne sont pas gérés. Pourtant certaines tâches sont mieux
effectuées par des pointeurs ou des structs, par exemple la fonction swap().
Comment contourner la difficulté :

<script>
tamax=8, tamin=14
t=new Array(tamax, tamin)
disp(t)
t=fswap(t)
disp(t)
function fswap(s){
tmp=s[0],s[0]=s[1],s[1]=tmp
return s
}
function disp(d){
alert("TA = " + d[0] + " / " + d[1])
}
</script>
On peut aussi utiliser des propriétés créées à la volée :
<script>
var TA = new Object();
TA.MAX=8
TA.min=14
TA.pls=68
alert(TA.MAX+" / "+TA.min)
TA=fswap(TA)
alert(TA.MAX+" / "+TA.min)
lundi 11 mars 2019 -10/49- 07:36:03

function fswap(p){
if(p.min>p.MAX) {
tmp=p.MAX ; p.MAX=p.min ; p.min=tmp
}
return p
}
</script>
Encore d’autres différences : *les fonctions ne surchargent pas, *les structs

simples ne sont pas utilisées et seules existent les classes (structs avec propriétés
ou caractéristiques, méthodes ou fonctions intégrées / incorporées, construc-
teurs et destructeurs, héritage …), de plus *la gestion des chaînes de caractères
n’est pas la même, *beaucoup d’autres routines (fonctions de la bibliothèque)
ont été remplacées par d’autres et elles sont souvent adaptées à la gestion des
[éléments (balises) et attributs/styles de] pages Web.
Il n’ya pas que la différence entre les C et le JavaScript, il y a aussi des diffé-
rences entre différents interpréteurs JS. Voici par exemple comment différents
Browsers exécutent un même code, ci-dessous :
<script>
document.write((new Date()).toLocaleString())
</script>
 25/07/2009 13:30:18 (Opera)

 mardi 22 septembre 2009 04:24:13 (FireFox)
 Tuesday, September 22, 2009 05:07:55 (Netscape 8.1.3)
 Monday, September 21, 2009 13:45:44 (Mozilla)
 samedi 25 juillet 2009 13:28:49 (Seo)
 mardi 22 septembre 2009 06:25:00 (CE Safe Browser)
 Sat Jul 25 2009 13:45:15 GMT+0100 (Afr. centrale Ouest)
(Google Chrome 3.0.195.1 – 2009)
 Saturday, July 25, 2009 13:34:19 (Safari 3.525.26.13)
 samedi 25 juillet 2009 13:23:11 (visionneur interne de EditPlus)
 lundi 21 septembre 2009 12:00:50 (Advanced Browser)
 samedi 25 juillet 2009 13:26:27 (AvantBrowsser)
 lundi 21 septembre 2009 12:34:52 (AM Browser)
 mardi 22 septembre 2009 07:00:47 (Smart Explorer)
 lundi 21 septembre 2009 11:55:56 (AccessBrowser)
 samedi 25 juillet 2009 13:29:45 (Internet Explorer)
 samedi 25 juillet 2009 13:31:13 (AcooBrowser)
lundi 11 mars 2019 -11/49- 07:36:03
 lundi 21 septembre 2009 13:34:43 (Austin Powers)
 lundi 21 septembre 2009 13:29:31 (NeoPlanet)
 samedi 25 juillet 2009 13:32:26 (CrazyBrowser)
 mardi 22 septembre 2009 06:50:26 (m9P)
 mardi 22 septembre 2009 06:03:57 (WindowSurfer)
 samedi 25 juillet 2009 13:33:17 (Maxthon)
Vérifiez donc d’abord votre code avec d’autres browsers (ou interpréteurs JS)
avant de conclure qu’il est la source d’un problème.
La propriété prototype :
Elle définit une/des nouvelle(s) propriété(s) pour un objet, la nouvelle propriété

est partagée par tous les objets du type spécifié (ou mieux ses descendants) et
créés avec l'opérateur new.
Syntaxe : typeObjet.prototype.newProperty = valeur
 typeObjet est le nom d'un constructeur spécifié par le type de l'objet.

 newProperty est le nom de la propriété à créer.
 valeur est la valeur initiale facultative de la propriété, pour tous les objets
du typeObjet spécifié.
Exemple :
<SCRIPT LANGUAGE="JavaScript"> Jour Semaine = 0è
vdate = new Date(
2008, 12, 11, 15, 20, 25) Millénaire : 3è
Siècle = 21è
// Ajout d'une propriété à l'objet Date :
Date.prototype.Millenaire;
vdate.millenaire =
Math.ceil(vdate.getFullYear()/1000)+"è<br>"
document.writeln("Jour Semaine = " +
vdate.getDay() +
"è<br>Millénaire : " +
vdate.millenaire);
// Ajout d'une propriété à

// l'objet Date :
Date.prototype.Siecle =
Math.ceil(vdate.getFullYear()/100)+"è"
vdate2 = new Date()
lundi 11 mars 2019 -12/49- 07:36:03

document.writeln("Siècle = " +
vdate2.Siecle);
</SCRIPT>
Exemple2 : Dans cet exemple figure la commande « alert » qui affiche une boîte
de message. JS offre trois sortes de “Message Boxes” pop-up (surgissant) :
« alert », « prompt » et « confirm » ; ce sont des méthodes de l’objet interface
« window ». Ces boîtes de message sont « modal » càd qu’ils monopolisent le
contrôle du processeur pour la fenêtre qui les a affichées, et on doit les fermer
avant de continuer.
alert prend au maximum un seul argument (la chaîne non HTML à afficher),
affiche un bouton OK pour fermer la boîte.
<script>
document.write( prompt("Dites un mot","") ) quoi ?
</script>
confirm prend un seul argument (la chaîne non HTML représentant la question
à poser) ; elle pose une question quantique / binaire / booléenne (OUI / NON) et
retourne true ou false selon que l’on clique < OK > ou < CANCEL >.
<script>
var rep = window.confirm(
"Voulez-vous rire ? OK = OUI , Cancel = NON");
if(rep) { alert(rep+" - gbrougble, gbrougble, gbrougble,...!"); }
else window.alert(rep + " - Oh, pourquoi NON!");
</script>
->
->
lundi 11 mars 2019 -13/49- 07:36:03

prompt accepte au maximum deux arguments (la question, et la réponse par dé-
faut dont le type par défaut est “undefined”).
<script>
rep=prompt("Tourner combien de fois ?", 15)
document.write(rep)
</script>
15
<script>
Date.prototype.HrCplt=
function(){
j = new Array(
"Dim","Lun","Mar","Mer","Jeu","Ven","Sam")
m = new Array("Jan","Fév","Mar","Avr","Mai",
"Jun","Jul","Aug","Sep","Oct","Nov","Déc")
d = new Date() ;
r = "Il est exactement :\n"
return r +
j[d.getDay()] + " , " + d.getDate() + "/" +
m[d.getMonth()]+ "/" + d.getFullYear()+ "\n" +
d.getHours() + " hrs : " +
d.getMinutes() + " Min : " +
d.getSeconds() + " Secs"
}
h = new Date()
alert(h.HrCplt())
</script>
Pour définir (créer) une nouvelle propriété ou méthode pour un objet plus faci-
lement : juste l’utiliser et éventuellement lui affecter une valeur
<script> Exécution :
var eleve = new Object()
this.nom = "Luys";
this.methode=fmethode // Sans arguments Luys 45 true
with (eleve) {
cote = 45; // eleve.cote = 45 Luys 45 true
delib = true; // eleve.delib = true *Dans la méthode*
}
with (eleve) document.write( Luys 45 true
nom+" "+cote+" "+delib+"<br>") Luys 45 true
document.write(
this.nom+" "+this.cote+" "+this.delib)
lundi 11 mars 2019 -14/49- 07:36:03
this.methode(eleve) Rem.: this représente
function fmethode(p){ l’objet [en cours de créa-
document.write("<br>*Dans la méthode*<br>") tion].
with (p) document.write(
nom+" "+cote+" "+delib+"<br>")
document.write(
this.nom+" "+this.cote+" "+this.delib)
}
</script>
Définir (créer) une nvlle template (structure, modèle) d’un objet est aussi facile:
Juste le définir comme une fonction (en fait constructeur de l’objet)

function eleve(a1,a2,a3){ // nouvel Objet eleve
this.nom=a1;
this.age=a2; *dias 120 true
this.loge=a3;
this.meth1=fmethobj *false NP2 luy 80
this.meth2=fmethparms NP1
}
&NP1= NP1
function fmethobj(o){ NP2= NP2
// définition de eleve.meth1 (public)
if(o.nom!="") document.write("<br>*"+o.nom+" ") #NP1= NP1
if(o.age!="") document.write(o.age+" ") NP2= undefined
if(o.loge!="") document.write(o.loge+" ")
if(o.newProp1!=undefined) document.write(o.newProp1+" ") *dias 120 true
if(o.newProp2!=undefined) document.write(o.newProp2) *luy 80 NP1
}
*luy 80 NP1
function fmethparms(p1,p2,p3,p4,p5){ *dias 120 true
// définition de eleve.meth2 (public)
if(p3.length!=0) document.write("<br>*"+p3+" ")
if(arguments[4]!=undefined) document.write(p5+" ")
if(p1!=null) document.write(p1+" ")
if(arguments[1]!="") document.write(p2+" ")
if(arguments.length>3) document.write(p4+" ")
}
o1=new eleve("dias",120,true);
o1.meth1(o1) // appel fmethobj()
o2=new eleve()
o2.newProp1="NP1" // newProperty portée fichier
with(o2){
nom="luy"; age=80; loge=false
newProp2="NP2" // newProperty portée bloc
meth2(nom,age,loge,newProp1,newProp2) // appel fmethparms()
document.write("<br>&NP1= "+newProp1)
document.write("<br>NP2= "+newProp2)
lundi 11 mars 2019 -15/49- 07:36:03
}
document.write("<br>#NP1= "+o2.newProp1)
document.write("<br>NP2= "+o2.newProp2)
o1.meth1(o1);o1.meth1(o2);o2.meth1(o2);o2.meth1(o1);
</script>
Le constructeur MakeArray() crée et initialise une array :
<script> -1. «undefined»

function MakeArray(length) { 0. «0»
this.extent = length; 1. «1»
for (iNum=0; iNum < length; iNum++) { this[iNum] = iNum; } 2. «2»
3. «3»
// crée et initialise une array 4. «4»
} 5. «undefined»
6. «6»
myArray = new MakeArray(5);
myArray[6]=6
for(k=-1;k<7;k++)
document.write(k+". «"+myArray[k]+"»<br>")
</script>
Pour connaître si un objet est un prototype d’un autre :
<script> true
var re = new RegExp();
document.write ( RegExp.prototype.isPrototypeOf( re ) );
</script>
Pour connaître si un objet possède une propriété :

<script>
var s = new String("un texte");
document.write('s.hasOwnProperty("split") = '+
s.hasOwnProperty("split")+"<br>");
document.write('String.prototype.hasOwnProperty("split") = '+
String.prototype.hasOwnProperty("split")+"<br>");
document.write('s.hasOwnProperty("length") = '+
s.hasOwnProperty("length")+"<br>");
document.write('String.prototype.hasOwnProperty("length") = '+
String.prototype.hasOwnProperty("length"));
</script>
Exécution :
lundi 11 mars 2019 -16/49- 07:36:03

s.hasOwnProperty("split") = false
String.prototype.hasOwnProperty("split") = true
s.hasOwnProperty("length") = true
String.prototype.hasOwnProperty("length") = true
Gestion de l’élément (balise HTML) « image » dans JS
<body>

<img src="http://dummy1">
<script>
// création de l'objet image dans JS
var Objimage;
Objimage = new Image()
// initialisation
Objimage.src = "http://dummy0"
// recup des infos

wi = Objimage.width
he = Objimage.height
document.write("<img src="+Objimage.src+"><br>")
tmp=""
il=document.images.length
tmp+=il+" images chargées:"+"\n"
for(k in document.images)
tmp+=k+". "+
"src= "+document.images[k].src+
" * bgcolor="+document.images[k].bgcolor+
" * height="+document.images[k].height+
" * width="+document.images[k].width+"\n"
document.write(tmp)
</script>
</body>
Exécution :
4 images chargées: length. src= undefined * bgcolor=undefined *

height=undefined * width=undefined 0. src= http://dummy1/ * bgcol-
or=undefined * height=30 * width=28 1. src= http://dummy2/ * bgcol-
or=undefined * height=30 * width=28
lundi 11 mars 2019 -17/49- 07:36:03

Le nom de l’élément cliqué :
<head>
<script type="text/javascript">
function clickedEl(e,nEl){
var targ, b
if (!e) var e=window.event;
if (e.target) targv=e.target;
else if (e.srcElement) targv=e.srcElement;
if (targv.nodeType==3) /* pour Safari */

{ targv = targv.parentNode; }
console.log("« "+targv.tagName+" »");
if(nEl) console.log(" :: MultiLine");

else console.log(" :: Not MultiLine");
eb=e.button;
if(eb==0) b="Left";
else if(eb==1) b="Middle"
else if(eb==2) b="Right";
console.log("Bouton =",b," ",e.x," "+e.y)
}
</script>
</head>
<body onmouseup="clickedEl(event,this.isMultiLine)">
<p onmouseup="clickedEl(event,this.isMultiLine)">
Clickez n'importe où, tout bouton</p>
<h3 onmouseup="clickedEl(event,this.isMultiLine)">
Ceci un Header</h3>
<INPUT VALUE="Ceci un input"

onmouseup="clickedEl(event,this.isMultiLine)"><br>
<a href="javascript:void(0)"
onmouseup="clickedEl(event,this.isMultiLine)">
Ceci est un lien hypertexte (HYPERLIEN)</a><br>
<a name="ici" onmouseup=

"clickedEl(event,this.isMultiLine)">
cible</a><br>
<HTMLAREA onmouseup="clickedEl(event,this.isMultiLine)">
HTMLAREA</HTMLAREA><br>
<TEXTAREA onmouseup="clickedEl(event,this.isMultiLine)">
TEXTAREA</TEXTAREA><br>
<FIELDSET onmouseup="clickedEl(event,this.isMultiLine)">
FIELDSET</FIELDSET><br>
<img onmouseup="clickedEl(event,this.isMultiLine)" />

</body>
lundi 11 mars 2019 -18/49- 07:36:03
Exécution :
« BODY » isMultiLine - Left 667 463

« P » isMultiLine - Right 63 30
« H3 » isMultiLine - Middle 58 70
« INPUT » is Not MultiLine - Left 69 107
« A » isMultiLine - Right 31 126
« A » isMultiLine - Middle 33 149
« BODY » isMultiLine - Left 53 168
« TEXTAREA » isMultiLine - Right 60 195
« FIELDSET » isMultiLine - Middle 60 226
« IMG » isMultiLine - Left 29 277
En passant, les propriétés de event sont :
data , height , layerX , layerY , modifiers ,

pageX , pageY , screenX , screenY , target ,
type , which , width , x , y
Définition de nouvelles arrays comme « properties » de la première array :
<script> "use strict";

var j=["Dimanche","Lundi","Mardi","Mercredi","Jeudi","Vendredi","Samedi"]
var a_nJsem=new Array(); //
let aLaDate=new Array();
// 1ère Nvlle property Array pour l'Objet « Array » a_nJsem
let oNvDate=new Object();
// 2ème Nvlle property Object pour l'Objet « Array » a_nJsem
aLaDate[0]=new Date(2000,8,11,12,23,34)
a_nJsem[0]=aLaDate[0].getDay()
aLaDate[1]=new Date(2004,8,11)
lundi 11 mars 2019 -19/49- 07:36:03
aLaDate[2]=new Date(2008,8,11,54,65,76)
aLaDate[4]=new Date(100,8,11,18,29,30)
aLaDate[6]=new Date(2012,8,11,12,38,45)
for(let k=0 ; k<a_nJsem.length ; k++)

console.log("a_nJsem[" + k + "]*=> "+a_nJsem[k] + " // " +
"aLaDate[" + k + "] = "+aLaDate[k])
console.log("*".repeat(25));
for(let k in a_nJsem)
console.log("a_nJsem[" + k + "]*=> "+a_nJsem[k] + " // " +
"aLaDate[" + k + "] = "+j[a_nJsem[k]])
let mins=[];
console.log(oNvDate);
oNvDate[0]=new Date(2000,8,11)
mins[0]=oNvDate[0].getMinutes()
oNvDate[1]=new Date(2004,8,11,45,56,67)
oNvDate[2]=new Date(2008,8,11,78,89,90)
oNvDate[5]=new Date(9999,8,11)
console.log(oNvDate);
for(let k=0 ; k<mins.length ; k++)

console.log("mins[" + k + "]*=> "+mins[k] + " // " +
"oNvDate[" + k + "] = "+oNvDate[k])
</script>
Exécution :
lundi 11 mars 2019 -20/49- 07:36:03

Remarques :
 Notez le réajustement automatique des éléments de l'heure

 Notez aussi que les indices max définis pour « varA.otherNewPrp[] » est
2, « varA.otherNewPrp[3] » et au-delà sont indéfinis (« undefined »).
 Notez aussi comment « varA[] » conserve toutes les définitions / affecta-
tions qui lui ont été appliquées.
 Notez aussi que les nouvelles properties ne perturbent pas les valeurs af-
fectées aux « value= » des indices de l'Array « varA ».
En effet, des tables internes traquent tous les objets créés.
Exemple1 :
<body>
<form id="Form1"></form><form name="Form2"></form><form id="Form3"></form>
document.write(document.forms.length + " FORMS rencontrés jusqu'ici")
for(k=0;k<document.forms.length;k++)
document.write("<br>#"+document.forms[k].id);
for(k=0;k<document.forms.length;k++)
lundi 11 mars 2019 -21/49- 07:36:03
document.write("<br>*"+document.forms[k].name);
</script>
<form name="Form4"></form> <form id="Form5"></form>

</body>
Exécution:
3 FORMS rencontrés jusqu'ici
#Form1
#
#Form3
*
*Form2
*
Exemple2:
<SCRIPT>
var tTables1 =
document.body.createTextRange();
alert(tTables1.text)
}
</SCRIPT>
<BODY>
<DIV ID=d>Contenu de DIV.</DIV>
<P ID=p>Contenu de P.</P>
<A Href="" ID=a>Contenu de A.</A>
</BODY>
Les tables internes [permettent de] gére(r) les éléments HTML :
function go(){
var x=document.getElementById('elTable').rows[0].cells;
var y=document.getElementById('elTable').rows[2].cells;
var z=document.getElementById('elTable').rows[1].cells;
x[0].innerHTML="AFFECT R0C0";
y[1].innerHTML="AFFECT R2C1";
z[2].innerHTML="AFFECT R1C2";
}
</script>
<body>
<table id="elTable" border="1">
<tr><td>Rang-0 Col-0</td><td>Rang-0 Col-1</td>
<td>Rang-0 Col-2</td></tr>
lundi 11 mars 2019 -22/49- 07:36:03
</table>
<input type="button" onclick="go()" value="Demo">
</body>
Exécution et après avoir cliqué sur Démo :
Équivalents des variables système argc et argv du C dans JS :

// Définition de fonction
function argc_argv() {
nbargs=arguments.length ---Nombre de paramètres = 0
document.write( ---Nombre de paramètres = 1
"<ul>---Nombre de paramètres ="+
nbargs)  un
for(k=0;k<nbargs;k++)
document.write("<li>"+ ---Nombre de paramètres = 2
arguments[k]+"</li>")
document.write("</ul>")  un
}  deux
// Appels de fonction
argc_argv()
argc_argv("un")
argc_argv("un","deux")
</script>
Affectation d’Arrays :
<script>
ar = new Array(3)
ar=[5,"Z",7,"e",2,"B",15,"a",1,"M",5,"w",8]
// Evitez d'utiliser des éls au-delà du dernier indice défini
document.write("ar= "+ar.length + " - " + ar + " - " + ar.constructor)

sar=new Array
document.write("<br>")
document.write("sar= "+sar.length + " - " + sar + " - " + sar.constructor)
document.write("<br>")
sar=ar
document.write("sar= "+sar.length + " - " + sar + " - " + sar.constructor)
lundi 11 mars 2019 -23/49- 07:36:03
</script>
ar= 13 - 5,Z,7,e,2,B,15,a,1,M,5,w,8 - function Array() { [native code] }

sar= 0 - - function Array() { [native code] }
sar= 13 - 5,Z,7,e,2,B,15,a,1,M,5,w,8 - function Array() { [native code] }
Une façon de gérer les Arrays multidimensionnelles dans JS :
<script>
a=new Array(3)
a[0]=new Array(2); a[1]=new Array(3); a[2]=new Array(1)
a[0][0]="Notre array 00"; a[0][1]="Notre array 01"

a[1][0]="Notre array 10"; a[1][2]="Notre array 12"
a[1][1]="Notre array 11"
for(k=0;k<2;k++) for(m=0;m<3;m++) document.write(a[k][m] + " | ")

</script>
Exécution :
Notre array 00 | Notre array 01 | undefined |

Notre array 10 | Notre array 11 | Notre array 12 |
Le petit polyfill ci-après teste si un élément fait partie d’une array :

<script> -2 in 1,2,3 ? false
tmp="" -1 in 1,2,3 ? false
a = new Array(1,2,3) 0 in 1,2,3 ? true
1 in 1,2,3 ? true
2 in 1,2,3 ? true
for(k=-2 ; k<5 ; k++) 3 in 1,2,3 ? false
tmp+=k+" in "+a+" ? " + (k in a)+"\n" 4 in 1,2,3 ? false
document.write(tmp)
</script>
Pour les tables internes on utilise la méthode inRange() :
<SCRIPT> true
var tTables1 = document.body.createTextRange();
var tTables2 = tTables1.duplicate();
var isInside = tTables1.inRange(tTables2);
lundi 11 mars 2019 -24/49- 07:36:03

document.write(isInside)
}
</SCRIPT>
<BODY>
<DIV ID=d>Contenu de DIV. </DIV>
<P ID=p>Contenu de P. </P>
<A Href="" ID=a>Contenu de A. </A>
</BODY>
On peut créer un mini glossaire / dictionnaire
<script>
function ForInDemo(){
var base, key, dict = "";
base = {
"p" : "Parton" , "a" : "Armand" ,
"d" : "Dolly"
}
for (key in base) {

dict += key + " = "+ base[key] + "\n";
}
return(dict);
}
alert(ForInDemo())
</script>
On peut créer / gérer une mini base de données

<script>
function ForInDemo(){
var base, key, dict = "";
base = {
"p" : "Parton" , "a" : "Armand" ,
"d" : "Dolly"
}
karr=["a","b","d","k","p","q"]
for (key in karr) {

dict += karr[key] + " = " + base[karr[key]] +
"\n";
}
return(dict);
}
alert(ForInDemo())
</script>
lundi 11 mars 2019 -25/49- 07:36:03

Un aspect méconnu de JS c’est la gestion dynamique du filtre :
<style>img { filter:invert() }</style>
function getFilter(){
document.getElementById('myImage').style.filter="invert()";
}
function noFilter(){
document.getElementById('myImage').style.filter=false;
}
</script>
</head>
<body>
<p>Exemple d'insertion DYNAMIQUE du filtre "invert".</p>
<b>Survolez l'image</b><br />
<img id="myImage" src="joyeux-noel.jpg" width="160" height="120"
onmouseover="noFilter()" onmouseout="getFilter()">
<body>
Différentes valeurs de filter sont :
blur, fliph, flipv, gray, shadow, xray, mask.color, dropshadow, alpha.opacity,

light.enabled, wave(add, freq, lightstrength, phase, strength), glow,
glow(color=#Hex,strength=n)
lundi 11 mars 2019 -26/49- 07:36:03

Une autre différence entre JavaScript et C++ :
Dans le C++ tout caractère est représenté par son code ASCII et on peut soit af-
ficher directement ce code ASCII ou le caractère (graphisme) correspondant,
simplement en spécifiant le format d’affichage %d ou %u ou %i ou %c par
exemple.
Dans JavaScript :
 pour obtenir le code ASCII d’un caractère chaîne[index] on utilise la mé-

thode chaîne.charCodeAt(index), tandis que
 pour obtenir le caractère correspondant à un code ASCII (plutôt UNI-

CODE) on utilise la méthode String.fromCharCode( Unicode1, Uni-
code2, …, UnicodeN) (le mot clé String – littéral, comme tel- spécifie la
classe String possédant la méthode fromCharCode()), tandis que
 la méthode charAt(index) dans l’instruction texte.charAt() retourne le

caractère à la position index dans la chaîne texte, et permet
d’attribuer/placer un autre caractère à cette position.
 La gestion de chaînes de caractères n’accepte pas d’indexation du genre

texte[indice].
<script>
var t1=t2="DIASOLUYE"
tp5=t1.charAt(5)
// t2.charAt(5)="B" // Non autorisé,

// affectation d’une valeur à un résultat de fonction
t2[5]="B" // Passe mais sans effet
// t2.substring(6)="M" // Non autorisé,

//t2.substr(4,1)="Q" // Non autorisé,

// t2.substring(3,4)="X" // Non autorisé,

t3=t1.replace("YE", "KA")
alert( t1+" * "+tp5+" * "+t1[5]+" * "+t2[5]+" * "+t2+" * "+t3 )

</script>
lundi 11 mars 2019 -27/49- 07:36:03

affichera :
Pour remplacer un élément à une position donnée :

s="diasoluka"
alert(s+" "+replChar(s,5,"W"))
function replChar(s1,pos,ch){
s2=s1.substr(0,pos-1)
s2+=ch
s2+=s1.substring(pos)
return s2
} .
</script>
L’opérateur d’addition/concaténation (+) égare parfois :
<script language=JavaScript>
alert(
"date = " + 1000 + 900 + 45+ "\n" +
"date = " + (1000 + 900 + 45))
</script>
Affichera ->
Les parenthèses (3è ligne) résolvent parfois le problème.
On peut aussi utiliser la méthode ci-dessous :

<script language=JavaScript>
mil=1000, neufcent=900, quatcinq=45, cinq=5
alert( "l'an "+
mil + neufcent + quatcinq + cinq + "\n" +
"l'an "+
eval(mil + neufcent + quatcinq + cinq))
</script>
affichera ->
Notez la fonction eval() dans la 2è ligne d’instruction.

lundi 11 mars 2019 -28/49- 07:36:03
Si les nombres sont des values de champs (les valeurs de champs sont littérales
même s’ils sont numériques), on peut parfois être obligé d’écrire
=fâcheusement=
« "l'an "+ eval (eval(mil) + eval(neufcent) + eval(quatcinq) + eval(cinq)))
<input name='jour' value='15'><label for='j'>Jour</label>

<input name='mois' value='9'><label for='m'>Mois</label>
<input name='annee' value='2009'><label for='a'>Année</label>
<script>
J=jour.value;M=mois.value;A=annee.value;
T=J+M+A
alert(J+"+"+M+"+"+A+"="+T)
</script>
15+9+2009=1592009

<script>
T=eval(J+M+A)
document.write(J+"+"+M+"+"+A+"="+T)
</script>
15+9+2009=1592009

<script>
T = eval(eval(J)+eval(M)+eval(A))
</script>
15+9+2009=2033
Solution du problème, on peut travailler « en négatif » (Plus court et plus sûr) :

T = -(-J-M-A)
lundi 11 mars 2019 -29/49- 07:36:03

<script>
T=-(-J-M-A)
</script>
15+9+2009=2033
Observez ce qui suit : Mélangés avec des Strings dans une concaténation, les
nombres ont un comportement qui peut être imprévisible, traités comme tels
ou forcés en Strings selon le contexte :
<script language=JavaScript> Affichera

alert(1000 + 900 + 45 + " = année\n" +
1000 + 900 + 45 + " = année\n" +
parseInt(1000 + 900 + 45) + "=année\n" +
"l'an " + eval(1000 + 900 + 45))
</script>
Pour les flottants on utilise « parseFloat() ».

alert(1000 + 900 + 45 + " = année\n" +
1000 + 900 + 45 + " = année\n" +
parseInt(1000 + 900 + 45) + "=année\n" +
"*".repeat(10) +
"l'an " + eval(1000 + 900 + 45) + "\n" +

"l'an " + -(-1000 - 900 - 45) + "\n" +
"l'an " + 1*(1000 + 900 + 45) + "\n" +
"l'an " + (1000 + 900 + 45)/1 + "\n" +
"*".repeat(10) +
`${1000 + 900 + 45} = année\n` +

`l'an ${1000 + 900 + 45} = année`) ;
</script>
Mais attendez, ce n’est pas tout.

<script>
document.write("Une difficulté sied ici : " + M+A-J + " Vous avez vu ?")
lundi 11 mars 2019 -30/49- 07:36:03

</script>
NaN Vous avez vu ?
<input id='jour' value='15'><label for='j'>Jour</label>

<input id='mois' value='9'><label for='m'>Mois</label>
<input id='annee' value='2009'><label for='a'>Année</label>

let J=document.getElementById("jour").value,
M=document.getElementById("mois").value,
A=document.getElementById("annee").value;
console.log(
"Une difficulté sied ici : " +
eval(-(-M-A)-J) +
" Vous avez vu ?")
console.log(
"Une difficulté sied ici : " +
eval(eval(M)+eval(A)-J) +
" Vous avez vu ?")
</script>
Une difficulté sied ici : 2003 Vous avez vu ?

Une difficulté sied ici : 2003 Vous avez vu ?
Exercice :
Convertissez en JavaScript la partie en basic du code ci-dessus, IL DONNE in-

failliblement le jour de semaine de toute date.
<input name='jour' value='15'><label for='jour'>Jour</label>

<input name='mois' value='9'><label for='mois'>Mois</label>
<input name='annee' value='2009'><label for='annee'>Année</label><br>
<input type=button onclick="foo()" value="Donnez le jour de la semaine">
<script>
function foo(){
jsem=["Samedi","Dimanche","Lundi","Mardi","Jeudi","Vendredi","Samedi"]
j=jour.value;m=mois.value;a=annee.value; var wd
/* CONVERTISSEZ EN JS CE CODE EN BASIC
if(m<=2) then a=a-1

if(m<=2) then m=m+12
mc = INT((m+1)*(13/5))
nab = INT(5*A/4)
lundi 11 mars 2019 -31/49- 07:36:03
nsc= INT(A/100)
n4sc = INT(A/400)
base = j+mc+nab-nsc+n4sc
wd = INT((base/7 - INT(base/7)) * 7 + 0.1)
FIN BASIC */
alert(jsem[wd])
}
</script>
Bien que donc pratiquement ce qui marche avec C++ marche avec JavaScript, il
faut quand même de la prudence/attention quand on programme en JS : pour
traiter une addition de nombres comme concaténation littérale et pas comme
somme arithmétique en début d’une concaténation littérale de nombres se pré-
sentant comme évaluation arithmétique, créez un terme factice de type chaîne
vide en début de l’expression :
" "+1000+900+45 = chaîne littérale « concaténation » de nombres 100090045.

1000+900+45 = Expression arithmétique donne une somme 1945.
Voici la confusion qui peut arriver 1 quand on ne prend pas garde à la manipu-
lation des semblant de chiffres / nombres, ici dans une opération de comparai-
son. Les « value » des « input » sont littéral même quand ils sont numériques.
1
En passant, voici une autre confusion qui peut arriver, cette fois-ci dans toute programmation. Les conditions
jamais exécutées :
<script>
r=Math.round(Math.random()*1000)
if(r<500) {
document.write(r + " < " + 500 + "<br>")
if(r>=500) document.write("Jamais exécuté : " + r + " >= 500<br>")
if(r<700) document.write("N'ajoute rien à r<500 : " + r + " < 500<br>")
}
</script>
Exécution:
200 < 500

N'ajoute rien à r<500 : 200 < 500
C’est une erreur de logique : les erreurs de programmation sont souvent regrou-
pées en erreur de syntaxe ou erreur du temps de compilation (empêchent
l’exécution), erreur de logique, erreur du temps d’exécution (se soldent souvent
lundi 11 mars 2019 -32/49- 07:36:03
<input name=i1n value=10><input name=i2n value=2><br>

<script>
i1=i1n.value , i2=i2n.value
s=i1 + " > " + i2
t=i1 > i2
document.write(s + " ? " +t + " – littéral | chaîne<hr>")
i1v=eval(i1n.value) , i2v=eval(i2n.value)
s=i1v + " > " + i2v
t=i1v > i2v
document.write(s + " ? " +t + " - numérique<hr>")
</script>
Exécution :
10 2
10 > 2 ? false - littéral | chaîne
10 > 2 ? true - numérique
Les values des inputs sont littérales et ne sont pas convertibles en numériques :
<style>
input{width:165}
</style>
<input onclick="go(this)" value=25></input>

let tot=0, bcg="cyan"
function go(p){
if(p.style.background!=bcg)
tot=eval(eval(tot)+eval(p.value));
p.style.background=bcg;
p.value =
"typeof p.value ("+p.value+") = "+
typeof p.value
}
</script>
-> onclick ->
en plantage : boucle interminable | insortable, division par zéro, logarithme ou

racine carré d’un nombre négatif), erreur de conception cfr 2x2 = 2+2 = 2^2)…
lundi 11 mars 2019 -33/49- 07:36:03
Voici comment contourner la difficulté (utiliser la valeur d’un champ input
comme numérique), mais dans un très grand exemple :
<style>
input{width:25;background:lightgrey}
</style>
Critères de détermination en faveur d'une spondylarthropathie (Signes ou his-

toire de la maladie / Points)<br><br>
<input type=text id=doulnoct onclick="go(this)" onclick="go(this)" oncontext-

menu="go(this,1)" value=1>
<label for=doulnoct>1. Douleurs nocturnes lombaires ou dorsales
et/ou raideur matinale lombaire ou dorsale = 1</label><br><br>
<input type=text id=oligoarthrites on-

click="go(this)" onclick="go(this)" oncontextmenu="go(this,1)" value=2>
<label for=oligoarthrites>2. Oligoarthrites asymétriques = 2</label><br><br>
<input type=text id=doulfessp onclick="go(this)" onclick="go(this)" oncontext-

<label for=doulfessp>3. Douleurs fessières sans précision = 1</label><br><br>
<input type=text id=doulfesb onclick="go(this)" onclick="go(this)" oncontext-

<label for=doulfesb>4. Douleurs fessières à bascule = 2</label><br><br>
<input type=text id=doigtsauc onclick="go(this)" onclick="go(this)" oncontext-

<label for=doigtsauc>5. Doigt ou orteil en saucisse = 2</label><br><br>
<input type=text id=talalgies onclick="go(this)" onclick="go(this)" oncontext-

<label for=talalgies>6. Talalgies ou toute autre enthèsopa-
thie = 2</label><br><br>
<input type=text id=iritis onclick="go(this)" onclick="go(this)" oncontext-

<label for=iritis>7- Iritis = 2</label><br><br>
<input type=text id=uretng onclick="go(this)" onclick="go(this)" oncontext-

<label for=uretng>8- Urethrites non gonococciques ou cervicite moins d'un mois
avant le début d'une arthrite = 1</label><br><br>
<input type=text id=diarm1m onclick="go(this)" onclick="go(this)" oncontext-

<label for=diarm1m>9-
Diarrhées moins d'un mois avant une arthrite = 1</label><br><br>
<input type=text id=atcdpsor onclick="go(this)" onclick="go(this)" oncontext-

<label for=atcdpsor>10-Présence ou ATCD de psoriasis et/ou de balanite signes
radiologiques = 2</label><br><br>
lundi 11 mars 2019 -34/49- 07:36:03

<input type=text id=sacroiliite onclick="go(this)" onclick="go(this)" oncon-
textmenu="go(this,1)" value=3>
<label for=sacroiliite>11-
Sacroiliite (stade >2 si bilatérale ou stade 3 si unilatérale Terrain géné-
tique = 3</label><br><br>
<input type=text id=atcdf onclick="go(this)" onclick="go(this)" oncontext-

<label for=atcdf>12-Présence de l'antigène B27 et/ou ATCD familiaux de pel-
vispondylite, de syndrome de Reiter, de psoriasis, d'uvéite, d'entérocolo-
pathies chroniques = 2</label><br><br>
Sensibilité au traitement<br><br>
<input type=text id=amel48hains onclick="go(this)" onclick="go(this)" oncon-

textmenu="go(this,1)" value=2>
<label for=amel48hains>13-Amélioration en 48h des douleurs par AINS et/ou re-
chute rapide (48h) des douleurs à leur arrêt = 2</label><br><br>
<hr>Le malade est déclaré comme ayant une spondylarthropathie

Si la somme des points est égale ou supérieure à 6.<br><br>
<div style="background:#864DE5;color:yellow;padding:10">SPONDYLARTHRITE ?</div>

<div id=total style="border:thin solid;width:350;padding:10"></div>

alert("Clic pour Ajouter,\nclic-droit pour Annuler");
let t, tot=0, bcg="orange"
function go(p,q){
let inc;
if((q && p.style.background) || !p.style.background){
if(q){
if(p.style.background.startsWith(bcg)) inc =-p.value;
else inc=0;
}
else if(!p.style.background) {
inc = p.value;
}
tot = 1*tot + 1*inc;
// La solution sied ci-haut!
if(q) p.style.background="";
else p.style.background=bcg;
t=tot+" / 6 ("+(tot/6*100).toFixed(2)+" %)";

if(tot==6){
total.innerHTML=t+" = JUSTE POSITIF";
total.style.background="orange";
}
else if(tot>6) {
total.innerHTML = t+
' = <span="font-weight:600">PLUS QUE POSITIF</span>';
total.style.background="red";
}
else {
total.innerHTML=t+" = NÉGATIF";
lundi 11 mars 2019 -35/49- 07:36:03
total.style.background="lime";
}
}
}
</script>
Exécution :
lundi 11 mars 2019 -36/49- 07:36:03

lundi 11 mars 2019 -37/49- 07:36:03

Dans JavaScript, la gestion des chaînes de caractères est même enrichie, e.g.
l’affichage automatique d’un nombre décimal dans une base quelconque :

let tmp="";
var n = Math.round(Math.random()*1000);
for(let k=2;k<=22;k++){
tmp+="| Base" +
k.toString().padStart(3," ") +
": " +
n +
"d= " +
n.toString(k).padStart(10," ");
if((!((k-1) %3)) && k!=0) tmp+="\n";

}
console.log(tmp);
</script>
Exécution:
Puisqu’on y est, voici quelques méthodes de l’objet String:
anchor , big , blink , bold , charAt , charCodeAt , concat (String)

, fixed , fontcolor , fontsize , fromCharCode , indexOf , italics ,
lastIndexOf , link , match , replace , search , slice (String) ,
lundi 11 mars 2019 -38/49- 07:36:03

small , split , strike , sub , substr , substring , sup , toLower-
Case , toSource , toString , toUpperCase , valueOf
JS est un langage POO et orienté Internet pour dynamiser (rendre interactives)

les pages Web, en manipulant (jouant sur) les éléments (balises) HTML.
Exemple de gestion Internet :

<script>
document.write(encodeURIComponent("http://www.pathurl.ext") + "<br>")
document.write(decodeURIComponent("http%3A%2F%2Fwww.pathurl.ext"))
</script>
Exécution :
http%3A%2F%2Fwww.pathurl.ext
http://www.pathurl.ext
Exemple de gestion de balise HTML :
<body>
<div id=d></div> <input name=n>
</body>
<script>
document.getElementById("d").innerHTML= "1. getElementById dans div"
document.write("<br>2. Le texte dans div est : « " +
document.getElementById("d").innerText + " »")
n.value="3. Affectation dans input"
i='innerText'
document.write("<br>4. « "+ d[i] +" »")
if(confirm("Go")) d.innerHTML="5. Nouveau texte dans div"
</script>
</body>
Exécution :
lundi 11 mars 2019 -39/49- 07:36:03

Exemple de gestion de style avec JavaScript & fonction dans une fonction :
<p id="idn">Test</p> <p id="idn">Test</p>

<script> <script>
blink = function(e,t){ function blink(e,t){
setInterval( setInterval(
function(){ function(){
var s = e.style, var s = e.style,
v='visibility', v='visibility',
d='visible', d='visible',
h='hidden'; ou h='hidden';
s[v] = (s[v]==h?d:h); s[v] = (s[v]==h?d:h);
}, },
(t||500)); (t||500));
} }
blink(idn,300) blink(idn,300)
</script> </script>
<div id="iT">Texte Fugace</div>
<SCRIPT>
function f_chge(idEl,p){
el=document.getElementById(idEl).style
if(p==1) el.visibility = "hidden"
if(p==0) el.visibility = "visible"
}
</SCRIPT>
<input type=button onclick=f_chge("iT",0) value="Afficher">

<input type=button onclick=f_chge("iT",1) value="Cacher">
En passant, voici la méthode getElementsByName (notez le « s »)
<SCRIPT>
function f_getElementsByName(){
// Retourne une COLLECTION de 3 éléments INPUT.
var aInput=document. getElementsByName ("firstName
");
alert(aInput.length+" * "+aInput[2].checked)
}
</SCRIPT>
<INPUT TYPE="radio" NAME="firstName">

<INPUT TYPE="button" VALUE="Get Names"
onclick="f_getElementsByName()">
Un autre exemple :
lundi 11 mars 2019 -40/49- 07:36:03

<head>
var counter=0;
var t;
function finit(){
document.getElementById('i').value="Continuer";
stopClock()
}
function stopClock(){
document.getElementById('txt').value=counter++;
t=setTimeout("stopClock()",1000);
}
function stopCount(){ clearTimeout(t); }

</script>
</head>
<body>
<form>
<input type="button" value="Démarrer" onClick="finit()" id='i'>
<br><input type="text" id="txt"><br>
<input type="button" value="Pause" onClick="stopCount()">
</form>
</body>
Si « window.open » commande la création d’une nouvelle fenêtre, les propriétés

ci-dessous permettent aussi bien de connaître l’URL de la page que de rempla-
cer la page en cours par celle de l’opérande de droite de l’affectation, et rem-
place la nouvelle page dans la fenêtre en cours.
window.location.href window.location
location.href Location
document.URL (2)
Exemple de gestion directe d’URL avec JavaScript :
2
Signalons que la propriété « document.lastModified » donne la date de la dernière sauvegarde.
lundi 11 mars 2019 -41/49- 07:36:03
<script>
alert("«"+
document.URL+"»");
</script>
<script>
b=" »" + "<br>"
tmp =" 1. document.URL = « "+ document.URL +b
// tmp =" 2. location.URL = « "+ location.URL +b
// tmp =" 3. window.URL = « "+ window.URL +b
tmp+=" 4. document.href = « "+ document.href +b
tmp+=" 5. location.href = « "+ location.href +b
tmp+=" 6. window.href = « "+ window.href +b
tmp+=" 7. document.location = « "+ document.location +b
tmp+=" 8. location.location = « "+ location.location +b
tmp+=" 9. window.location = « "+ window.location +b
tmp+="10. document.location.href = « "+ document.location.href +b
// tmp+="11. location.location.href=« "+ location.location.href +b
tmp+="12. window.location.href = « "+ window.location.href +b
tmp+="13. document = « "+ document +b
tmp+="14. location = « "+ location +b
tmp+="15. window = « "+ window +b
document.write(tmp);
</script>
Exécution :
1. document.URL = « file://D:\DADET\dummy.htm »
4. document.href = « undefined »
5. location.href = « file:///D:/DADET/dummy.htm »
6. window.href = « undefined »
7. document.location = « file:///D:/DADET/dummy.htm »
8. location.location = « undefined »
9. window.location = « file:///D:/DADET/dummy.htm »
10. document.location.href = « file:///D:/DADET/dummy.htm »
12. window.location.href = « file:///D:/DADET/dummy.htm »
13. document = « [object] »
14. location = « file:///D:/DADET/dummy.htm »
15. window = « [object] »
Ces propriétés utilisées comme membre de gauche remplacent la fenêtre en

cours par l’URL spécifié par le membre de droite :
window.location="diasmirehfbc.html".
Repris aussi bien comme opérande de gauche que de droite, elles permettent de
rafraîchir (recharger) la page : document.URL = location.
lundi 11 mars 2019 -42/49- 07:36:03
D’autres moyens pour rafraîchir la page :
history.go(0)
location.reload()
Autre exemple (illustre aussi l’usage du sélecteur de style ID selectors) : sélec-

tionner dans une liste d’options la page à ouvrir.
<style>
#menu { background:navy;color:lime;text-transform:capitalize }
</style>
<body>
<form name="f1n" id="f1i">
<select id="menu" onchange="ftest()">
<option>--faites un choix--</option>
<option value="http://www.Mercedes.com">Mercedes</option>
<option value="http://www.Ford.com">Ford</option>
<option value="http://www.Ferari.com">BMW</option>
</select>
</body>
<script>
function ftest() {
window.location=document.getElementById("menu").value;
}
</script>
Naviguer dans les pages parcourues (historique) : history.go( hParam )
hParam : paramètre requis, entier ou string. Un entier indique la position rela-

tive de l’URL dans la liste de l’historique, tandis qu’un string indique un URL
exact dans la liste de l’History.
Pour connaître si une page a été ouverte avec référence à un signet (signe nu-
mérique #), utilisez hash.
<script>
function f_Hash() {
nd=window.open("url#signet")
if(nd.document.location.hash!="")
alert(nd.document.location.hash)
}
onload=f_Hash
</script>
lundi 11 mars 2019 -43/49- 07:36:03

Exemple2
<script>
nd=window.open("http://url.dom")
nd.location.hash="signet"
</script>
C’est l’équivalent de nd=window.open("http://url.dom#signet") à l’ouverture,

ou de cliquer sur <a href=location#signet>signet</a> dans une page ouverte.
Exemple3
<SCRIPT>
document.write("<a name='signet1'></a>")
for(k=0;k<300;k++) document.write("signet1 ")
for(k=0;k<300;k++) document.write("signet2 ")
document.write("<a name='signet2'></a>")
location.hash="signet2"
alert("Nb d’Or (1,6180339887498948482045868343656)= " + (1+Math.sqrt(5))/2)
location.hash="signet1"
</SCRIPT>
Exemple4
<script>
function f_Hash(s) {
var nd=window.open("hash.html");
nd.location.hash = s;
}
</script>
<h3>hash pour signet</h3>

<p>Cliquer un bouton ouvre son lien ds une nvelle fenêtre</p>
<input type="button" value="1" onclick="f_Hash('signet1')">
La commande pour créer le lien hypertexte est
<a href= url_cible> </a> (la cible est un fichier)
lundi 11 mars 2019 -44/49- 07:36:03

ou
<a href= url_cible#place> </a> (la cible est un signet dans un fichier)
ou
<a href= #place> </a> (la cible est un signet dans le même fichier)
La nature de la cible peut être :

none , http:// , https:// , file:// , ftp:// , gopher:// , afs:// , nntp:// ,
telnet:// , wais:// , mailto: , news: , newsrc: ,...
La dynamisation de l’affichage de page :
On peut définir l’effet de transition de page ou de site (la façon dont une page
ou un site doit s’ouvrir et/ou se fermer), selon la syntaxe suivante.
Fusion (Blend) <meta http-equiv="Page-Enter" con-

tent="blendTrans(Duration=2)">
Stores Verticaux (Blinds vertical) <meta http-equiv="Page-Exit" con-
tent="revealTrans(Duration=2,Transition=8)">
Stores Horizontaux (Blinds Horizontal) <meta http-equiv="Site-Exit" con-
Rectangle extérieur (Box In) <meta http-equiv="" con-
Rectangle intérieur (Box Out) <meta http-equiv="Page-Enter" con-
Cercle Extérieur (Circle In) <meta http-equiv="Page-Exit" con-
Cercle Intérieur (Circle Out) <meta http-equiv="Site-Exit" con-
Damier Horizontal (Checkerboard Across) <meta http-equiv="" con-
Damier Vertical (Checkerboard Down) <meta http-equiv="Page-Enter" con-
Balayage Vertical Extérieur (Split Vertical <meta http-equiv="Page-Exit" con-
In)
Balayage Vertical Intérieur (Split Vertical <meta http-equiv="Site-Exit" con-
Out)
Balayage Horizontal Extérieur (Split Hori- <meta http-equiv="Site-Exit" con-
zontal In)
Balayage Horizontal Extérieur (Split Hori- <meta http-equiv="Site-Enter" con-
zontal Out)
Bandes coin supér droit (Strips Left Down) <meta http-equiv="Page-Enter" con-
Bandes coin infér droit (Strips Left Up) <meta http-equiv="Site-Exit" con-
Bandes coin supér gauche (Strips Right <meta http-equiv="" con-
Down)
Bandes coin infér gauche (Strips Right Up) <meta http-equiv="Page-Enter" con-
Dissolution Aléatoire (Random Disolve) <meta http-equiv="Page-Exit" con-
Barres Horizontales Aléatoires (Random Bars <meta http-equiv="Page-Enter" con-
tent="revealTrans(Duration=1.0,Transition=21)"
Vertical) >
lundi 11 mars 2019 -45/49- 07:36:03
Barres Verticales Aléatoires (Random Bars <meta http-equiv="Page-Enter" con-
tent="revealTrans(Duration=1.0,Transition=22)"
Horizontal) >
Aléatoire (Random) <meta http-equiv="Site-Exit" con-
Balayage Haut (Wipe Up) <meta http-equiv="" con-
Balayage Haut (Wipe Down) <meta http-equiv="Page-Enter" con-
Balayage Gauche (Wipe Left) <meta http-equiv="Site-Exit" con-
Balayage Droite (Wipe Right) <meta http-equiv="Page-Enter" con-
La gestion des cookies :
<script>
function Set_Cookie(
name, value, expires, path, domain, secure
) {
// set time, en millisecondes

var today = new Date();
today.setTime( today.getTime() );
if ( expires ) {
expires = expires * 1000 * 60 * 60 * 24;
}
var expires_date = new Date( today.getTime() + (expires) );
document.cookie = name + "=" +escape( value ) +

( ( expires ) ? "; expires=" + expires_date.toGMTString() : "" ) +
( ( path ) ? "; path=" + path : "" ) +
( ( domain ) ? "; domain=" + domain : "" ) +
( ( secure ) ? "; secure" : "" );
}
function getCookieVal (offset) {

var endstr = document.cookie.indexOf (";" , offset);
if (endstr == -1)
endstr = document.cookie.length;
return unescape(document.cookie.substring(offset , endstr));
}
function GetCookie (name) {

var arg = name + "=";
var alen = arg.length;
var clen = document.cookie.length;
var i = 0;
while (i < clen) {
var j = i + alen;
if (document.cookie.substring(i, j) == arg)
return getCookieVal (j);
i = document.cookie.indexOf(" ", i) + 1;
if (i == 0) break;
lundi 11 mars 2019 -46/49- 07:36:03
}
return null;
}
</script>
lundi 11 mars 2019 -47/49- 07:36:03

Kinshasa, le lundi 11 mars 2019 - 7:36:03 AM
Mots-clés :
javas-
cript,map,ecmascript,regexp,arrays,string,getElementById,getElem
entsBy-
Name,attributs,lastChild,createElement,insertAdjacentElement,first
Child,fontVariant,selectedIndex,options,object,typeof,try-
catch,anchor,Array, Boolean, Date, Function, Global, Math, Num-
ber, Object, RegExp, Regular Expression,string literal
DIASOLUKA Nz. 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
diasfb@mail2world.com
Autre Lecture :
https://www.scribd.com/document/374738470/Le-Plus-Grand-Secret-de-
La-Creation
D’autres publications pouvant aussi intéresser :
• https://www.scribd.com/document/377036251/Le-Dosage-Des-Medicaments-en-Cac-Cas
• https://www.scribd.com/document/377035454/Le-Hasard-Des-Thermometres-Non-contact-a-Infrarouge
• https://www.scribd.com/document/376222482/Petite-Introduction-Aux-Fonctions-JavaScript
• https://www.scribd.com/document/376221919/La-Foi-en-Jesus-Christ-Pour-Quoi-Faire
lundi 11 mars 2019 -48/49- 07:36:03
• https://www.scribd.com/document/375689778/Lacuite-visuelle-angulaire
• https://www.scribd.com/document/375349851/La-variable-This
• https://www.scribd.com/document/375024162/Fonctions-Imbriquees-en-JS
• https://www.scribd.com/document/374789297/Format-Interne-Des-Objets-JavaScript
• https://www.scribd.com/document/374788758/Iterations-en-JavaScript
• https://www.scribd.com/document/374738470/Le-Plus-Grand-Secret-de-La-Creation
• https://www.scribd.com/document/374597969/Nouvelle-Formule-d-IMC-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-Des-Reflexes-Pupillomoteurs
• https://www.scribd.com/document/321168468/Renseignements-Id-et-Anthropometriques
• https://www.scribd.com/document/320856721/Emission-31-Jul-2016
• https://www.scribd.com/document/318182982/Complication-Visuelle-du-Traitement-de-La-Malaria
• https://www.scribd.com/document/318180637/Rapport-Entre-Oxymetrie-Et-Type-Respiration
• https://www.scribd.com/document/315746265/Classification-Des-Medicaments
• https://www.scribd.com/document/315745909/Incongruences-Heresies-et-Heterodoxies-de-la-Notion-de-
Laboratoire
• https://www.scribd.com/document/315745725/Rapport-Entre-Oxymetrie-Et-Type-Respiration
lundi 11 mars 2019 -49/49- 07:36:03

Javascript & Algorithmique

Transféré par

Droits d'auteur :

Formats disponibles

Javascript & Algorithmique

Transféré par

Informations du document

Copyright

Formats disponibles

Partager ce document

Partager ou intégrer le document

Options de partage

Avez-vous trouvé ce document utile ?

Ce contenu est-il inapproprié ?

Droits d'auteur :

Formats disponibles

Javascript & Algorithmique

Transféré par

Droits d'auteur :

Formats disponibles

JAVASCRIPT ET

JavaScript est le langage de choix pour le développement de pages Web dynamiques

HTML DOM définit un moyen standard pour accéder à, et manipuler un docu-

1. dans l’ardoise javascript d’un navigateur, soit

2. dans un fichier [d’extension] *.html ou *.js avec un éditeur de texte gratuit

lundi 11 mars 2019 -2/49- 07:36:03

Certains de ces éditeurs excellent par leur aisance à :

1. Manipuler les très gros fichiers de plus de 2 mégas, ou sont

2. Pourvu d’un visualiseur de la miniature de l’ensemble du fichier sur le bord

3. pourvus de la fonctionnalité tri (parfois avec suppression des doublons), ou

4. peuvent supprimer les doublons sans tri, ou permettent d’ouvrir plusieurs

5. permettent la recherche [incrémentale] | remplacement dans des fichiers

6. peuvent écraser (écrire sur) les fichiers en lecture seule, ou

7. permettent les macros, ou

lundi 11 mars 2019 -3/49- 07:36:03

9. ferment automatiquement les balises ou mettent en surbrillance les paires de

10. fonctionnalité « auto complétion », d’autres

11. proposent automatiquement une liste d’attributs et leurs valeurs pour la

12. coloration syntactique, ou

13. transmettre la coloration syntactique dans un traitement de texte lors

14. d’autres y transmettent aussi la numérotation des lignes lors du même

15. la rapidité à se charger soi-même et

18. prévisualisation (la saisie plus véloce se fait en mode texte)…

19. Configuration avec le fichier de configuration universelle « EditorCon-

Tous ou la plupart sont téléchargeables sur Internet et gratuits : freeware,

lundi 11 mars 2019 -4/49- 07:36:03

Amusons-nous donc un peu avec la mathématique et le JavaScript (ou

<script> Carré de 1 = 1 (1)

c = Somme des n premiers nombres entiers impairs,

Un programme qui vérifie que la somme de n carrés parfaits consécutifs est

lundi 11 mars 2019 -5/49- 07:36:03

Retrancher 1 d’un carré parfait impair donne un multiple de 8.

lundi 11 mars 2019 -6/49- 07:36:03

lundi 11 mars 2019 -7/49- 07:36:03

Comme le C, JS est casse sensible : var1 != Var1 != vAr1.

Le nom de variable (ou de fonction ou de paramètre) peut avoir n’importe

Dans une expression arithmétique à plusieurs types de données, les nombres

Le type de données Number : integer (entier) et floating-point numbers).

Attention avec les expressions booléennes : si la constante prédéfinie false

D’autres différences entre JS et C :

*La fonction main(), les arrays (tableaux) multi-dimensionnelles ne sont pas

Comment contourner la difficulté :

On peut aussi utiliser des propriétés créées à la volée :

lundi 11 mars 2019 -10/49- 07:36:03

Encore d’autres différences : *les fonctions ne surchargent pas, *les structs

 25/07/2009 13:30:18 (Opera)

Elle définit une/des nouvelle(s) propriété(s) pour un objet, la nouvelle propriété

Syntaxe : typeObjet.prototype.newProperty = valeur

 typeObjet est le nom d'un constructeur spécifié par le type de l'objet.

// Ajout d'une propriété à

lundi 11 mars 2019 -12/49- 07:36:03

lundi 11 mars 2019 -13/49- 07:36:03

Juste le définir comme une fonction (en fait constructeur de l’objet)

Le constructeur MakeArray() crée et initialise une array :

<script> -1. «undefined»

Pour connaître si un objet est un prototype d’un autre :

Pour connaître si un objet possède une propriété :

lundi 11 mars 2019 -16/49- 07:36:03

Gestion de l’élément (balise HTML) « image » dans JS

// recup des infos

2. dans un fichier [d’extension] .html ou .js avec un éditeur de texte gratuit

Encore d’autres différences : les fonctions ne surchargent pas, les structs