- Como definir una función o una variable (Link 1 / Link 2)
- Como crear condiciones a la ejecución de tu código (Link 1 / Link 2)
- Acceder a distintos tipos de datos (Link 1 / Link 2)
- Repetir con bucles (Link 1 / Link 2
Las variables en JavaScript se crean mediante la palabra reservada
varLa palabra reservada var solamente se debe indicar al definir por primera vez la variable, lo que se denomina declarar una variable. El nombre de una variable también se conoce como identificador y debe cumplir las siguientes normas:
- Sólo puede estar formado por letras, números y los símbolos
$ (dólar) y _ (guión bajo). - El primer carácter no puede ser un número.
Correcto:
var $numero1;var _$letra;var $$$otroNumero;
Incorrecto:
var 1numero; // Empieza por un númerovar numero;1_123; // Contiene un carácter ";"
Numéricas
var iva = 16; // variable tipo enterovar total = 234.65; // variable tipo decimal
Booleanos
Una variable de tipo boolean almacena un tipo especial de valor que solamente puede tomar dos valores: true (verdadero) o false (falso). No se puede utilizar para almacenar números y tampoco permite guardar cadenas de texto.
var clienteRegistrado = false;var ivaIncluido = true;
Arrays
var nombre_array = [valor1, valor2, ..., valorN];var dias = ["Lunes", "Martes", "Miércoles", "Jueves", "Viernes", "Sábado", "Domingo"];Cadenas de texto
var mensaje = "Bienvenido a nuestro sitio web";var nombreProducto = 'Producto ABC';var letraSeleccionada = 'c';
/* El contenido de texto1 tiene comillas simples, por lo que se encierra con comillas dobles */var texto1 = "Una frase con 'comillas simples' dentro";
/* El contenido de texto2 tiene comillas dobles, por lo que se encierra con comillas simples */var texto2 = 'Una frase con "comillas dobles" dentro';
Si se quiere incluir... Se debe incluir...
Este mecanismo de JavaScript se denomina "mecanismo de escape" de los caracteres problemáticos, y es habitual referirse a que los caracteres han sido "escapados".
Una nueva línea \nUn tabulador \tUna comilla simple \'Una comilla doble \"Una barra inclinada \\
Asignación
var texto1 = 'Una frase con \'comillas simples\' dentro';var texto2 = "Una frase con \"comillas dobles\" dentro";
/* Error, la asignación siempre se realiza a una variable, por lo que en la izquierda no se puede indicar un número */5 = numero1;
// Ahora, la variable numero1 vale 5numero1 = 5;
// Ahora, la variable numero1 vale 4numero1 = numero2;
Incremento y decremento
var numero = 5;++numero;alert(numero); // numero = 6
var numero = 5;--numero;alert(numero); // numero = 4
var numero1 = 5;var numero2 = 2;numero3 = numero1++ + numero2;// numero3 = 7, numero1 = 6
var numero1 = 5;var numero2 = 2;numero3 = ++numero1 + numero2;// numero3 = 8, numero1 = 6
Por tanto, en la instrucción numero3 = numero1++ + numero2;, el valor de numero1 se incrementa después de realizar la operación (primero se suma y numero3 vale 7, después se incrementa el valor de numero1 y vale 6). Sin embargo, en la instrucción numero3 = ++numero1 + numero2;, en primer lugar se incrementa el valor de numero1 y después se realiza la suma (primero se incrementa numero1 y vale 6, después se realiza la suma y numero3 vale 8).
Lógicos
El resultado de cualquier operación que utilice operadores lógicos siempre es un valor lógico o booleano
Negación
La negación lógica se obtiene prefijando el símbolo ! al identificador de la variable.
var visible = true;alert(!visible); // Muestra "false" y no "true"
variable !variable truefalsefalsetrue
- Si la variable contiene un número, se transforma en
false si vale 0 y en true para cualquier otro número (positivo o negativo, decimal o entero). - Si la variable contiene una cadena de texto, se transforma en
false si la cadena es vacía ("") y en true en cualquier otro caso.
var cantidad = 0;vacio = !cantidad; // vacio = true
cantidad = 2;vacio = !cantidad; // vacio = false
var mensaje = "";mensajeVacio = !mensaje; // mensajeVacio = true
mensaje = "Bienvenido";mensajeVacio = !mensaje; // mensajeVacio = false
AND
variable1 variable2 variable1 && variable2 truetruetruetruefalsefalsefalsetruefalsefalsefalsefalse
var valor1 = true;var valor2 = false;resultado = valor1 && valor2; // resultado = false
valor1 = true;valor2 = true;resultado = valor1 && valor2; // resultado = true
Matemáticos
var numero1 = 10;var numero2 = 5;
resultado = numero1 / numero2; // resultado = 2resultado = 3 + numero1; // resultado = 13resultado = numero2 – 4; // resultado = 1resultado = numero1 * numero 2; // resultado = 50
Se trata del operador "módulo", que calcula el resto de la división entera de dos números. Si se divide por ejemplo 10 y 5, la división es exacta y da un resultado de 2. El resto de esa división es 0, por lo que módulo de 10 y 5 es igual a 0.
JavaScript se indica mediante el símbolo %
var numero1 = 10;var numero2 = 5;resultado = numero1 % numero2; // resultado = 0
numero1 = 9;numero2 = 5;resultado = numero1 % numero2; // resultado = 4
Los operadores matemáticos también se pueden combinar con el operador de asignación para abreviar su notación:
var numero1 = 5;numero1 += 3; // numero1 = numero1 + 3 = 8numero1 -= 1; // numero1 = numero1 - 1 = 4numero1 *= 2; // numero1 = numero1 * 2 = 10numero1 /= 5; // numero1 = numero1 / 5 = 1numero1 %= 4; // numero1 = numero1 % 4 = 1
Relacionales
Los operadores relacionales definidos por JavaScript son idénticos a los que definen las matemáticas: mayor que (>), menor que (<), mayor o igual (>=), menor o igual (<=), igual que (==) y distinto de (!=).
var numero1 = 3;var numero2 = 5;resultado = numero1 > numero2; // resultado = falseresultado = numero1 < numero2; // resultado = true
numero1 = 5;numero2 = 5;resultado = numero1 >= numero2; // resultado = trueresultado = numero1 <= numero2; // resultado = trueresultado = numero1 == numero2; // resultado = trueresultado = numero1 != numero2; // resultado = false
var texto1 = "hola";var texto2 = "hola";var texto3 = "adios";
resultado = texto1 == texto3; // resultado = falseresultado = texto1 != texto2; // resultado = false
(a es menor que b, b es menor que c, A es menor que a, etc.)resultado = texto3 >= texto2; // resultado = false
// El operador "=" asigna valoresvar numero1 = 5;resultado = numero1 = 3; // numero1 = 3 y resultado = 3
// El operador "==" compara variablesvar numero1 = 5;resultado = numero1 == 3; // numero1 = 5 y resultado = false
var valores = [true, 5, false, "hola", "adios", 2];
Determinar cual de los dos elementos de texto es mayor
var resultados = valores [3] > valores [4];alert(resultado);
Utilizando exclusivamente los dos valores booleanos del array, determinar los operadores necesarios para obtener un resultado true y otro resultado false
var valor1 = valores[0]; truevar valor2 = valores [2]; false
var resultado = valor1 || valor2;alert( resultado)true
var resultado = valor1 && valor2;alert(resultado)false
Determinar el resultado de las cinco operaciones matemáticas realizadas con los dos elementos numéricos
var num1 = valores[1];var num2 = valores[5];
var suma = num1 + num2;alert(suma);
var resta = num1-num2;alert(resta);
var multiplicacion = num1*num2;alert(multiplicacion);
var division = num1/numb2;alert(division);
var modulo= num1 % num2;alert(modulo);
Estructura if
"si se cumple esta condición, hazlo; si no se cumple, haz esto otro."
if(condicion) { ...}
Si la condición se cumple (es decir, si su valor es true) se ejecutan todas las instrucciones que se encuentran dentro de {...}.
var mostrarMensaje = true;
if(mostrarMensaje) { alert("Hola Mundo");}
En este caso, la condición es una comparación entre el valor de la variable mostrarMensaje y el valor true. El mensaje sí que se muestra al usuario ya que la variable mostrarMensaje tiene un valor de true
var mostrarMensaje = true;
// Se comparan los dos valores
if(mostrarMensaje == false) {
...
}
// Error - Se asigna el valor "false" a la variable
if(mostrarMensaje = false) {
...
}
Estructura if...else
"si se cumple esta condición, hazlo; si no se cumple, haz esto otro".
Si la condición se cumple (es decir, si su valor es true) se ejecutan todas las instrucciones que se encuentran dentro del if(). Si la condición no se cumple (es decir, si su valor es false) se ejecutan todas las instrucciones contenidas en else { }.
if(condicion) { ...}else { ...}
var edad = 18;
if(edad >= 18) { alert("Eres mayor de edad");}else { alert("Todavía eres menor de edad");}
var nombre = "";
if(nombre == "") { alert("Aún no nos has dicho tu nombre");}else { alert("Hemos guardado tu nombre");}
https://drive.google.com/file/d/1TS-vcFMeerrMNIz9Mqc9icc6sCbif2JH/view?usp=sharing
VARIABLES Y OPERADORES:
https://drive.google.com/file/d/1OIxiGFRZTrcaQyGx339oleHCSFIAWPd7/view?usp=sharing
CONDICIONES IF EJERCICIO:https://drive.google.com/file/d/1t3XamqCMw1adCUpbXTBVUqSwhtpcySJO/view?usp=sharing
