Javascript: Generar números aleatorios.

¿Cómo se generan números aleatorios en Javascript? Pues con la función random() del objeto Math. Vamos a ver cómo generar números aleatorios entre 1 y 10, 1 y 100 y 1 y 1000.

//de 1 al 10
var lenumero = Math.floor(Math.random() * 10 + 1);

//de 1 a 100
var lenumero = Math.floor(Math.random() * 100 + 1);

//de 1 a 1000
var lenumero = Math.floor(Math.random() * 1000 + 1);

En fin, viendo el ejemplo arriba ya puedes ver que generar un número aleatorio entre 1 y N se hace siguiendo la siguiente fórmula:

//de 1 a un número N
var lenumero = Math.floor(Math.random() * N + 1);
Anuncios

Calcular el IMC con Javascript

Esta semana en el trabajo me encontraba con una petición de un cliente. En un formulario donde insertaba peso y talla de una persona quería que hubiera un campo con el índice de masa corporal, que debía rellenarse solo. ¿Esto cómo va? Pues lo arreglamos con una función de javascript:

function calculaIMC(){
  //declaramos las variables
  var peso, altura, imc;
  //recogemos los datos.
  //Suponemos que los campos
  //tienen esos Id.
  //El peso en KG y la altura en cm
  //para operar mejor
  peso=document.getElementById("peso").value;
  altura=document.getElementById("altura").value;
  //comprobamos que los campos
  //no vengan vacíos
  if(peso!="" && altura!=""){
    //aplicamos la fórmula
    altura = parseInt(altura)/100;
    imc=peso/(altura*altura);
    document.getElementById("imc").value=imc.toFixed(2);
  }
}

Recuerda que queremos que los datos se introduzcan como tipos enteros: puedes poner una validación por javascript para que no metan comas, usar un campo numeric de HTML5 (hoy por hoy ya todos los navegadores modernos lo soportan) o hasta tirar de una vieja librería de jQuery (que servía para asegurarnos el funcionamiento en navegadores viejos, aunque hoy por hoy ya no tenga mucho sentido).

Javascript: convertir Array en CSV

Vamos con un tip rápido de javascript ¿cómo convertimos un array en una cadena de valores separados por comas? Es bastante sencillo lograrlo, y así obtener un formato válido para crear un fichero CSV más adelante:

var sabbath = ['ozzy', 'iommi', 'bill', 'geezer'];

var sabbathCsv = sabbath.valueOf();

Si lo que queremos son comas como separador el método valueOf() ya nos hace el trabajo, pero ¿si queremos otro separador? Entonces recurriremos a join().

var icada = ['drogas', 'boni', 'alf', 'fer'];

var icadaCsv = icada.join("#");

En el ejemplo de arriba usará el caracter # como separador en lugar de las comas.

Javascript: convertir una string en un número.

La función parseFloat() de Javascript nos permite recoger un dato de tipo string y convertirlo en un número con decimales, mientras que la función parseInt() nos devuelve un entero. ¿Así de simple? Sí, pero con matices. Vamos a profundizar un poco:

En el caso de parseInt() se trata de una función que recibe dos valores: el primero es obligatorio y es la cadena que queremos convertir a entero, el segundo sería un entero entre 2 y 36 para definir la base en que queremos que esté representado el entero devuelto, y es un parámetro opcional que por defecto tomará el valor 10 (base decimal). En implementaciones en navegadores antiguos (por ejemplo IE8) si el número empieza por 0 lo devolverá en base octal, así que ojo. Con los navegadores modernos ya no pasa, pero es importante recordarlo. Si le pasamos una cadena con espacios los obviará y devolverá el número (si hay varios números devolverá el primero que se encuentre). Si le pasamos una cadena con letras y números dependerá de la posición del número: si este está al inicio entonces devolverá el número hasta que encuentre un caracter extraño. Si empieza por letras devolverá un valor NaN. Ejemplos:

parseInt("10"); //devuelve 10
parseInt("10 años"); //devuelve 10
parseInt("10 54"); //devuelve 10
parseInt("10.50"); //devuelve 10
parseInt("casi 10"); //devuelve NaN
parseInt("10",16); //devuelve 16

Si quieres evitar problemas y que te devuelva un 0 cuando el resultado sea NaN ya te lo contamos en su día por aquí.

En el caso de parseFloat() la función sólo recibe la cadena que debe convertir a número decimal. Al igual que parseInt() si recibe una cadena con espacios los ignorará para devolver el número, y si recibe una cadena con caracteres actuará también igual que esa función: si este está al inicio entonces devolverá el número hasta que encuentre un caracter extraño. Si empieza por letras devolverá un valor NaN. En este caso ojo al formato numérico, sólo acepta el anglosajón. Es decir, el separador decimal tiene que ser un punto, interpretará la una coma como un caracter extraño.

parseFloat("10"); //devuelve 10
parseFloat("10.5 años"); //devuelve 10.5
parseFloat("10 54"); //devuelve 10
parseFloat("10.50"); //devuelve 10.50
parseFloat("casi 10.4"); //devuelve NaN
parseFloat("1.000,33"); //devuelve 1
parseFloat("10,50"); //devuelve 10

Entonces ¿qué hago si tengo una cadena donde los decimales vienen separados por comas y los miles marcados con puntos? Pues usando la función replace(). Vamos con un ejemplo:

var strEx = "1.000,33";
//primer paso: fuera puntos
strEx = strEx.replace(".","");
//cambiamos la coma por un punto
strEx = strEx.replace(",",".");
//listo
var numFinal = parseFloat(strEx);

Podría ser útil tener una función creada ya para realizar esta operación de conversión.

Y hasta aquí con esta entrada de Javascript básico.

Las funciones setInterval() y setTimeout() en javascript.

Feliz 2017 a todos, esta es la primera entrada del año. Una cuestión sencilla de javascript ¿para qué valen las funciones setInterval() y setTimeout() y en qué se diferencian?

Pues ambas funciones tienen el mismo objetivo: ejecutar otra función pasado un intervalo de tiempo. ¿En qué se diferencian? En que setTimeout() se ejecutará solamente una vez, mientras que setInterval() lo hará en repetidas ocasiones.

Por ejemplo, podríamos usar setInterval() para que se mostrara en pantalla cuántos segundos llevamos desde que se cargó la página:

/*definimos una función que cada ponga en un
cuadro de texto un valor numérico, sumando uno cada
vez que la invocamos*/
function showSeconds(){
 var val = document.getElementById("tiempo").value;
 document.getElementById("tiempo").value = parseInt(val)+1;
}
/*usamos setTimeout() para que se
ejecute cada segundo (1000 milisegundos como parámetro)*/
setInterval(showSeconds,1000);

O podríamos usar setTimeout() para dar un aviso al usuario a los diez segundos de entrar

/*función que sólo hace un alert*/
function funcAvisa(){
 window.alert("Pareces interesado en esta sección");
}
/*se la llama a los 10 segundos*/
setTimeout(funcAvisa,10000);

Así funcionan los dos temporizadores de Javascript.

Declarar una función en Javascript

Hemos hablado mucho de javascript en este blog, pero a veces nos dejamos por explicar cosas básicas ¿Cómo se declara una función? y ya puestos ¿para qué sirve hacerlo?

Bueno, la utilidad de una función es no tener que repetir el mismo bloque de código varias veces. Nos permite agrupar externamente una serie de instrucciones para luego llamarla desde cualquier parte del código.

Para declarar una función debemos usar la palabra reservada function. Tras ella, separada por un espacio, ponemos el nombre que queremos darle seguido de los párametros que recibirá ,si es que recibe alguno, que pondremos entre paréntesis. Abriremos unas llaves y dentro insertaremos el código de la función. Si la función debe devolver un valor esto lo definiremos con la palabra return, que además finalizará la función. Vamos con un ejemplo práctico, una función que calcula un precio final aplicándole unos valores fijos al que recibe:

function precioFinal(precio,descuento){
  var ivaCultural = 1.21;
  var gastosEnvio = 10;
  var precioFinal = (precio*ivaCultural*(100-descuento/100))+10;
  return precioFinal.toFixed(2);
}

La función recibiría un precio y un descuento en porcentaje, le añadiría el IVA, le aplicaría el descuento, le sumaria los gastos de envío y devolvería el resultado rendondeado a dos decimales. En el código llamaríamos así a la función:

var precio = precioFinal(449.99,10);

Como el intérprete de javascript de los navegadores busca en primer lugar la declaración de variables y de funciones una función puede aparecer en el código antes de ser declarada.

PHP: ¿Cómo saber si una variable existe?

Situación clásica en PHP: En una página tengo que mostar tal o cual resultado si una variable tiene un valor concreto, pero además existe la posibilidad de que dicha variable no exista. ¿Cómo evito que me salte un mensaje de error si esta viene vacía? Pues usando el método isset().

Un ejemplo

if (isset($_GET["id"])){
     //carga los datos asociados al id
}else{
     //no carga nada
}

Ya hace tiempo explicamos aquí la diferencia entre isset(), is_null() y empty().