1.- En línea

Poniendolo en una etiqueta utlizando eventos

<h1 onclick="alert('Hola saludo ..!!')">Rancio</h1>

2.- Como contenido en la etiqueta <script>

<script>
    alert('Hola saludo ..!!');
</script>

3.- Como contenido en um archivo de formato .js

Enlazamos el archivo .js a nuestro documento

<script src="miArchivo.js"></script>

4.- Con un Require

1.- alert( ): Metódo muestra resultado con un mensaje de alerta

<script>
    alert("Hola mundo...!");
</script>

2.- console.log( ): Metódo muestra resultado por la consola del navegador

<script>
    console.log("Hola mundo...!");
</script>

3.- document.write( ): Metódo imprime resultado en nuestro documento

<script>
    document.write("Hola mundo...!");
</script>

Tipos de datos

• Cadenas de texto (string): Van entre comillas dobles ("x") o simples ('x')

  var string = "Cadena de texto";
  var string = "876";

• Números (numbers): Pueden ser enteros y flotantes
• Boolean (bool): Solo pueden contener uno de dos valores: (verdadero o falso), (True o False), (1 ó 0)

Casos especiales de Datos

Cuando la variable no está definida o hay un error

1. Undefined: La variable existe pero no tiene valor, está sin definir.
2. Null: La variable esta definida y su valor es vacío. Ejemplo: let nombre = Null;
3. NaN: El valor de la variable no es un número.

Declarar una variable

1. var
2. let
3. const

Operadores de Asignación:

Asigna un valor al operando de la izquierda basado en el valor del operando de la derecha.

Nombres	Abreviaciones	Significado
Asignación	x = y	x = y
Asignación de adisión	x += y	x = x + y
Asignación de sustracción	x -= y	x = x - y
Asignación de multiplicación	x *= y	x = x * y
Asignación de división	x /= y	x = x / y
Asignación de Resto	x %= y	x = x % y
Asignación de exponenciación	x **= y	x = x ** y
Asignación de desplazamiento a la izquierda	x <<= y	x = x << y
Asignación de desplazamiento a la derecha	x >>= y	x = x >> y
Asignación sin signo de desplazamiento a la derecha	x >>>= y	x = x >>> y
Asignación AND	x &= y	x = x & y
Asignación XOR	x ^= y	x = x ^ y
Asignación OR	x |= y	x = x | y

Operadores Aritméticos

Toman valores númericos (ya sean literales o variables) como sus operando y retornán un valor númerico único.

Nombre	Operación	Resultado
Adisión (+)	suma = 25 + 50;	75
Decremento (--) menos uno	num1 = 10; num1--;	9
División (/)	division = 10 / 5;	2
Exponenciación (**)	potencia = 10 ** 3;	1000
Incremento (++) más uno	num1 = 10; num1++;	11
Multiplicación (*)	multiplica = 10 * 5 ;	50
Resto (%)	resto = 10 % 5;	0
Sustracción (-)	resta = 10 - 5;	5
Negación Unaria (-)	num1 = 10; resultado = -num1;	-10

Operadores de Comparación

Los operadores de comparación comparán dos expresiones y devuelven un valor Boolean que representa la relación de sus valores, que devuelven true o false

Operación	Signo	Significado
Igual que	(a == b)	5 es igual a 5
Es distinto a	(a != b)	3 es distinto a 5
Es exactamente igual	(a === b)	X es exactamente igual a X
No exactamente igual	(a !== b)	5 no exactamente igual a '5'
Es menor que	(a < b)	3 es menor que 5
Es mayor que	(a > b)	5 es mayor que 3
Es menor o igual que	(a <= b)	3 es menor o igual que 5
Es mayor o igual que	(a >= b)	5 es mayor o igual que 3

Operadores Lógicos

Los operadores lógicos nos devuelven un resultado a partir de que se cumpla (o no) una condición, su resultado es booleano, y sus operadores son valores lógicos o asimilables a ellos

Descripción	Operador	Uso
Devuelve true sólo cuando ambos valores son true	AND (&&) y	expre1 && expre2
Devuelve true si cualquiera de los valores es true	OR (||) o	expre1 || expre2
Invierte el valor, true produce false y false un true	NOT (!) no	!expre

Sentencia while (8634)

El bucle while repite la condición mientras ésta sea verdadera

let num = 0;
//Mientras num sea menor a 10 se repite el bucle
while(num < 10){
    //Sumamos uno en cada pase
    num++;
    document.write(num + " - ");
}

Resultado: 1 - 2 - 3 - 4 - 5 - 6 - 7 - 8 - 9 - 10 -

// Como 10 no es menor a 10, termina el bucle

Sentencia do while (9099)

El bucle do while ejecuta primero y luego pregunta. Todo lo contrario al while

let num = 0;
do{
    // Ejecuta primero
    document.write(num + " - ");
    //Sumamos uno en cada pase
    num++;  
}
while(num < 10);

Resultado: 0 - 1 - 2 - 3 - 4 - 5 - 6 - 7 - 8 - 9 - 

// Como 10 no es menor a 10, termina el bucle

Sentencia break (9234)

Break termina la sentencia del bucle.

Ejemplo: tenemos un bucle que nos muesta 15 registros

let num = 0;
// Si num es menor a 15
while(num < 15){
    // Sumale uno
    num++;
    // Muestrame resultado
    document.write(num + " - ");
}

Resultado: 1 - 2 - 3 - 4 - 5 - 6 - 7 - 8 - 9 - 10 - 11 - 12 - 13 - 14 - 15 -

Al bucle anterior le decimos que si encuentra al 8, pare de buscar.

let num = 0;
// Si num es menor a 15
while(num < 15){
    // Sumale uno
    num++;
    // Muestrame resultado
    document.write(num + " - ");
    // Si num es igual a 8
    if(num == 8){
        // Finaliza el bucle
        break;
    }
}

Resultado: 1 - 2 - 3 - 4 - 5 - 6 - 7 - 8 -

Sentencia for (9486)

Es en bucle determinado, ya que nosotros le indicamos cuando parar.

// Consta de tres partes
for(
    //Declaramos una variable y la inicializamos en cero
    i = 0;
    //Le damos una condición, se ejecuta mientras que i sea menor que 6
    i < 6;
    //Interación (aumento o decremento) Le suma uno en cada vuelta
    i++;
)

//Ejemplo 1:
for( i=0; i<6; i++ ){
    document.write( i + " - " );
}

Resultado: 0 - 1 - 2 - 3 - 4 - 5 -

//Ejemplo 2:
for( i=6; i>=0; i--){
    document.write( i + " - " );
}

Resultado: 6 - 5 - 4 - 3 - 2 - 1 - 0 -

Queremos que termine en la vuelta 4

for( i=0; i<6; i++ ){
    document.write( i + " - " );
    // Si i es igual a 4 termina
    if( i == 4 ){
        break;
    }
}

Resultado: 0 - 1 - 2 - 3 - 4 -

Queremos que termine antes de mostrar el 4

for( i=0; i<6; i++ ){
    // Si i es igual a 4 termina
    if( i == 4 ){
        break;
    }
    document.write( i + " - " );
}

Resultado: 0 - 1 - 2 - 3 -

Queremos que no muestre el 4

for( i=0; i<6; i++ ){
    // Si i es igual a 4 termina
    if( i == 4 ){
        continue;
    }
    document.write( i + " - " );
}

Resultado: 0 - 1 - 2 - 3 - 5 -

Sentencia continue (10068)

Permite saltar o ingnorar un item o registro de un bucle

// Este bucle for nos muetra del 0 al 10
for( i=0; i<=10; i++ ){
    document.write( i + " - " );
}
Resultado: 0 - 1 - 2 - 3 - 4 - 5 - 6 - 7 - 8 - 9 - 10 -

// No muestro el número 5
for( i=0; i<=10; i++ ){
    // Si i es igual a 5, no lo muestre y continúa
    if( i == 5 ){
        continue;
    }
    document.write( i + " - " );
}
Resultado: 0 - 1 - 2 - 3 - 4 - 6 - 7 - 8 - 9 - 10 -

Sentencia for in (10190)

La sentencia for in nos permite trabajar con arrays y nos devuelve la posición o indice de los elementos del arrays

let animales = ["perro", "gato", "caballo"];
// Muestra los indices
for(animal in animales){
    document.write(animal + " - ");
}
Resultado: 0 - 1 - 2 -

// Para mostrar los elementos de cada indice
for(animal in animales){
    document.write(animales[animal] + " - ");
}
Resultado: perro - gato - caballo -

Sentencia for of (10190)

La sentencia for of nos permite trabajar con arrays y nos devuelve el valor de los elementos del arrays

let animales = ["perro", "gato", "caballo"];
// Muestra el elemento o valor de cada indice
for(animal of animales){
    document.write(animal + " - ");
}
Resultado: perro - gato - caballo -

Sentencia label (10580)

Nos permite asociar un bucle a un nombre para poder terminarlo cuando queramos menos a for in.

//** Ejemplo: Tenemos un array dentro de otro array

array1 = ["Maria","Josefa","Roberta"];
array2 = ["Pedro","Marcelo",array1,"Josefina"];
// Recorremos el primer array
for(let array in array2){
    // En caso de que estemos en la posición 2 (que es un array)
    if(array == 2){
        // Recorremos ese array
        for(let array of array1){
            // Los mostramos en pantalla
            document.write(array + " - ");
        }
    // En caso de que no sea 2
    }else{
        // Lo mostramos en pantalla
        document.write(array2[array] + " - ");
    }
}

Resultado: Pedro - Marcelo - Maria - Josefa - Roberta - Josefina -

En caso de querer terminar el bucle si es [2] (no quiero mostrar el array1) usando break después de document.write

array1 = ["Maria","Josefa","Roberta"];
array2 = ["Pedro","Marcelo",array1,"Josefina"];
// Recorremos el primer array
for(let array in array2){
    // En caso de que estemos en la posición 2 (que es un array)
    if(array == 2){
        // Recorremos ese array
        for(let array of array1){
            // Los mostramos en pantalla
            document.write(array + " - ");
            break;
        }
    // En caso de que no sea 2
    }else{
        // Lo mostramos en pantalla
        document.write(array2[array] + " - ");
    }
}

Resultado: Pedro - Marcelo - Maria - Josefina -

En caso de querer terminar el bucle si es [2] (no quiero mostrar el array1) usando break antes de document.write

array1 = ["Maria","Josefa","Roberta"];
array2 = ["Pedro","Marcelo",array1,"Josefina"];
// Recorremos el primer array
for(let array in array2){
    // En caso de que estemos en la posición 2 (que es un array)
    if(array == 2){
        // Recorremos ese array
        for(let array of array1){
            break;
            // Los mostramos en pantalla
            document.write(array + " - ");
        }
    // En caso de que no sea 2
    }else{
        // Lo mostramos en pantalla
        document.write(array2[array] + " - ");
    }
}

Resultado: Pedro - Marcelo - Josefina -

En caso de querer terminar el bucle si es [2] (no quiero mostrar el array1) usando continue después de document.write

array1 = ["Maria","Josefa","Roberta"];
array2 = ["Pedro","Marcelo",array1,"Josefina"];
// Recorremos el primer array
for(let array in array2){
    // En caso de que estemos en la posición 2 (que es un array)
    if(array == 2){
        // Recorremos ese array
        for(let array of array1){
            // Los mostramos en pantalla
            document.write(array + " - ");
            continue;
        }
    // En caso de que no sea 2
    }else{
        // Lo mostramos en pantalla
        document.write(array2[array] + " - ");
    }
}

Resultado: Pedro - Marcelo - Maria - Josefa - Roberta - Josefina -

En caso de querer terminar el bucle si es [2] (no quiero mostrar el array1) usando continue antes de document.write

array1 = ["Maria","Josefa","Roberta"];
array2 = ["Pedro","Marcelo",array1,"Josefina"];
// Recorremos el primer array
for(let array in array2){
    // En caso de que estemos en la posición 2 (que es un array)
    if(array == 2){
        // Recorremos ese array
        for(let array of array1){
            continue;
            // Los mostramos en pantalla
            document.write(array + " - ");
        }
    // En caso de que no sea 2
    }else{
        // Lo mostramos en pantalla
        document.write(array2[array] + " - ");
    }
}

Resultado: Pedro - Marcelo - Josefina -

En los casos anteriores, solo detenemos el for contenedor del array1, por lo que nos muestra a Josefina, para detener toda la operación nos valemos de la sentencia lebel.

array1 = ["Maria","Josefa","Roberta"];
array2 = ["Pedro","Marcelo",array1,"Josefina"];
// Sentencia lebel (Nombre asignado al primer for)
forTirone:
// Recorremos el primer array
for(let array in array2){
    // En caso de que estemos en la posición 2 (que es un array)
    if(array == 2){
        // Recorremos ese array
        for(let array of array1){
            // Los mostramos en pantalla
            document.write(array + " - ");
            break forTirone:;
        }
    // En caso de que no sea 2
    }else{
        // Lo mostramos en pantalla
        document.write(array2[array] + " - ");
    }
}

Resultado: Pedro - Marcelo - Maria -