Ahora también distribuidor oficial BQ

Aplicaciones Web (IV)

HTML5 CSS3 JSSentencia if/else

Sentencia if/else

if/else permite ejecución condicional de bloques de instrucciones
Comienza por la palabra reservada if la condición va después entre paréntesis
El bloque de sentencias al final, delimitadas por { }
El bloque de 1 sentencia puede omitir {}
La parte else es opcional

Ver ejemplos: 01, 02 y 03

Ejemplo de prompt()

Por supuesto se puede combinar con otras funciones, como por ejemplo prompt()
Con ello se consiguen aplicaciones más útiles.

Ver ejemplos: 04 y 06

Strings e internacionalización (I18N)

El tipo string

El texto internacionalizado codificado con el código UNICODE
Puede representar muchas lenguas diferentes

Literales de string: textos delimitados por comillas o apóstrofes
“hola, que tal”, ‘hola, que tal’, ‘Γεια σου, ίσως’ o ‘嗨,你好吗’ (string “hola, que tal” en varios idiomas)

String vacío:
“” o

“texto ‘entrecomillado’ “
Comillas y apóstrofes se pueden anidar: ‘entrecomillado’ forma parte del texto

Operador de concatenación de strings: +


"Hola" + " " + "Pepe" => "Hola Pepe"


 

Internacionalización (I18N)

UNICODE es un consorcio internacional: http://www.unicode.org/ Define normas de internacionalización (I18N), como el código UNICODE UNICODE puede representar muchas lenguas: http://www.unicode.org/charts/ JavaScript utiliza solo el Basic Multilingual Plane de UNICODE Caracteres codificados en 2 octetos (16 bits), similar a BMP UNICODE tiene otros planos que incluyen lenguas poco frecuentes Teclado: suele incluir solo las lenguas de un país Los caracteres de lenguas no incluidas solo se pueden representar con caracteres escapados por ejemplo,‘\u55e8’ representa el ideograma chino ‘嗨’ Pantalla: es gráfica y puede representar cualquier carácter

Caracteres escapados

Los caracteres escapados son caracteres no representables dentro de un string comienzan por la barra inclinada \ Además podemos representar cualquier carácter UNICODE o ISO-LATIN-1: \uXXXX carácter UNICODE de código hexadecimal XXXX \xXX carácter ISO-LATIN-1 de código hexadecimal XX Algunos ejemplos “Comillas dentro de \”comillas\” debe ir escapado dentro del string “Dos \n líneas” retorno de línea delimita sentencias “Dos \u000A líneas”


CARACTERES ESCAPADOS            
NUL(nulo):         \0,    \x00,    \u0000
Backspace:         \b,    \x08,    \u0008
Horizontal tab:    \t,    \x09,    \u0009
Newline:           \n,    \x0A,    \u000A
Vertical tab:      \t,    \x0B,    \u000B
Form feed:         \f,    \x0C,    \u000C
Carriage return:   \r,    \x0D,    \u000D
Comillas (dobles): \",    \x22,    \u0022
Apóstrofe:         \',    \x27,    \u0027
Backslash:         \\,    \x5C,    \u005C

Clase String

La clase String incluye métodos y propiedades para procesar strings
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String

Un string es un array de caracteres, un índice entre 0 y número_de_caracteres-1 referencia cada carácter

Propiedad con tamaño: ‘ciudad’.length => 6

Acceso como array: ‘ciudad'[2]            => ‘u’

Método: ‘ciudad’.charCodeAt(2)          => 117
devuelve código UNICODE de tercer carácter

Método: ‘ciudad’.indexOf(‘da’)             => 3
devuelve posición de substring

Método: ‘ciudad’.substring(2,5)           => ‘uda’
devuelve substring entre ambos índices

Ver ejemplos: 10, 11 y 12

HTML5 CSS3 JS

Números

Números: tipo number

Los números se representan con literales de
Enteros: 32 (entero máximo: 9007199254740992)
Decimales: 32.23
Coma flotante: 3.2e1 (3,2·101) (rango real: 1,797·10308 hasta 5·10-324)

Todos los números son del tipo number

Todos los números se representan igual internamente, en coma flotante de doble precisión (64bits)

El tipo number incluye 2 valores especiales
Infinity: representa desbordamiento
NaN: representa resultado no númerico


10 + 4 => 14   // sumar
10 - 4 => 6    // restar
10 * 4 => 40   // multiplicar
10 / 4 => 2.5  // dividir
10 % 4 => 2    // operación resto

// decimales dan error de redondeo
0.1 + 0.2 => 0,3000000000004

3e2       => 300
3e-2      => 0,03

+10/0     => Infinity   //desborda
-10/0     => -Infinity  //desborda

5e500     => Infinity   //desborda

 

Conversión a enteros

Cuando JavaScript calcula expresiones convirtiendo tipos, según necesita utiliza las prioridades de los operadores

Conversión a entero (o real)
booleano: true a 1, false a 0
String: Convierte número a valor o NaN
null: a 0,
undefined: a NaN

Convertir un string a un número se denomina también “parsear” o analizar sintácticamente es similar al análisis sintáctico realizado a los literales de números


  '67'   + 13 => 6713
 +'67'   + 13 => 80
+'6.7e1' + 13 => 80

 'xx' + 13 => 'xx13'
+'xx' + 13 => NaN

13 + true  => 14
13 + false => 13


 

Modulo Math

El Modulo Math contiene constantes y funciones matemáticas Constantes Números: E, PI, SQRT2, … … Funciones sin(x), cos(x), tan(x), asin(x), … log(x), exp(x), pow(x, y), sqrt(x), … abs(x), ceil(x), floor(x), round(x), … min(x,y,z,…), max (x,y,z,..), … random() Mas info: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math


Math.PI           => 3.141592653589793
Math.E            => 2.718281828459045

Math.random()     => 0.7890234 // numero aleatorio entre 0 y 1
Math.pow(3,2)     => 9         // 3 al cuadrado
Math.sqrt(9)      => 3         // raíz cuadrada de 3

Math.min(2,1,9,3) => 1         // número mínimo
Math.max(2,1,9,3) => 9         // número máximo
Math.floor(3.2)   => 3
Math.ceil(3.2)    => 4
Math.round(3.2)   => 3
    
Math.sin(1)                   => 0.8414709848078965
Math.asin(0.8414709848078965) => 1

 

Clase Number

La clase Number encapsula números como objetos equivalentes

Number define algunos métodos útiles
toFixed(n) devuelve string redondeando a n decimales
toExponential(n) devuelve string redondeando mantisa a n decima.
toPrecision(n) devuelve string redondeando a n dígitos

JS convierte una expresión a objeto al aplicar el método a una expresión.
!Ojo! literales dan error sintáctico

Mas info:
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number


var x = 1.1;

x.toFixed(0)           => "1"
x.toFixed(2)           => “1.10"

(1).toFixed(2)         => “1.00"
1.toFixed(2)           => Error sintáctico

Math.PI.toFixed(4)     => "3.1416"
(0.1).toExponential(2) => "1.00e-1"
x.toExponential(2)     => "1.10e+0"

(0.1).toPrecision(2)   => "0.10"
x.toPrecision(2)       => "1.1"


 

Funciones

Función: bloque de código con parámetros, invocable (ejecutable) a través del nombre La ejecución finaliza con la sentencia “return expr” o al final del bloque Al acabar la ejecución, devuelve un resultado: valor de retorno Valor de retorno resultado de evalúar expr, si se ejecuta la sentencia “return expr” undefined, si se alcanza final del bloque sin haber ejecutado ningún return


function comer(persona, comida) {
    return (persona + " come " + comida);
};
comer('José', 'paella');   => 'José come paella'


 

Parámetros de una función

Los parámetros de la función son variables utilizables en el cuerpo de la función. Al invocarlas se asignan los valores de la invocación. La función se puede invocar con un número variable de parámetros. Un parámetro inexistente está undefined


function comer(persona, comida) {
    return (persona + " come " + comida);
};
comer('José', 'paella');          => 'José come paella'
comer('José', 'paella', 'carne'); => 'José come paella'
comer('José');                    => 'José come undefined'


 

El array de argumentos

Los parámetros de la función están accesibles también a través del array de argumentos: arguments[…] Cada parámetro es un elemento del array En: comer(‘José’, ‘paella’) arguments[0] => ‘José’ arguments[1]  => ‘paella’


function comer() {
    return (arguments[0] + " come " + arguments[1]);
};
comer('José', 'paella');          => 'José come paella'
comer('José', 'paella', 'carne'); => 'José come paella'
comer('José');                    => 'José come undefined'


 

Parámetros por defecto

Funciones invocadas con un número variable de parámetros Suelen definir parámetros por defecto con el operador ||  “x || <parámetro_por_defecto>” Si x es “undefined”, se convierte a false y devolverá el parámetro por defecto Los parámetros son variables y se les puede asignar un valor


function comer(persona, comida) {
    persona = (persona||'Alguien');
    comida  = (comida ||'algo');
    return (persona + " come " + comida);
};
comer('José'); => 'José come algo'
comer();       => 'Alguien come algo'


 

Funciones como objetos

Las funciones son objetos de pleno derecho pueden asignarse a variables, propiedades, parámetros, “function literal”: es una función que se define sin nombre Se suele asignar a una variable, que le da su nombre Se puede invocar a través del nombre de la variable


var comer = function (persona, comida) {
    return (persona + " come " + comida);
};
comer('José','paella'); => 'José come paella'


 

Operador de invocación de una función

El objeto función puede asignarse o utilizarse como un valor, el objeto función contiene el código de la función. El operador (…) invoca una función ejecutando su código Solo es aplicable a funciones (objetos de la clase Function) Puede incluir una lista de parámetros separados por coma


var comer = function (persona, comida) {
    return (persona + " come " + comida);
};

var x = comer;      // asigna a x el código de la función
x('José','paella'); => 'José come paella'
x('José','paella'); => 'José come paella'
var y = comer();    // asigna a y el resultado de invocar la función
y;                  => 'undefined come undefined'


 

Comments are closed.