Variables y operadores

Las variables son usadas para almacenar valores a ser evaluados. En JavaScript no es necesario declarar las variables ya que automáticamente se convierten al tipo necesario mientras se ejecutan los comandos.

const nombre = valor; //Constante
let nombre = valor;   //Variable bloque
var nombre = valor;   //Variable local
nombre = valor;       //Variable Global

El nombre de una variable debe empezar por una letra o por el símbolo de subrayado ( _ ). Lo que siga a esto es indiferente. Pero distinguirá mayúsculas de minúsculas.

1. Variables

Una variable puede tener alcance local o global. Cuando es global se puede emplear en cualquier parte del programa. Las locales solo se pueden usar en la función donde fueron definidas.

Para crear una variable local le antepondremos la palabra var.

var indica = true;        //La variable es tipo boleana
indica = "prendido";      //Ahora es tipo texto
indica = 1;               //Ahora es numérica

Cualquier variable se suele escribir en minúsculas, aunque si este nombre de variable se compone de varias palabras, se suele escribir en mayúscula la primera letra de las siguientes palabras la primera (camelCase). Esto se hace así en cualquier tipo de variable o nombre menos en los nombres de las clases, donde se escribe también en mayúscula el primer carácter de la primera palabra. EsUnEjemplo.

Por ejemplo esta permitido definir como variables:

var Nombre;
var _Opcion15;
var mes3;

Estarían mal definidas las siguientes variables:

Además también estaría mal definido si pusiésemos como variable:

Debido a que son palabras reservadas del lenguaje.

Un ejemplo del uso de variables en JavaScript es el siguiente:

<Script>
   <!-- Ocultación a antiguos navegadores
   var saludo = 'Hola que tal...'
   var despedida = 'Si se portan mal...'
   document.write (saludo + ' Yo también ronco de noche.' + <br>)
   document.write (despedida + ' inviten.')
   // Fin de la ocultación-->
</Script>

<<< ejemplo.

En JavaScript Las mayúsculas y minúsculas si importan. Precio y precio son dos variable diferentes.

1.1 Numéricas

Un número. Los números no tienen comillas.

var edad = 50;
edad = 20;
let x = 3.14;

1.2 Cadena o String

Una cadena de texto. Para indicar que la variable es una cadena, debes escribirlo entre comillas. Puedes usar comillas simples o dobles.

var nombre = "Enrique";
nombre = "Enrique";
var edad = '36 años';
let txt = 'Aprender a programar con "JavaScript"';    //Combinación de comillas
let txt = "Aprender a programar con \"JavaScript\"";  //Escapar comillas (excluir)
let texto = 'Uno \nDos \nTres';                       //Usando salto de linea (secuencia de escape)

let x = 'JavaScript';
console.log('Estoy aprendiendo: ' + x);  //Estoy aprendiendo: JavaScript
console.log(x[0]);                       //J (primer caracter)
console.log(x[x.length -1]);             //t (ultimo caracter)

La función variable[n] es solo lectura, es decir no se puede usar para alterar un solo caracter de la cadena.

1.3 Lógicas o Boolean

Tienen valor true/false y no necesitan comillas.

var hombre = true;
var mujer = false;

2. Matrices o Arrays

Una estructura que te permite almacenar varios valores en una sola referencia.

var nombre = [elemento1, elemento2, ...];
var nombre = [[ele11, ele12, ...],[ele21, ele22, ...], ...];
console.log(nombre[i][j]);

var x = [1,3.14,'Tito',true,null];
console.log(JSON.stringify(x));   //Se ve toda la matriz
console.log(x[0]);  //1
console.log(x[2]);  //Tito
var y = [10,[1,2,3],'Hola'];

Una forma de crear las matrices de forma automática es con el siguiente código:

function HacerMatriz(n) {
   this.length=0;
   for (var i=1; i<n; i++){
      this[i]=0;
      return this;
   }
}
Métodos de matriz
MétodoDescripción
toString()Convierte una matriz en una cadena de valores de matriz (separados por comas).
join()Une todos los elementos de la matriz en una cadena.
pop()Elimina el último elemento de una matriz.
push()Agrega un nuevo elemento a una matriz (al final)
shift()Elimina el primer elemento de la matriz y "desplaza" todos los demás elementos a un índice inferior.
unshift()Agrega un nuevo elemento a una matriz (al principio) y "desvía" los elementos más antiguos
splice(pos,eliminar,elementos)Agregar nuevos elementos en una matriz
concat(matriz1,matriz2)Concatena 2 matrices
var x = [1,3.14,'Tito',true,null];
x.push(20);    //Agrega 20 al final
x.pop();       //Elimina el ultimo elemento (20)
x.shift();     //Elimina el primer elemento (1)
x.unshift('primero');  /agrega un elemento al principio del arreglo

3. Objetos

Básicamente cualquier cosa. Todo en JavaScript es un objeto y puede ser almacenado en una variable. Las propiedades se definen como pares nombre:valor separados por coma. Los métodos se definen como funciones.

var obj = {prop1:val1,prop2:val2,... propN:valN};

Para acceder a una propiedad debe usarse nombre del objeto (punto) nombre de propiedad.

var carro = {marca:'Mitsubishi',modelo:'Pajero iO',color:'blanco',año:2002};
//Para acceder:
console.log(carro.marca);    //Mitsubishi
console.log(carro['marca']); //Mitsubishi

Para acceder a un método solo hay que añadir ().

var carro = {marca:'Mitsubishi',modelo:'Pajero iO',arranca:function{return this.marca+' '+this.modelo;}};
//Para acceder:
consoles.log(carro.arranca());

Si llamas al método sin () obtendrás la definición de la función.

4. Operadores

Un operador es básicamente un símbolo matemático que puede actuar sobre dos valores (o variables) y producir un resultado. En la tabla de abajo aparecen los operadores más simples, con algunos ejemplos para probarlos en la consola del navegador.

4.1 Aritméticos

Aritméticos
OperadorDescripción
+Adición
-Sustracción
*Multiplicación
/División
%Modulo
++Incremento (+=)
--Decremento (-=)

4.2 De cadena

Concatenación
OperadorDescripción
+Concatenación

4.3 Asignación

Asignación
OperadorDescripción
x = yAsigna a x el valor de y
x += yAsigna a x el valor de x+y
x -= yAsigna a x el valor de x-y
x *= yAsigna a x el valor de x*y
x /= yAsigna a x el valor de x/y
x **= yAsigna a x el valor de x**y
x %= yAsigna a x el valor de x%y
x <<= yAsigna a x el valor de x=x<x<y
x >> yAsigna a x el valor de x=x>x>y
x >>>= yAsigna a x el valor de x=x>x>x>y
x &= yAsigna a x el valor de x=x&y
x &&= yAsigna a x el valor de x=x&&y
x ^= yAsigna a x el valor de x=x^y
x |= yAsigna a x el valor de x=x|y
x ||= yAsigna a x el valor de x=x||y
x ??= yAsigna a x el valor de x=x??y

Cuando se opera un valor de cadena con un numérico, el resultado es una cadena.

4.4 Coma

El operador coma evaluá cada uno de sus operandos (de izquierda a derecha) y retorna el valor del último operando.

expr1,exp2,expr3...
for (let i=0,j=9; i<=9; i++,j--){
  document.writeln("a[" + i + "][" + j + "] = " + a[i][j]);
}

4.5 Comparación

Comprueba si dos valores son iguales (===) o diferentes (!==) entre sí, y devuelve un valor de true/false (booleano). Puede usar el operador coma cuando deseé mútiples expresiones en una localización que requiere una sola expresión. El uso más común de este operador es proveer múltiples parámetros en un búcle for.

Comparación
OperadorDescripción
x == yIgualdad
x === yExactamente igual
x != yDistinto
x !== yEstrictamente distinto !(x === y)
x < yMenor
x > yMayor
x <= yMenos o igual
x >= yMayor o igual
console.log(1 !== 1);      //falso
console.log('1' !== 1);    //verdadero
console.log(0 !== false);  //verdadero

Mezclar tipos de datos puede dar lugar a resultados extraños cuando se hacen cálculos, así que asegúrate de que relacionas tus variables correctamente y de que recibes los resultados que esperabas. Por ejemplo, introduce "35" + "25" en tu consola. Por qué no obtienes lo que esperabas ? Porque las comillas convierten los números en strings — has acabado con los strings concatenados entre sí, y no con los números sumados. Si introduces 35 + 25, obtendrás el resultado correcto.

var a = '35';
var b = '25';
var c = a + b;  //'3525'

4.6 Lógicos

Son los operadores que nos permiten evaluar dos o mas condiciones.

Operadores lógicos
OperadorDescripción
&& - andPor lo menos una de las condiciones es verdadera
|| - orCualquiera de las condiciones es verdadero
?? - orComparador de null o undefined.
! - notNegación
x < 7 && x > 2;

4.7 Bit a bit

Para hacer operaciones a nivel de bit.

Operadores lógicos bit a bit
OperadorDescripción
& - andPor lo menos una de las condiciones es verdadera
| - orCualquiera de las condiciones es verdadero
^ - xorCuando solo una condiciones es verdadera.
const a = 5;  //0101
const b = 3;  //0011
console.log(a & b);  //0001
console.log(a | b);  //0111
console.log(a ^ b);  //0110

5. Operadores varios

Operadores
OperadorDescripción
newUsado para instanciar un objeto.
deleteSe usa para borrar propiedades de un objeto o elementos de una matriz (array). Devuelve true si la operación se realizó con éxito.
typeofDevuelve el tipo de dato al que pertenece una variable o expresión. Los tipos devueltos son: number, string, boolean, object, function o undefined.

5.1 New

Usado para instanciar un objeto.

var hoy = new Date('10/30/2012');

5.2 Delete

Se usa para borrar propiedades de un objeto o elementos de un array. Devuelve true si la operación se realizó con éxito.

var lista = new Array(1,4,7,9,10);
delete(lista,0);
var tipo = typeof(lista[0]); 
tipo esta undefined

5.3 Typeof

Devuelve el tipo de dato al que pertenece una variable o expresión. Los tipos devueltos son: number, string, boolean, object, function o undefined.

hoy = 1.2345;
tipo = typeof(hoy);
La variable tipo contendrá number.