Diferencia entre revisiones de «Usuario:Juanda/javascript/Sintaxis»
De WikiEducator
(→Ámbito de las variables) |
|||
(4 revisiones intermedias por el mismo usuario no mostrado) | |||
Línea 675: | Línea 675: | ||
<div class="slide"> | <div class="slide"> | ||
===Funciones=== | ===Funciones=== | ||
+ | ====Funciones de usuario==== | ||
<source lang="javascript"> | <source lang="javascript"> | ||
function nombre_función (var1,var2,...,varX) | function nombre_función (var1,var2,...,varX) | ||
Línea 696: | Línea 697: | ||
</div> | </div> | ||
+ | <div class="slide"> | ||
+ | ====Funciones útiles para cadenas de texto==== | ||
+ | <source lang="javascript"> | ||
+ | //length, calcula la longitud de una cadena de texto | ||
+ | var mensaje = "Hola Mundo"; | ||
+ | var numeroLetras = mensaje.length; // numeroLetras = 10 | ||
+ | //+, se emplea para concatenar varias cadenas de texto | ||
+ | var mensaje1 = "Hola"; | ||
+ | var mensaje2 = " Mundo"; | ||
+ | var mensaje = mensaje1 + mensaje2; // mensaje = "Hola Mundo" | ||
+ | |||
+ | //la función concat se utiliza de modo similar al operador + | ||
+ | var mensaje1 = "Hola"; | ||
+ | var mensaje2 = mensaje1.concat(" Mundo"); // mensaje2 = "Hola Mundo" | ||
+ | |||
+ | </source> | ||
+ | |||
+ | </div> | ||
+ | |||
+ | <div class="slide"> | ||
+ | <source lang="javascript"> | ||
+ | //toUpperCase(), transforma a mayúsculas | ||
+ | |||
+ | var mensaje1 = "Hola"; | ||
+ | var mensaje2 = mensaje1.toUpperCase(); // mensaje2 = "HOLA" | ||
+ | |||
+ | //toLowerCase(), transforma a minúsculas: | ||
+ | var mensaje1 = "HolA"; | ||
+ | var mensaje2 = mensaje1.toLowerCase(); // mensaje2 = "hola" | ||
+ | |||
+ | //charAt(posicion), obtiene el carácter que se encuentra en la posición indicada: | ||
+ | |||
+ | var mensaje = "Hola"; | ||
+ | var letra = mensaje.charAt(0); // letra = H | ||
+ | letra = mensaje.charAt(2); // letra = l | ||
+ | |||
+ | //indexOf(caracter), calcula la primera ocurrencia del carácter indicado | ||
+ | |||
+ | var mensaje = "Hola"; | ||
+ | var posicion = mensaje.indexOf('a'); // posicion = 3 | ||
+ | posicion = mensaje.indexOf('b'); // posicion = -1 | ||
+ | |||
+ | //lastIndexOf(caracter), empieza a buscar por detrás en la cadena | ||
+ | |||
+ | var mensaje = "Hola"; | ||
+ | var posicion = mensaje.lastIndexOf('a'); // posicion = 3 | ||
+ | |||
+ | //función substring(número), extraer parte de la cadena: | ||
+ | var mensaje = "Hola Mundo"; | ||
+ | porcion = mensaje.substring(5); // porcion = "Mundo" | ||
+ | var porcion = mensaje.substring(1, 8); // porcion = "ola Mun" | ||
+ | |||
+ | //función split para obtener arrays de texto: | ||
+ | var mensaje = "Hola Mundo, soy una cadena de texto!"; | ||
+ | var palabras = mensaje.split(" "); | ||
+ | // palabras = ["Hola", "Mundo,", "soy", "una", "cadena", "de", "texto!"]; | ||
+ | |||
+ | //Con esta función se pueden extraer fácilmente las letras que forman una palabra: | ||
+ | var palabra = "Hola"; | ||
+ | var letras = palabra.split(""); // letras = ["H", "o", "l", "a"] | ||
+ | |||
+ | </source> | ||
+ | |||
+ | </div> | ||
+ | |||
+ | <div class="slide"> | ||
+ | ====Funciones útiles para arrays==== | ||
+ | <source lang="javascript"> | ||
+ | //length, calcula el número de elementos de un array | ||
+ | var vocales = ["a", "e", "i", "o", "u"]; | ||
+ | var numeroVocales = vocales.length; // numeroVocales = 5 | ||
+ | |||
+ | //concat(), se emplea para concatenar los elementos de varios arrays | ||
+ | var array1 = [1, 2, 3]; | ||
+ | array2 = array1.concat(4, 5, 6); // array2 = [1, 2, 3, 4, 5, 6] | ||
+ | |||
+ | //join(separador), es la función contraria a split(). Une los elementos de un array para formar una cadena de texto. | ||
+ | var array = ["hola", "mundo"]; | ||
+ | var mensaje = array.join(""); // mensaje = "holamundo" | ||
+ | //Para unir los elementos se utiliza el carácter separador indicado: | ||
+ | mensaje = array.join(" "); // mensaje = "hola mundo" | ||
+ | |||
+ | //pop(), elimina el último elemento del array y lo devuelve. El array original se modifica y su longitud disminuye en 1 elemento. | ||
+ | var array = [1, 2, 3]; | ||
+ | var ultimo = array.pop(); | ||
+ | // ahora array = [1, 2], ultimo = 3 | ||
+ | |||
+ | push(), añade un elemento al final del array. El array original se modifica y aumenta su longitud en 1 elemento. | ||
+ | var array = [1, 2, 3]; | ||
+ | array.push(4); | ||
+ | // ahora array = [1, 2, 3, 4] | ||
+ | |||
+ | //shift(), elimina el primer elemento del array y lo devuelve. El array original se ve modificado y su longitud disminuida en 1 elemento. | ||
+ | var array = [1, 2, 3]; | ||
+ | var primero = array.shift(); | ||
+ | // ahora array = [2, 3], primero = 1 | ||
+ | |||
+ | //unshift(), añade un elemento al principio del array. El array original se modifica y aumenta su longitud en 1 elemento. (También es posible añadir más de un elemento a la vez) | ||
+ | var array = [1, 2, 3]; | ||
+ | array.unshift(0); | ||
+ | // ahora array = [0, 1, 2, 3] | ||
+ | |||
+ | reverse(), modifica un array colocando sus elementos en el orden inverso a su posición original: | ||
+ | var array = [1, 2, 3]; | ||
+ | array.reverse(); | ||
+ | // ahora array = [3, 2, 1] | ||
+ | </source> | ||
+ | |||
+ | </div> | ||
+ | |||
+ | <div class="slide"> | ||
+ | |||
+ | ====Funciones útiles para números==== | ||
+ | <source lang="javascript"> | ||
+ | //función isNaN para comprobar si es un número: | ||
+ | var numero1 = 0; | ||
+ | var numero2 = 0; | ||
+ | alert(numero1/numero2); // se muestra el valor NaN | ||
+ | |||
+ | var numero1 = 0; | ||
+ | var numero2 = 0; | ||
+ | if(isNaN(numero1/numero2)) { | ||
+ | alert("La división no está definida para los números indicados"); | ||
+ | } | ||
+ | else { | ||
+ | alert("La división es igual a => " + numero1/numero2); | ||
+ | } | ||
+ | |||
+ | //función toFixed(digitos), devuelve el número con los decimales indicados y los redondeos necesarios: | ||
+ | var numero1 = 4564.34567; | ||
+ | numero1.toFixed(2); // 4564.35 | ||
+ | </source> | ||
+ | |||
+ | </div> | ||
+ | <div class="slide"> | ||
+ | ====Ámbito de las variables==== | ||
+ | *'''Variables locales:''' Declaradas dentro de una función. Visibles solo desde la función. | ||
+ | *'''Variables globales:''' Declaradas fuera de las funciones. ¡O sin declarar! | ||
+ | <source lang="javascript"> | ||
+ | function creaMensaje() { | ||
+ | var mensaje = “Mensaje de prueba”; | ||
+ | alert(mensaje); | ||
+ | } | ||
+ | CreaMensaje(); | ||
+ | //variable local, el alert tiene mensaje | ||
+ | |||
+ | function creaMensaje() { | ||
+ | var mensaje = “Mensaje de prueba”; | ||
+ | } | ||
+ | creaMensaje(); | ||
+ | alert(mensaje); | ||
+ | //variable local, el alert vacío | ||
+ | </source> | ||
+ | </div> | ||
+ | |||
+ | <div class="slide"> | ||
+ | <source lang="javascript"> | ||
+ | var mensaje = “Mensaje de prueba”; | ||
+ | |||
+ | function muestraMensaje() { | ||
+ | alert(mensaje); | ||
+ | } | ||
+ | //variable global, el alert tiene mensaje | ||
+ | |||
+ | |||
+ | function creaMensaje() { | ||
+ | mensaje = "Mensaje de prueba"; | ||
+ | } | ||
+ | creaMensaje(); | ||
+ | alert(mensaje); | ||
+ | //variable global, el alert tiene mensaje | ||
+ | </source> | ||
+ | </div> | ||
</div> | </div> |
Última revisión de 11:56 28 sep 2012