Diferencia entre revisiones de «Exemples Javascript»
Ir a la navegación
Ir a la búsqueda
Línea 198: | Línea 198: | ||
</syntaxhighlight> | </syntaxhighlight> | ||
=== Comunicació amb l'usuari === | |||
<syntaxhighlight lang="javascript" style="font-family:monospace"> | <syntaxhighlight lang="javascript" style="font-family:monospace"> | ||
var nom = 'Jose'; | var nom = 'Jose'; | ||
Línea 210: | Línea 210: | ||
console.log('El nom és %s i té %d anys','Jose',38); // Com en C o altres | console.log('El nom és %s i té %d anys','Jose',38); // Com en C o altres | ||
console.log('%cEl nom és %s i té %d anys',"color:green;background-color:yellow",'Jose',38); // Com en C o altres | console.log('%cEl nom és %s i té %d anys',"color:green;background-color:yellow",'Jose',38); // Com en C o altres | ||
</syntaxhighlight> | |||
=== Arrays === | |||
<syntaxhighlight lang="javascript" style="font-family:monospace"> | |||
let a = [1,'2',3.0,[4,5],{6:'6'}]; | |||
a.push('99'); | |||
console.log(a, a.length, a.sort()); | |||
</syntaxhighlight> | |||
=== Objectes === | |||
<syntaxhighlight lang="javascript" style="font-family:monospace"> | |||
</syntaxhighlight> | </syntaxhighlight> |
Revisión del 22:16 16 ago 2020
Insertar Javascript al HTML
<script type="text/javascript">
// codi
</script>
<script type="text/javascript" src="scripts.js"></script>
<noscript>
<p> El teu navegador no suporta javascript. </p>
</noscript>
Formes de declarar variables
var a=1;
for (a=1;a<10;a++){
let b = a; // El scope de b es limita al bucle
var c = a; // El scope de c és global
console.log(b);
}
console.log(a,b,c); // Uncaught ReferenceError: b is not defined
var a;
for (let i=1;i<10;i++){
a++;
}
console.log(a,i); // Uncaught ReferenceError: i is not defined
// útil per no tindre la variable de control del bucle accessible tot el programa.
Constants:
const a=1;
for (let i=1;i<10;i++){
a++; // Uncaught TypeError: invalid assignment to const 'a'
}
Sense let, var o const es perd el scope, NO recomanable:
let a=1;
function sumar(){
a=a+10;
b=1;
return a;
}
console.log(sumar(),b);
Transformació de tipus de dades
var array_mix = [
"abcdef", 2 , 2.1 , 2.9e3 , 2e-3 ,
0234 , 0x23AF , true , [1,2,3] , {'a': 1, 'b': 2}, '4'
];
for (let i=0;i<array_mix.length;i++) {
console.log(typeof(array_mix[i]));
}
console.log(typeof(array_mix[1]+"")); // de número a cadena +""
console.log(typeof(parseInt(array_mix[10]))); // de cadena a número parseInt parseFloat
Funcions
Declaració de funcions
suma_y_mostra(2,3); // Funciona abans de la funció per el hoising
function suma_y_mostra(numero1,numero2) {
resultat = numero1 + numero2;
console.log("El resultat és " + resultat);
return resultat;
}
console.log(suma_y_mostra); //sense () el que trau és l'objecte funció
Expressions de funcions
function toCelsius(fahrenheit) { return (5/9) * (fahrenheit-32); }
var x = toCelsius(77);
console.log(x);
console.log(`La temperatura és: ${x} C`);
// Dirèctament en la variable
x = function toCelsius(fahrenheit) { return (5/9) * (fahrenheit-32); }
console.log(x);
console.log(`La temperatura és: ${x(77)} C`);
// Sense nom de funció
x = function (fahrenheit) { return (5/9) * (fahrenheit-32); }
console.log(x); // Obervem el nom de la funció en la consola
console.log(`La temperatura és: ${x(77)} C`);
// Factorial recursiu
var factorial = function fac(n) {return n<2 ? 1 : n*fac(n-1)}; // pot ser recursiva perquè té nom
console.log(factorial);
console.log(factorial(5));
// Utilitzar una expressió de funció com a argument d'una altra funció.
function map(f,a) {
var result = [], // Crea un nou Array
i;
for (i = 0; i != a.length; i++)
result[i] = f(a[i]); // f és una funció
return result;
}
var multiplicar= function(x) { return x * x * x;} //Expressió de funció
// function multiplicar(x) { return x * x * x;} //declaració de funció
console.log(map(multiplicar, [0, 1, 2, 5, 10])); // Array(5) [ 0, 1, 8, 125, 1000 ]
Funcions anónimes
var nums = [0,1,2];
var doubledNums = nums.map( function(element){ return element * 2; } ); // map és una funció dels objectes array
console.log(doubledNums);
Funcions fletxa
var sum = (a,b) => a+b;
console.log(sum(3,5));
console.log(sum);
var sum = function sum(a,b){return a+b; };
console.log(sum(3,5));
console.log(sum); // Obsrvem la diferència amb el nom i el prototype
var nums = [0,1,2];
var doubledNums = nums.map( function(element){ return element * 2; } ); // map és una funció dels objectes array
console.log(doubledNums);
doubledNums = nums.map( (element) => {return element * 2; } ); // map és una funció dels objectes array
console.log(doubledNums);
doubledNums = nums.map( (element) => element * 2 ); // map és una funció dels objectes array
console.log(doubledNums);
Funcions auto invocades
(function () {
var aName = "Barry";
})();
console.log(aName); // "Uncaught ReferenceError: aName is not defined"
var result = (function () {
var name = "Barry";
return name;
})();
console.log(result); // "Barry"
Ámbit de les variables en funcions
function addSquares(a,b) {
function square(x) {
return x * x;
}
return square(a) + square(b);
}
a = addSquares(2,3); // retorna 13
b = addSquares(3,4); // retorna 25
c = addSquares(4,5); // retorna 41
console.log(a,b,c);
function outside(x) {
function inside(y) {
return x + y;
}
return inside;
}
fn_inside = outside(3); // fn_inside és una closure i recorda el 3
result = fn_inside(5); // retorna 8
result1 = outside(3)(5); // retorna 8
result2 = fn_inside(6); // recorda el 3 i retorna 9
console.log(result,result1,result2,fn_inside);
Comunicació amb l'usuari
var nom = 'Jose';
alert(`El nom és ${nom}`);
nom = `El nom és ${nom}`;
console.log(nom);
console.error(nom);
console.warn(nom);
console.debug(nom);
console.info(nom);
console.log('El nom és %s i té %d anys','Jose',38); // Com en C o altres
console.log('%cEl nom és %s i té %d anys',"color:green;background-color:yellow",'Jose',38); // Com en C o altres
Arrays
let a = [1,'2',3.0,[4,5],{6:'6'}];
a.push('99');
console.log(a, a.length, a.sort());