Estructura del lenguaje

Clase 17 de 51 • Fundamentos de JavaScript 2017

Clase anteriorSiguiente clase

Resumen

Algunas características del lenguaje son:

Podemos asignarle cualquier valor a las variables, podemos asignarle strings, números, fechas, funciones, objetos, etc.
Si definimos una variable con const no podemos reasignar el valor al que hacen referencia
Las variables definidas con var y let pueden ser reasignadas
El carácter punto y coma no es obligatorio,

Fabricio Rodríguez Aguirre

student•

Carpe diem:

¿Lenguaje fuertemente tipado?
¿Buena práctica? ¿Mala práctica?
¿strict mode?¿IIFE?
¿scope?

Pienso que JS tiende a contentar a todos, pero en su esfuerzo ninguno termina contento. En general JS es un lenguaje en el que cada uno encuentra la manera más cómoda de programar, el problema radica es que es difícil de mantener.

Si cada programador muestra su personalidad (alias gusto) en el código, para otro programador que tome la posta, le será cuesta arriba porque no sólo tiene que interpretar el código, sino también tiene que decifrar la personalidad del primero.

Las arrow functions lucen extremadamente “pro”, pero el código pierde legilibilidad. Es “nice” tener la opción de colocar “,” al final de cada sentencia, pero es un ápendice anacrónico de una época pretérita, cuando los compiladores eran tan primitivos que los programadores estaban obligados a colocar un caracter para separar cada sentencia.

Pero porqué leguanjes como C, Fortran, Java, JS, etc…, mantienen aspectos que ya debieron haber desparecido, la explicación es sencilla, “los programadores”, o sea se hace, nosotros. Mientras veamos que el código debe reflejar la diversidad de nuestras personalidades y realidades vitales (como si fueramos Cervantes), nunca estaremos contentos con ningún lenguaje.

Saluti,
Fabricio

Mateo Zapata Maldonado Zapata Maldonado

student•

¡Que grandiosa respuesta!, me encanta, la programación y la personalidad de cada individuo se convierte en un estándar particular, la manera bonita de programar es plenamente subjetiva y se debe respetar pero con la única condición de trabajar bien en equipo, los grupos heterogeneos trabajan mucho mejor.

Daniel Alexander Gazcón Rodríguez

student•

Totalmente de acuerdo. Hoy en dia JS es uno de los lenguajes mas complejos que hay y es mas que nada por su excesiva flexibilidad.

student•

Hagamos una aclaracion sobre las declaraciones de las variables

const nombre = "Henry"  // Esto NO variable, es una constante y NO CAMBIARA SU VALOR.

var edad = 27  // Esta variable SI puede cambiar su valor.

let variable = 'something' // Esta es una variable que también podra cambiar su valor, pero solo vivirá en el bloque donde fue declarada.

Víctor Rueda

student•

Por favor, seamos adultos responsables y que no se pierda la bonita costumbre del “;”

Arath Jimenez

student•

Alabado sea el ;

Jose Manuel Montaño Saenz

student•

no se uds pero amo el ;

Iván Darío Sánchez Jiménez

student•

Yo también pero hasta depués de esta explicación iniciare mi divorcio con el ;

Hasta esta parte del curso puse ; acada una de mis instrucciones pero comprendiendo la forma en que interpreta JS quiero empezar a evitar esta redundancia

Jose Manuel Montaño Saenz

student•

podrías hacerlo desde que tengas cuidado con las funciones IIFE

Alexis Antonio Moraga Gallardo

student•

Hola les comparto mi repositorio con el avance del curso

Repositorio

En el están los ejercicios realizados en clase comentados, y mis notas personales

/*Estructura del lenguaje*/


//VARIABLES DEBILMENTE TIPADAS
var nombre = "alexis"
alexis = 25
alexis = new Date()
/*en javascripr no declaramos el tipo de la variable que estamos inicializando, por lo cual es posible
inicializar una variabele como string, y luego asignarle un valor numerico o una fecha
*/

//AÑADIR FUNCIONES A VARIABLES O CREAR OBJETOS CON ELLAS
var saludo = function saludar(){alert("hola")}

var objeto ={
  propiedad1:true,
  propiedad2:false
}
/*es posible añadir funciones como valores de una variable
Y crear objetos con las mismas, estos tienen propiedades, la cuales reciven su valor usando : y
cada una de estas propiedades es separada por una coma
*/


//TIPOS DE VARIABLES
const edad = 26
//esto es una constante, y apesas de ser llamado variable su valor no puede ser cambiado, tambien es conocida como constante

let edad =25
/*esta es una variable de alcance local, es util para no escapar el valor de la misma mediante el scope.
un ejemplo claro seria en un ciclo for*/

for (var i = 0; i < 10; i++) {
}
/*el scope de la variable i escapa fuera del ciclo, ya que usamos la palabra rservada var y esto genera algo llamado hoisting
lo cual vendria a ser algo como esto*/
var i = 0
for (i ; i < 10; i++) {
}
/*para evitar contaminar el scope usamos let*/


edad /*si usamos las variables sin un prefijo las estamos declarando como globales, si esto lo hacemos dentro de una funcion
esta escapara al scope de la funcion y modificara el valor de la variable global*/

//PALABRAS RESERVADAS
  /*Javascript como muchos otros lenguajes tinen palabras reservadas, las cuales no podemos usar para definir variables
    algunas de ellas son:
    -break  -case   -catch  -continue   -debugger   -default  -delete   -do   -else   -false  -finally
    -for    -function   -if   -in   -instanceof   -new  -null   -return   -switch   -this   -throw -true
    -try  -typeof   -var  -void   -while  -with

estos son nombres de funciones de javascript
  */

  //USO DE ;

  /*en javascript no es necesario el punto y coma salvo en elgunas contadas ocaciones, como las que veremos a continuacion

en javascript existen funciones que se pueden invocar inmediatamente cuando es ejecutado el scipt, estas son conocidas como
IIFE (Inmediatly Invoked Function Express), y se esciben de la siguiente forma
  */
var nombre = "alexis"
  (function saludar(nombre){
    alert(`hola ${nombre}`)
  })()

  /*el problema es que javascript lee esta sentencia de la siguiente forma
  var nombre = "alexis"(function saludar(nombre){
      alert(`hola ${nombre}`)
    })()


    por lo cual trata de acceder a la funcion nombre, la cual no existe.
     en este caso puntual, es necesrio añadir un ; ya sea al final de la declaracion de la variable, o antes de comenzar la funcion
  */
  var nombre = "alexis"
  ;(function saludar(nombre){
      alert(`hola ${nombre}`)
    })()

/*Otro ejemplo de cuando es necesario ; es cuando declaramos un arreglo sin asignarlo a una variable */

var dias = 1

[
  "lunes",
  "martes",
  "miercoles"
].foreach(function(dia)){
  console.log("dia")
}

/*en este caso pasa esacamente lo mismo que en el anterior, y lo podemos solucionar añadiendo un ; o asignando el arreglo a una variable */

var dias = 1

;[
  "lunes",
  "martes",
  "miercoles"
].foreach(function(dia)){
  console.log("dia")
}
/*------*/
var dias = 1

var dias2 =[
  "lunes",
  "martes",
  "miercoles"
].foreach(function(dia)){
  console.log("dia")
}

Usuario anónimo

user•

Alguien me podria explicar, cual es la diferencia entre usar “var” y “let”

GRACIAS.

Yeison Daza

student•

Justo lo aprendes en esta clase, https://platzi.com/clases/fundamentos-javascript/concepto/conocimientos-intermedios/entiende-el-scope-de-las-variables/material/

Yeison Daza

student•

Justo lo aprendes en esta clase, https://platzi.com/clases/fundamentos-javascript/concepto/conocimientos-intermedios/entiende-el-scope-de-las-variables/material/

Victor Riveros

student•

Vengo de PHP donde es obligatorio el ;, pero creo que es mejor no usarlo en lenguajes donde no suma ni resta que lo tenga.
Solo lo usare en los casos específicos mencionados en el vídeo.

Rodrigo Andres Ramirez Trujillo

student•

Estoy muy de acuerdo contigo, yo también aplicare para algunos casos, he trabajado en lenguajes como Python y Golang donde no he tenido absolutamente ninguna incomodidad en todos los proyectos que he hecho.

Saludos

JUAN SEBASTIAN RODRIGUEZ JIMENEZ

student•

Totalmente de acuerdo en JavaScript es muy raro algun error producido por el uso de ;

Andrés Felipe Cañola

student•

El video no carga

Belen Ceballos

student•

Prueba utilizando el Servidor B desde el engranaje.

Diego Alexander Londoño

student•

@smdigital Cañola pongase serio ;P

Omar Eduardo Vásquez Chavarri

student•

yo particularmente prefiero usar el “;”

Roxsy velasquez

student•

IIFE es lo mismo que función auto ejecutable?

Giancarlo Vera Burgos

student•

Exacto 😃

David Fernandez Martin

student•

Yo las conocía como funciones anónimas, porque en realidad no tienen nombre.

Ronald Alexander Palacios Garrido

student•

Una IIFE (Immediately Invoked Function Expression) constituye un patrón de diseño usado comúnmente en Javascript (por bibliotecas, como jQuery, Backbone.js, Modernizr, y muchas más) para encapsular un bloque de código dentro de un ámbito local.![]

Miguel Costero

student•

En este link https://programacionymas.com/blog/funciones-javascript-invocadas-inmediatamente-IIFE se puede encontrar una muy buena explicación de lo que son las IIFE.

Sergio Andujar

student•

Yo pondría siempre ;

Por cierto, esto no lo sabía y me ha gustado mucho:

const nombre="Sergio";


(function saludar(){
	console.log(`Hola ${nombre}`);
})()

No hace falta llamar a la función para que salga en la consola, muy interesante.

Marco Pajuelo

student•

Las variables no son fuertemente tipadas.
Se debe reducir al mínimo el scope de las variables.
“;” -> Es recomendable usarlo aún más cuando se trabaja con IIFE. O para evitar problemas de sintaxis en javascript en ciertos escenarios.
IIFE: Inmeidately Invoked Function Expression. Funciones que son invocadas inmediatamente. Es usada por la privacidad de los datos. Las variables declaradas con var en Javascript tienen un alcance a nivel de función (solo se pueden usar en la función que las contiene). Por esa razón toda variable declarada dentro de una IIFE no puede ser usada por fuera. Se puede lograr un mejor rendimiento usando IIFEs. Minificar código. Otro beneficio de usar IIFEs es que ayuda a optimizar el proceso de minificación.

Cristian Franco Bedoya

student•

const nombre = "Cristian"

; (function saludar() {
  console.log(`Hola ${nombre}`)
}) ()

;[
  "EAFIT",
  "UdeA"
].forEach(function(universidad){
  console.log(universidad)
})

Juan Diego Silva Garcia

student•

Corrijanme si me equivoco, cuando Sacha dice min 04:42:

“En este caso si definimos la variable i, acá en este ciclo con VAR, (i) fuera de la repetición del ciclo FOR va a tener un valor, por que es lo mismo declarar la variable VAR fuera del FOR y luego dentro del FOR asignarle el valor”

Lo que entendí en la clase de Scope, es que, el scope va a ser el mismo para los bloques for, los bloques de condicionales if, los bloques swich-case, etc… dentro de la función que se declaran. Sacha declaró el bloque en el scope global, por eso window.i === i // true

ya con LET, CONST ya nos permite tener un scope de bloque para que no contamine el scope global y las variables puedan vivir dentro del código, creo que Sacha se confundió un poco o pudo dar una explicación más sencilla.

Islas Juan Pablo Juan Pablo

student•

Immediately Invoked Function Expressions:
http://adripofjavascript.com/blog/drips/an-introduction-to-iffes-immediately-invoked-function-expressions.html

JavaScript Style Guide: https://github.com/airbnb/javascript

Iván Darío Sánchez Jiménez

student•

Sacha quiero agradecerle por el método de enseñanza y explicaciones suministradas, venia trabajando con JS ya tiempo pero lo aprendido y comprendido hasta esta parte del curso me ha permitido despejar dudas y conocer muchisimo mas de este lenguaje.

Ronald Alexander Palacios Garrido

student•

JavaScript: ¿Un lenguaje compilado o interpretado?
Últimamente ha habido mucho revuelo sobre este tema en las comunidades de JavaScript en Español e Inglés, y es que aún si muchos creen que JavaScript es un lenguaje interpretado, en realidad: es un lenguaje compilado.
¿Por qué es un lenguaje compilado?
Para entender esto, primero debemos recordar que JavaScript es un dialecto o implementación del lenguaje ECMAScript y por ende gran parte de la estructura de JavaScript está basada en los mismos estándares que ECMA International define en su especificación.

ECMA en su especificación require que los Early Errors (Errores Tempranos) sean analizados y ejecutados antes de que cualquier linea corra. Esto significa que si JavaScript en realidad fuera un lenguaje interpretado, un error en la linea 1.000 no podría ser detectado sin antes correr 999 lineas, lo cual sin dudas rompe la regla de los Early Errors lo que conllevaría a que todo el programa sea invalido:

Una implementación conforme (a los estándares) debe, antes de la primera evaluación de un Script o Módulo, validar todas las reglas de error temprano de las producciones utilizadas para analizar ese Script o Módulo. Si se infringe alguna de las reglas de error anticipadas, la secuencia de comandos o el módulo no son válidos y no se pueden evaluar.
El proceso de compilado de JavaScript no es como el de muchos otros lenguajes compilados bien conocidos que generan un archivo .exe u otro archivo final. Pero, sí que se debe realizar mucho de este proceso de pre-compilación y ejecución para que un programa escrito en JavaScript pueda ser valido y no presente errores que puedan invalidar el programa.

Incluso, el motor V8 de Chrome utilizado para convertir JavaScript en código maquina en el navegador (y también utilizado por Node.js) necesita de dos compiladores: El primero compila rapidamente JavaScript utilizando una estrategia IC (Inline Cache) pero crea código no optimizado. El segundo es un optimizador que toma como input el código generado por el primer compilador y lo optimiza de la mejor manera posible.

Hay que tomar en consideración que…
El proceso de compilado de JavaScript no es el mismo que esperarías en lenguajes como C++ u otro lenguaje de este tipo. Debido a esto, tú incluso podrías argumentar que JavaScript no es un lenguaje 100% compilado si no mas bien un lenguaje híbrido (interpretado y compilado).

Para entender en su totalidad cómo funciona este proceso te invito a que leas la sección Compiler Theory en el libro de Kyle Simpson: You Don’t know JS: Scope & Closures. El primer párrafo de esta sección nos dice:

Puede ser evidente, o puede ser sorprendente, dependiendo de su nivel de interacción con varios lenguajes, pero a pesar del hecho de que JavaScript cae dentro de la categoría general de idiomas “dinámicos” o “interpretados”, de hecho es un lenguaje compilado. No se compila con mucha antelación, al igual que muchos lenguajes compilados tradicionalmente, ni tampoco los resultados de la compilación son portátiles entre varios sistemas distribuidos.
¿Por qué se cree que JavaScript es interpretado?
Hay muchas razones por las cuales esta creencia popular ha sido tan difundida y además tomada por cierta, estás razones podrían ser:

El hecho de que Wikipedia en su página dedicada a JavaScript diga que este es interpretado.
Debido a la falta de un archivo final compilado, por ejemplo: .exe
Muchos libros para aprendices de JavaScript afirman que este es un lenguaje interpretado.
Conclusión
Posiblemente tengas tus dudas acerca de si JavaScript en realidad es un lenguaje compilado o no, y esto es compresible. Pero lo que JavaScript nos dice es que, al menos, no es un lenguaje interpretado en su totalidad.

Jesús Alberto Espinoza Fernández

company_admin•

Comparto un ejemplo de como utilizar IIFE en JavaScript. Dentro de la función “autoejecutable” indicó el modo estricto de JavaScript.

Respecto al uso del “;” al final de cada sentencia siempre lo utilizó ya que he utilizado lenguajes como C, C++, C# y Java y como buena práctica lo utilizó en todas los lenguajes que derivan de C++. Además de ello, con los Javascript en un sitio siempre los trabajo por medio de bundles en donde mis .js estan minificados y ofuscados.

"use strict"
https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Modo_estricto

minificar y ofuscar JavaScript
https://www.campusmvp.es/recursos/post/Proteger-y-hacer-mas-agil-tu-codigo-JavaScript-Minimizacion-y-ofuscacion.aspx

Estructura del lenguaje

Estamos renovando el Curso de Fundamentos de Javascript

¿Dónde aprender JS actualizado?

Bases del lenguaje

Bienvenido al curso

Calcula el área de un triángulo. Creando funciones

¿Quiénes pueden pasar a ver una película? Ejercicio con condicionales, expresiones y booleanos

Inventar un idioma manipulando strings

¿Cuántos kms corre una persona en promedio? Entendiendo el ciclo for

¿Quién gana en una pelea: Gokú o Superman? Resolviendo este problema con ciclos while

¿Cuánto tiempo pasó desde tu fecha de nacimiento?

Objetos en JavaScript

Calcular la distancia entre dos puntos - Objetos en JavaScript

Agrega métodos para mover los puntos - Objetos Avanzado en JavaScript

Definiendo la clase Punto - Prototipos en JavaScript

Definiendo la clase Punto - Object.create en JavaScript

Definiendo la clase Punto - Class en JavaScript

Conocimientos intermedios

Entiende el scope de las variables

Operaciones con arrays

Entiende los closures de JavaScript

Estructura del lenguaje

¿Quién es this?

This, _this y los arrow functions

La función bind

call y apply

ECMAScript 5, 2015, 2016, Babel y otros cuentos

ECMAScript: El estándar en el que se basa JavaScript

Babel al rescate: logrando la compatibilidad buscada

Distintas formas de escribir módulos en JavaScript

Procesos asíncronos

No generes un cuello de botella en el EventLoop

Los callbacks de JavaScript

Callback a un servidor externo

Promesas

Async-await

Implementación de set timeout en JavaScript

Implementación de set interval en JavaScript

Cancelando el Timeout y el Timeinterval

Qué son y cómo se implementan el callbacks en JavaScript

Eliminando el callback hell usando promesas en JavaScript

Estructuras de datos y funciones avanzadas

Funciones Recursivas

Memoizacion

Iteradores en JavaScript

Generadores en JavaScript

Estructuras de Datos Inmutables en JavaScript

Creando un paquete para NPM

Requisitos Técnicos

Creando nuestro paquete

Escribiendo el código de nuestro paquete

Testeando el paquete

Publicando el paquete en NPM

Juego de HTML

¿Qué vamos a construir?

Inicializando el juego

A una ronda le sigue otra ronda

Añadir una librería

Cierre del Curso

Desafíos

Crear un modulo para convertir medidas de peso

Crear un juego en HTML, tic tac toe

Crear un tutorial