Diferencias entre ECMAScript y JavaScript

                                          

Pareciera que hablamos de lo mismo cierto? , pero hay cierta diferencia ...

 Hagamos una analogía con algo con de lo que estamos un poco mas familiarizados , "un teclado".

Piensa en todos los teclados que has usado alguna vez...

¿Tenían todos casi el mismo orden, las letras en un orden especifico , una barra espaciadora , una tecla Enter, y números ubicados horizontalmente en la parte superior?

Esto es así porque la mayoría de los fabricantes de teclados basan su diseño en el estándar QWERTY

Estos pueden ser de distintos, colores, alámbricos , inalámbricos, bluetooth o mecánicos , pero el orden de las teclas será el mismo ,respetando un estándar "El estándar QWERTY. (imagen arriba)

otro estándar seria AZERTY (imagen abajo) , Notas la diferencia?

Con esto en claro , continuemos.

 -ECMAScript es un estándar (lo que en el teclado fue el orden especifico de sus teclas)

-Javascript el modelo que respeta y/o se ajusta a este estándar. 

 Javascript es un modelo (posiblemente el mas popular) que se ajusta a los estándares de ECMAScript , pero no va a ser el único que existe , un par de ejemplos son , JScript y ActionScript

  Esperemos esta pequeña explicación te haya ayudado a aclarar la diferencia entre ambos.

estaremos publicando próximamente contenido sobre la versión mas estable de ECMAScript y sobre el modelo mas popular de este JavaScript 

ECMAScript 6 .- Parametro rest

                                    

 sin el Parámetro rest

Para este ejemplo definiremos una función y le pasaremos varios argumentos, que se guardaran en varios parámetros, e imprimiremos en pantalla

const persona= (nombre,edad,pais,altura,peso,genero) => {

   console.log(nombre,edad,pais,altura,peso,genero);

   }

   persona('Erik',27,'mexico',175,58,'hombre');

Lo que imprime la consola

En muchas ocasiones los argumentos a pasar son muchos mas , y tener que asignarles un parámetro a cada uno, a veces es eterno o teníamos que recurrir a algunos trucos.

  Tenemos una forma de pasar todos los argumentos 

rest

 ...nombredevariable . automáticamente se declarara la variable , y  guardara todos los argumentos que le pasemos en un único parámetro de tipo array. 

const persona= (...datos) => {  // Un solo parametro recibira los argumentos  

   console.log(datos);          // imprimimos un array

   persona('Erik',27,'mexico',175,58,'hombre');

Obtendremos nuestros datos en un array que después podemos utilizar como necesitemos.

Otra circunstancia 

Al primer argumento queremos darle un parámetro propio y todos los demás en un único parámetro rest

const persona= (nombrepersona , ...datos) => {    

   console.log(nombrepersona)

   console.log(datos);          

   }

   persona('Erik',27,'mexico',175,58,'hombre');

Podemos manipular por aparte ahora ambos parámetros.

Conclusión

Conocimos una alternativa a pasar varios argumentos , te recomendamos practicar mucho con diferentes ejemplo.

despedida

Esperemos te haya servido de utilidad este articulo , síguenos en nuestras redes sociales para seguir aprendiendo juntos , compártenos cualquier duda o comentario que te haya surgido , puede ayudarnos a crecer a ambos.

TE DEJAMOS UNA imagen que puedes guardar como apuntes de tu progreso.

JavaScript .- Operadores de Asignación.

 

Explicación Importante

Tenemos ya una variable declarada y a esta variable queremos sumarle un nuevo valor

la lógica hasta ahora nos llevaría hacerlo de la siguiente manera.

let num_1 = 2; //declaramos

num_1 = num_1 + 5 ; //le asignamos un nuevo valor

console.log(num_1)  //Mostramos

Pero con el operador += logramos una equivalencia de código 

Ejemplo.

Código JavaScript

let num_1 = 2; //declaramos

//A mi variable le sumamos , la variable + el numero indicado

   num_1 += 5 ; //Sumamos 

// num_1 = num_1 + 5 

console.log(num_1)  //Mostramos en consola

Prácticamente al signo = le añadimos un operador aritmético para crear nuevos operadores.

Operador	Ejemplo	Es igual que escribir
=	x = y	x = y
+=	x += y	x = x + y
-=	x -= y	x = x - y
*=	x *= y	x = x * y
/=	x /= y	x = x / y
%=	x %= y	x = x % y

Ejemplos.

Suma (cadenas de texto)

Código JavaScript

let texto = "Apuntes"; //declaramos

   texto += "Navarrete" ; //operamos 

   //Es equivalente a escribir

// texto = texto + "Navarrete" 

console.log(texto)  //Mostramos

Resta

Código JavaScript

let num_1 = 9; //declaramos

   num_1 -= 2 ; //operamos 

   //Es equivalente a escribir

// num_1 = num_1 - numero 

console.log(num_1)  //Mostramos

Multiplicación

Código JavaScript

let num_1 = 5; //declaramos

   num_1 *= 2 ; //operamos 

   //Es equivalente a escribir

// num_1 = num_1 * numero 

console.log(num_1)  //Mostramos

División 

Código JavaScript

let num_1 = 20; //declaramos

   num_1 /= 2 ; //operamos 

   //Es equivalente a escribir

// num_1 = num_1 / numero 

console.log(num_1)  //Mostramos

Residuo

Código JavaScript

let num_1 = 19; //declaramos

   num_1 %= 2 ; //operamos 

   //Es equivalente a escribir

// num_1 = num_1 % numero 

console.log(num_1)  //Mostramos

Conclusión

Hemos aprendido una nueva forma de operar utilizando el signo =  mas operadores básicos , lo que facilita nuestra escritura de código , que si bien , parece ahorrarnos poco código , en un entorno real , donde has cientos de líneas de código , este ahorra será un gran alivio.

despedida

Esperemos te haya servido de utilidad este articulo , síguenos en nuestras redes sociales para seguir aprendiendo juntos , compártenos cualquier duda o comentario que te haya surgido , puede ayudarnos a crecer a ambos.

TE DEJAMOS UNA imagen que puedes guardar como apuntes de tu progreso.

 

JavaScript .- Operadores Aritméticos .

 En nuestras declaraciones podemos realizar varias operaciones aritméticas como lo son ;

Operador	Descripción
+	Suma
-	Resta
*	Multiplicación
**	Exponente
/	División
%	Modulo
++	Incremento
--	Decremento

 Suma +

Vamos directo a un ejemplo , podemos guardar directamente una suma en una variable.

vamos a mostrar todos nuestros ejemplos con console.log.

Código JavaScript

let Resultado_suma = 3 + 2 ; // 5

console.log(Resultado_suma)

lo que muestra la consola

Cuando usamos el operador Suma con cadenas de texto en lugar de números , estas se concatenaran (unirán)

Código JavaScript

let Resultado_suma = "Hola" + "Mundo" ;

console.log(Resultado_suma)

lo que muestra la consola

También podemos sumar 2 variables y guardar el resultado en una nueva variable.

Código JavaScript

let num_1 = 1 ;

let num_2 = 2 ;

let num_3 = 4 ;

let suma_numeros = num_1 + num_2 + num_3 ; // 7

console.log(suma_numeros)

lo que muestra la consola

Como podemos observar las operaciones se pueden hacer con mas de 2 operandos

Resta -

Código JavaScript

let num_1 = 9 ;

let num_2 = 2 ;

let resta_numeros = num_1 - num_2 ; // 7

console.log(resta_numeros)

lo que muestra la consola

Multiplicar *

Código JavaScript

let num_1 = 5 ;

let num_2 = 2 ;

let multiplicacion_numeros = num_1 * num_2 ; // 10

console.log(multiplicacion_numeros)

lo que muestra la consola

Dividir /

Código JavaScript

let num_1 = 14 ;

let num_2 = 2 ;

let divicion_numeros = num_1 / num_2 ; // 7

console.log(divicion_numeros)

lo que muestra la consola

Modulo %

Si la división la hiciéramos con un resultado entero , este operador nos devuelve el resto. 

Código JavaScript

let num_1 = 5 ;

let num_2 = 2 ;

let resto_numeros = num_1 % num_2 ; // 1

console.log(resto_numeros)

 

lo que muestra la consola

Incremento ++

Incrementa en una unidad (1) nuestro numero.

Código JavaScript

let numero = 6;

numero++ ;

console.log(numero) // 7

 

lo que muestra la consola

Decremento --

Disminuye en una unidad (1) nuestro numero.

Código JavaScript

let numero = 6;

numero-- ;

 console.log(numero) // 5

lo que muestra la consola

Exponente

Código JavaScript

let numero = 6;

let numero_elevado = numero ** 2 ;

 console.log(numero_elevado); // 36

lo que muestra la consola

Agrupación y orden

Como puedes observar son operaciones básicas que nos enseñaron temprano en la escuela, también podemos usar varias en la misma expresión y como la aritmética tradicional , obedecerá las leyes de los signos y agrupación

Te dejamos algunos ejemplos

Código JavaScript

let operacion_1 = (2+2) * 3; // 12

let operacion_2 = (2+2) ** 3; // 64

let operacion_3 = (2+2)*(2+2); // 16

console.log(operacion_1);

console.log(operacion_2);

console.log(operacion_3);

lo que muestra la consola

conclusión

Como puedes ver, dentro de JavaScript podemos hacer operaciones como en aritmética , y de un uso muy simple , y aunque podemos hacer operaciones todavía mas complejas , con esto tendremos para rato , no olvides practicar todas las operaciones que se te ocurran.

despedida

Esperemos te haya servido de utilidad este articulo , síguenos en nuestras redes sociales para seguir aprendiendo juntos , compártenos cualquier duda o comentario que te haya surgido , puede ayudarnos a crecer a ambos.

TE DEJAMOS UNA imagen que puedes guardar como apuntes de tu progreso.

 

JavaScript .- Variables ,Diferencias entre let , const y var.

Sobrescribir variables

Las variables escritas con let pueden sobrescribirse , podemos manipular su valor conforme lo necesitemos en la aplicación.

He declarado una variable "mejor_amigo" , pero este cambiara a lo largo de mi aplicación(como de nuestra vida :( )

let mejor_amigo = 'carlos' //declaramos

console.log(mejor_amigo) //carlos

mejor_amigo = 'pedro' //llamamos y renombramos

console.log(mejor_amigo) //pedro

Hemos renombrado la variable de Carlos a pedro.

const

Las variables escritas con const no podrán sobre-escribirse , como su nombre lo indica (son constantes) .

Por ejemplo definiremos una variable llamada mama, que sin importar el tiempo será igual en toda la aplicación (y en nuestra vida :) ), e intentaremos renombrar esta variable const

const madre = 'Marisol'

console.log(madre) //Marisol

madre = 'Clarita'

console.log(madre) //error

Lo que imprimirá la consola

nota ; los nombres de variables (identificadores) , si pueden tener acento , pero no es muy recomendado su uso.

 

conclusión

 Con let podemos re-definir valores , y con const no

Alcance de bloque

Compliquemos solo un poco el asunto , let y const van a tener un alcance de bloque , es decir , toda porción de código encerrada entre llaves: {} 

*ya debiste ver los artículos sobre visualización de datos (consolé).

const nombre= "Erik" ; 

console.log("El nombre fuera del bloque es") 

console.log(nombre)    

{

    const nombre= "Carlos"

    console.log("el nombre dentro del bloque es") 

    console.log(nombre)

//lo que imprimiremos sera la variable nombre dentro de este bloque

//que nada tiene que ver con las variables definidas afuera

}

console.log("El nombre fuera del bloque sigue siendo") 

console.log(nombre)    

Un ejemplo mas , con mas bloques y un poco mas limpio.

const nombre= "Erik" ; 

console.log(nombre)    

{

    const nombre= "Carlos"

    console.log(nombre)

}

{

    const nombre= "Pedro"

    console.log(nombre)

}

console.log("El nombre fuera del bloque sigue siendo") 

console.log(nombre) 

Resultado que imprime la consola

Hablemos sobre var 

-let y const fueron implementadas para sustituir a var , y si bien declarar variables con var es posible, ya no es aconsejable .

-Var ; no tiene una restricción de bloque , lo que usarlo nos deja un código difícil de estructurar y causa problemas si no nos fijamos bien en las variables que declaramos, solo deberíamos usarla en el remoto caso de que necesitemos declarar una variable Global , que se pueda acceder a su valor , dentro y fuera de los bloques.

conclusión 

En conclusión ; la mayoría de variables debes declararlas con const , pero si  necesitas que tu variable cambie su valor  , en ese caso usa let .

 var nunca pero nunca ,deberías utilizarla en la actualidad , siempre habrá una solución mejor que usar var.

despedida

Esperemos te haya servido de utilidad este articulo , síguenos en nuestras redes sociales para seguir aprendiendo juntos , compártenos cualquier duda o comentario que te haya surgido , puede ayudarnos a crecer a ambos.

TE DEJAMOS UNA imagen que puedes guardar como apuntes de tu progreso.

JavaScript .- Variables

 

¿Qué es una variable? 

En el capitulo anterior hablamos ya un poco de este tema,  tratemos de explicarlo un poco mejor.

-Las variables son palabras que escribimos (que representan memoria en el sistema) , para guardar algún tipo de información (texto , datos , etc).

Buscando una analogía en la vida real , las variables representan una caja donde podemos guardar cosas para después utilizarlas.

Formas de escribir variables (Declararlas)

Tenemos 3 formas de declararlas , var , let y const.

vamos a ver un ejemplo relacionado con analogía sobre cajas.

imagen basada en el vector 

Ejemplo practico

crearemos 2 variables con un nombre que haga referencia a perros y esta almacenara su raza .

 

let perro_1 = "Bulldog";

let perro_2 = "Sin raza";

Ejemplo Grafico

imagen basada en ; vector , perro_1 y perro_2

Las variables las podemos y/o debemos nombrar dependiendo de nuestras necesidades .

otro ejemplo rápido seria.

let perro_mio = "Bulldog";

let perro_calle = "Sin raza";

Recordemos que las variables no solo pueden almacenar cadenas de texto si no también números.

por ejemplo.

let perro_caja1 = 3 ;

let perro_caja2 = 2 ;

y podemos sumas estas 2 variables y guardar esa suma en una nueva variables .

let perros_caja1 = 3 ;

let perros_caja2 = 2 ;

let perros_totales = perros_caja1 + perros_caja2;

Ejemplo grafico

Los operadores + - * / y de mas , se explicaran en el siguiente capitulo, lo que queremos que te quede claro es la posibilidad de guardar variables dentro de otras variables (cajas dentro de otras cajas.)

Identificadores y sus reglas

Repasemos un poco este tema los identificadores son los nombres que le ponemos a las variables y si bien podemos nombrarlas como queramos tenemos que seguir unas simples reglas.

• Los nombres pueden contener letras, dígitos, guiones bajos y signos de dólar.
• Los nombres deben comenzar con una letra
• Los nombres también pueden comenzar con $ y _ (pero no los usaremos en este tutorial)
• Los nombres distinguen entre mayúsculas y minúsculas (y e Y son variables diferentes)
• Las palabras reservadas (como las palabras clave de JavaScript) no se pueden utilizar como nombres

por ejemplo.

Declarar una variable y luego nombrarla

Un uso muy común es este , escribimos let,var o const le asignamos un nombre, pero la dejamos sin valor , para asignárselo después,

Ejemplo Código JavaScript 

let perro_mio ;

perro_mio = "Bulldog";

Declarar varias variables

podemos declarar varias variables seguidas separándolas por coma , por ejemplo.

let perro_mio = "bulldog" , perro_vecino = "callejero"

recordemos que JavaScript no toma en cuenta los saltos de linea , nuestro código podría escribirse así.

let perro_mio = "bulldog" ,

 perro_vecino = "callejero",

 perro_amigo = "San bernardo"

Ahora escribamos varias variables , y les asignamos valor después.

let perro_mio,perro_vecino,perro_amigo;

 perro_mio = "bulldog" ,

 perro_vecino = "callejero",

 perro_amigo = "San bernardo";

Conclusión;

en esta ocasión entramos mas a profundidad en las variables , te recomendamos practicar muchísimo la forma de nombrarlas y visualizarlas , te dejaremos un articulo de ejercicios , es un tema muy simple y sencillo pero demasiado importante , dedícale tiempo a dominarlo de pies a cabeza.

despedida

Esperemos te haya servido de utilidad este articulo , síguenos en nuestras redes sociales para seguir aprendiendo juntos , compártenos cualquier duda o comentario que te haya surgido , puede ayudarnos a crecer a ambos.

TE DEJAMOS UNA imagen que puedes guardar como apuntes de tu progreso.