-
7/28/2019 PAC1_PW.pdf
1/14
JAVASCRIPT:
ESTRUCTURES BSIQUES
PAC1
rau
multimdia
program
aciweb
Jaume Villarreal Quintana
-
7/28/2019 PAC1_PW.pdf
2/14
-
7/28/2019 PAC1_PW.pdf
3/14
PROGRAMACI WEB PAC1
Grau en Multimdia
- 3 -
OR - ||
Operador que, de manera anloga a AND, es pot aplicar a dos operands
o ms. La seva funci es basa en comprovar que alguna de les compa-
racions que cont sn certes. En cas que totes siguin falses retornar
false.
Exemple
Volem controlar el ux dun algorisme amb una estructura condi-
cional. Aquesta estructura permetr executar si una de les dues
sentncies que cont s certa. Per fer-ho caldr emprar un ope-
rador OR: if(x==1 || y
-
7/28/2019 PAC1_PW.pdf
4/14
PROGRAMACI WEB PAC1
Grau en Multimdia
- 4 -
JavaScript t disponible dues estructures de control condi-
cionals. Cadascuna daquestes t unes propietats que les fan
ms apropiades per a distintes necessitats. Explica aquestes
caracterstiques amb un exemple ds de cadascuna.
Estructures condicionals IF
Les estructures condicionals controlades per un IF avaluen una
condici donada per poder realitzar lacci que t adjudicada.
Les seves possibilitats sn mplies ja que alhora que cont unaacci en cas que es compleixi la condici, tamb permet establir
accions en el cas en qu aquestes condicions no es compleixin.
Aix saconsegueix amb lestructura IF...ELSE.
En aquest sentit, lestructura permet introduir ms condicionals
en lhipottic cas que el primer condicional es compleixi, fet
que permet avaluar parts de lalgorisme de manera descendent,
arribant a lacci establerta noms si es compleixen una sria
de condicions encadenades. Aix saconsegueix amb lestructura
IF...ELSE IF...ELSE.
EXEMPLE
var num = document.getElementById(numInput).value;
var play = true;if(play){
if(num>=5 && num
-
7/28/2019 PAC1_PW.pdf
5/14
PROGRAMACI WEB PAC1
Grau en Multimdia
- 5 -
} else if(num==4){
alert(B);
} else if(num==5){
alert(MOLT B);
}play=false;
}
else{
alert(Recarrega la pgina i introdueix una altra nota.);
}
Estructures condicionals SWITCH
Les estructures condicionals controlades amb SWITCH permeten ava-
luar una variable amb una srie de valors, de manera que tan sols
sexecutaran les sentncies contingudes en el valor que sigui coinci-
dent amb la variable establerta com a condici.
Els diferents valors que cont lestructura es declaren amb CASE i
saturen amb BREAK un cop han estat executades. Aix assegura la
resta de sentncies contingudes en lestructura no sexecutaran. La
sintaxi bsica s la segent:
switch (variable){
case valor1 {...}
break;
case valor2 {...}
break;......................................
case valorN {...}
break;
}
-
7/28/2019 PAC1_PW.pdf
6/14
PROGRAMACI WEB PAC1
Grau en Multimdia
- 6 -
EXEMPLE
var num = document.getElementById(numInput).value;
switch (num){
case 1{alert(NECESSITA MILLORAR);
}
break;
case 2{
alert(NECESSITA AJUDA);
}
break;
case 3{
alert(ACCEPTABLE);
}
break;
case 4{
alert(B);
}
break;
case 5{
alert(MOLT B);
}
break;
}
-
7/28/2019 PAC1_PW.pdf
7/14
La sentncia with pot ajudar a simplicar el codi JavaScript
en certes estructures. Identica amb dos exemples dife-
rents aquesta possibilitat.
PROGRAMACI WEB PAC1
Grau en Multimdia
- 7 -
Tal i com es descriu en lenunciat, la sentncia with permet agru-
par una srie de sentncies que facin referncia a un mateix
objecte, fet que permet simplicar el codi.
EXEMPLES
Volem adjudicar a un objecte tota una srie despecicacions
destil. Enlloc dassignar-los de manera individual els assignem
tots alhora emprant with.
with(document.getElementById(inputForm).style){
width: 20em;
border: 1px solid #999;
margin: 1em auto;
padding: .5em ;
font-size: .85em;
background-color: #F2F2F2;
}
Volem adjudicar text de manera dinmica a un objecte alhora
que el fem visible.
with(document.getElementById(inputForm)){
style.visibility=visible;innerHTML=El contenidor ara s visible;
}
-
7/28/2019 PAC1_PW.pdf
8/14
PROGRAMACI WEB PAC1
Grau en Multimdia
- 8 -
Respon cert o fals a les segents armacions sobre les fun-
cions en el llenguatge JavaScript.
Una funci pot tenir varis parmetres distints. CERT
Una funci pot tenir varis valors de retorn. FALS
Una funci pot contenir diverses setncies de retorn, per noms
retornar un valor, tal i com es pot observar en el segent exemple:
function nombreMenor(n1,n2){
if(num1
-
7/28/2019 PAC1_PW.pdf
9/14
PROGRAMACI WEB PAC1
Grau en Multimdia
- 9 -
Escriu un algorisme en JavaScript que donat un nmero
dentrada, retorni els nombres primers menors al passat
com a parmetre dentrada.
PW: PAC1-ex.5
var mainArray = new Array();
var play=true;
function mainFunction(numInput){
var num = parseInt(numInput.value);
var counter=0;
var text = Els nombres primers ms petits que + num + sn: +
+2 3 ;var textB = Els nombre primer ms petits que + num + s: +
+2;
if(play){
if(num==1){
alert(Cal introduir un nombre igual i ms gran que \2\.);
}
else if(num==2){alert(El 2 no t cap nombre primer ms petit.);
}else if(num==3){
play=false;
with(document.getElementById(caixaText)){
style.visibility=visible;
innerHTML=textB;
}
-
7/28/2019 PAC1_PW.pdf
10/14
PROGRAMACI WEB PAC1
Grau en Multimdia
- 10 -
}else if(num==4 || num==5){
play=false;
with(document.getElementById(caixaText)){
style.visibility=visible;
innerHTML=text;}
}
else{
play=false;
for(i=5; i
-
7/28/2019 PAC1_PW.pdf
11/14
PROGRAMACI WEB PAC1
Grau en Multimdia
- 11 -
Donat un nmero dentrada, crea un algoritme que retorni els nombres primers
menors al passat com a parmetre dentrada.
-
7/28/2019 PAC1_PW.pdf
12/14
PROGRAMACI WEB PAC1
Grau en Multimdia
- 12 -
Desenvolupeu una funci recursiva que retorni cert o fals
si una paraula s palndroma (la paraula sintroduir mi-
tjanant un prompt). Heu dexplicar lalgorisme utilitzat i
dibuixar la pila de les crides per una paraula de 5 lletres.
Per desenvolupar aquest algorisme sha creat la funci Palndrom
amb els parmetres (cadena, posLeft, posRight), on:
cadena recull la cadena de text introduda a la nestra modal;
posLeft s un valor numric que marcar la posici inicial;
posRigth s un valor numric que marcar la posici nal.
ALGORISME
function Palindrom(cadena, posLeft, posRight){
/*===========================La primera sentncia estableix un criteri condicional que controla el nal de la funci, evitant que sexecutide manera indenida. En aquest moment comprova la primera condici: cada cop que la funci es crida aella mateixa incrementa el valor posicional de lesquerra i decrementa el de la dreta. Si el valor de posLefts ms gran que el valor de posRight sha recorregut de manera recursiva i satisfactria tota la cadena i la
funci nalitza.===========================*/ if(posLeft>=posRight){
return true;}
/*===========================Si la primera condici no es compleix accedim a un altre condicional. Si el valor de la cadena a posLeft sigual que el valor de la cadena a posRight la funci es crida a ella mateixa variant el valor dels parmetresnumrics. Daquesta manera torna a iniciar el procs. Si aquesta condici no es compleix la paraula no s un
palndrom i retorna false.===========================*/else{
if(cadena[posLeft]==cadena[posRight]){
return Palindrom(cadena, posLeft+1, posRight-1);
}
else{
return false;
}}
}
-
7/28/2019 PAC1_PW.pdf
13/14
PROGRAMACI WEB PAC1
Grau en Multimdia
- 13 -
PILA DE CRIDES PER A LA PARAULA RADAR
if(posLeft>=posRight){return true;}
Comprova que el valor posicional de lesquerra sigui ms gran
o igual que el de la dreta. En aquest cas els parmetres con-
tenen els valors 0 i 4 respectivament. No es compleix la condi-
ci.
else{
if(cadena[posLeft]==cadena[posRight]){
return Palindrom(cadena, posLeft+1, pos-
Right-1);
}else{
return false;
}
}
Comprova que el valor inicial de cadena[0] sigui igual que el
valor de cadena[4]. En aquest cas el valor inicial de la cade-
na s R i el valor nal de la cadena s R.
Com que la condici es compleix la funci es crida a si ma-
teixa modicant els valors dels parmetres, que passen de ser
0 i 4 a ser 1 i 3.
if(posLeft>=posRight){return true;}
Comprova que el valor posicional de lesquerra sigui ms gran
o igual que el de la dreta. En aquest pas els parmetres con-
tenen els valors 1 i 3 respectivament. No es compleix la condi-
ci.
-
7/28/2019 PAC1_PW.pdf
14/14
PROGRAMACI WEB PAC1
- 14 -
else{
if(cadena[posLeft]==cadena[posRight]){
return Palindrom(cadena, posLeft+1, pos-
Right-1);
}
else{
return false;
}
}
Comprova que el valor inicial de cadena[1] sigui igual que el
valor de cadena[3]. En aquest cas el valor inicial de la cade-
na s A i el valor nal de la cadena s A.
Com que la condici es compleix la funci es crida a si ma-
teixa modicant els valors dels parmetres, qua passen de ser
1 i 3 a ser 2 i 2.
if(posLeft>=posRight){return true;}
Comprova que el valor posicional de lesquerra sigui ms gran
o igual que el de la dreta. En aquest pas els parmetres conte-nen els valors 2 i 2 respectivament. Ara es compleix la con-
dici i la funci retorna true, doncs la paraula RADAR s un
palndrom.
** Cal aclarir en aquest punt que la comparaci del condicional
tamb hauria pogut ser (posLeft>posrRight), tot i que en aquest
cas la funci shauria executat una vegada ms. Aix passa per-
qu les paraules amb una quantitat senar de lletres tindran sem-
pre una lletra central que no ser necessari comparar. Aix es pot
optimitzar el rendiment de la funci.