En tots els llenguatges de programació existeixen les variables que ens serveixen per guardar algun valor en una variable. Per exemple, aplicant-ho a un cas real, el meu nom és Vicent i el meu cognom és Forner. Ací tenim 2 variables, que són nom i cognom i que tenen un valor que pot anar canviant, depenent de la persona a la que faça referència. Anem a veure com s'utilitza en JS:
var nom = 'Vicent';
var cognom = 'Forner';
document.write(nom);
Ara, hem de tenir en compte moltes coses:
Per declarar una variable utilitzem var seguit del nom de la variable, en aquest cas nom i cognom.
Per assignar un valor a la variable utilitzem el símbol d'igual i després el valor d'eixa variable. En aquestos casos com és text es posa entre cometes.
Per últim, a l'hora de mostrar el contingut, en lloc de posar nom entre cometes, ho hem posat sense, perquè és una variable i no un text.
Ara prova a mostrar el nom i el cognom seguit d'un espai (pensa que l'espai és un text buit):
document.write(nom + ' ' + cognom);
Exercici: Fes un programa en el que crees 3 variables, una el teu nom, una el teu cognom i l'altra la teua edat. Després es mostrarà en la primera línia el teu nom i el teu cognom i en la segona línia apareixerà el text 'Tinc ', la teua edat i després ' anys'. Recorda que per separar les línies posavem un document.write('<br>');
Anem a fer diferents operacions amb números:
+: suma
-: resta
*: multiplicació
**: potències
/: divisió
%: obtindre el residu d'una divisió (10%3 mostrarà el residu 1)
alert(3 + 2);
alert(5 - 2);
alert(3 * 2);
alert(3 ** 2);
alert(8 / 5);
alert(8 % 5);
...
var num1 = 8;
var num2 = 3;
var suma = num1 + num2;
alert(suma);
Es poden avaluar condicions i ens retornarà si és compleix (true) o sinó (false). Recorda que aquestos dos valors són booleans. Dins de les comparacions podem utilitzar els següents:
<: menor que
<=: menor o igual que
>: major que
>=: major o igual que
==: igual
!=: diferent
A més, podem combinar comparacions utilitzant els connectors and (&&) i or (||). && serveix per determinar que totes condicions s'han de complir i || serveix per determinar que una de les condicions es complisca.
var num1 = 8;
var num2 = 3;
alert(num1 < num2); //Donarà falses
var text1 = "hola";
var text2 = "hola";
alert(text1 == text2); //Donarà true
alert(text1 == 'adeu'); //Donarà false
A les variables una vegada siguen asignades, se lis pot canviar el valor, però no fa falta tornar a afegir el var. A més, es podrà canviar perquè valga números, text, booleans, etc.
var num1 = 7;
alert(num1); //Donarà 7
num1 = 3 + 2;
alert(num1); //Donarà 5
num1 = num1 + 1;
alert(num1); //Donarà 6
num1 = 'hola';
alert(num1); //Donarà hola
num1 = 8 < 3;
alert(num1); //Donarà false
Sobre un text podem obtindre dades que ens poden ser útils a l'hora de fer un programa. Algunes d'aquestes opcions són:
Obtindre la longitud del text
Obtindre una part del text
Saber si el text conté alguna lletra o caràcter
Obtindre la posició d'una lletra
document.write('<h3>Operacions amb text</h3>');
var text = prompt('Indica un text');
document.write('El text és: <b>', text, '</b><br>');
/* LONGITUD */
var longitud = text.length;
document.write('La longitud és: ', longitud);
document.write('<br>');
document.write('<h3>Operacions amb text</h3>');
var text = prompt('Indica un text');
document.write('El text és: <b>', text, '</b><br>');
/* PART DEL TEXT */
/*
substring utilitza 2 paràmetres dins del parèntesi, la posició d'inici i
la posició final de la part que volem traure
Sinó posem el final, agafarà fins al final
El final agafarà fins a eixa posició però eixa no la agafa
L'inici és contant que la primera posició és el 0
*/
var part_del_text = text.substring(0, 4);
document.write('La part extreta amb substring(0, 4) és: ', part_del_text, '<br>');
part_del_text = text.substring(3, 8);
document.write('La part extreta amb substring(3, 8) és: ', part_del_text, '<br>');
part_del_text = text.substring(5);
document.write('La part extreta amb substring(5) és: ', part_del_text, '<br>');
//Si volem agafar les últimes 3 lletres, hem d'agafar la longitud i llevar-li 3
part_del_text = text.substring(text.length - 3);
document.write('La part extreta amb substring(text.substring.length - 3) és: ', part_del_text, '<br>');
document.write('<h3>Operacions amb text</h3>');
var text = prompt('Indica un text');
document.write('El text és: <b>', text, '</b><br>');
/* CONTÉ UNA LLETRA? */
var conte_lletra = text.includes('a');
document.write('Inclou a? ', conte_lletra);
document.write('<br>');
conte_lletra = text.includes('D');
document.write('Inclou D? ', conte_lletra);
document.write('<br>');
document.write('<h3>Operacions amb text</h3>');
var text = prompt('Indica un text');
document.write('El text és: <b>', text, '</b><br>');
/* POSICIÓ DE LA PARAULA O LLETRA */
var posicio = text.indexOf('a');
document.write('Posició de la lletra a: ', posicio, '<br>');
posicio = text.indexOf('Vicent');
document.write('Posició de la paraula Vicent: ', posicio, '<br>');
Fes que l'usuari indique el valor de dos numeros i que es mostre per pantalla la suma, resta, multiplicació, potència, divisió i residu dels valors indicats. Recorda que amb prompt fem que l'usari indique un valor:
var num1 = prompt('Indica el valor del primer número'); //Açò farà que es guarde el que escriga l'usuari en la variable anomenada num1
PISTA: Si al sumar els números, per exemple 1 i 2, en lloc de donar 3, dóna 12, és perquè el prompt rep text i la suma de dos textos es juntar un amb l'altre. Per tant, hem de pasar a número amb la funció parseInt():
var numero1 = parseInt( prompt('Disme un número') )
Una panaderia ven barres de pa a 3.49€ cadascuna. El pa que no és del dia té un descompte del 60%. Escriu un programa en el que l'usuari indique el número de barres venudes que no són del dia. Després ha de mostrar el preu habitual d'una barra de pa, el descompte que se li fa per no ser del dia i el cost final total.
Fes un programa que emmagatzeme 3 variables a, b i c i que calcule equacions de segon grau. Tin en compte que hauràs d'obtindre dos resultats, resultat1 i resultat2 que serà un per a quan el símbol és suma i un altre per a quan és resta. A més, l'arrel quadrada s'obté de la següent manera:
var arrel_de_numero = Math.sqrt(numero);
Pista:
Guarda una variable que calcule la part de dins de l'arrel (dins_arrel)
Després calcula l'arrel amb una altra variable (arrel)
Després guarda en una variable resultat1 l'operació amb la suma
Guarda una variable resultat2 l'operació amb la resta
Mostra al final el resultat1 i resultat2 amb document.write com es mostra a continuació.
Ampliació de l'exercici:
Fes que l'usuari indique el valor d'a, b i c amb la funció prompt() com en l'exemple següent:
var a = prompt('Indica el valor de a'); //Açò farà que es guarde el que escriga l'usuari en la variable anomenada a
Escriu un programa en que l'usuari indique el seu nom i es mostre el nom i quantes lletres té.
Els telèfons d'una empresa tenen el format prefix-número-extensió on el prefix és el codi del país (+34 és Espanya) i l'extensió té 2 dígits (per exemple, +34 912345678-12). Escriu un programa que quan s'indique el número de telèfon complet es mostre per separat:
Prefix: +34
Número de telèfon: 912345678
Extensió: 12
Escriu un programa que pregunte el correu electrònic d'un usuari i mostre per pantalla la part de l'usuari i la part del domini:
El correu indicat és vicenteforner@iesbetxi.es
L'usuari és: vicenteforner
El domini és: iesbetxi.es
Escriu un programa al que se li indique el preu d'un producte en euros utilitzant dos decimals i es mostre per pantalla el número d'euros i el número de cèntims.
Escriu un programa que pregunte a l'usuari per la seua data de naixement en format dd/mm/aaaa i que mostre per pantalla el dia, el més i l'any.
AMPLIACIÓ: Adapta el programa anterior perquè funcione també si posem un dígit per al dia o per al mes.