隆Te damos la bienvenida a este reto!

1

隆Bienvenido al mundo de JavaScript!

D铆a 1

2

Variables, funciones y sintaxis b谩sica

3

Tipos de datos

4

Playground - Retorna el tipo

5

Tipos de datos - pt 2

D铆a 2

6

Operadores

7

Hoisting y coerci贸n

8

Playground - Calcula la propina

9

Alcance de las variables

D铆a 3

10

Condicionales

11

Playground - Calcula a帽os bisiestos

12

Switch

13

Playground - Obten informaci贸n de mascotas seg煤n su tipo

14

Ciclos

15

Playground - Dibuja un triangulo

D铆a 4

16

Arrays

17

Playground - Encuentra al michi mas famoso

18

Objetos

19

Playground - Obten el promedio de los estudiantes

D铆a 5 - Checkpoint

20

Playground - encuentra el palindromo m谩s grande

D铆a 6

21

Reasignaci贸n y redeclaraci贸n

22

Modo estricto

D铆a 7

23

Debugging y manejo de errores

24

Programaci贸n funcional

Quiz: D铆a 7

D铆a 8

25

Closures

26

Playground - Crea una calculadora con closures

27

Higher order functions

28

Playground - Crea tu propio m茅todo map

D铆a 9

29

ECMAScript

30

TC39

Quiz: D铆a 9

D铆a 10 - Checkpoint

31

ES6

32

ES7

33

Playground - Task planner

D铆a 11

34

Asincronismo

35

Playground - Promesas

36

Manejando el asincronismo

37

Playground - Resuelve el callback hell usando promesas

38

Playground - Resuelve el callback hell usando async/await

D铆a 12

39

Arrays a profundidad

40

M茅todos de arrays: Every, Find y findIndex

41

Playground - V谩lida el formulario

D铆a 13

42

M茅todos de arrays: Includes, Join y concat

43

Playground - agrupa los productos

44

M茅todos de arrays: Flat y FlatMap

45

Playground - Encuentra la ubicaci贸n del valor buscado

D铆a 14

46

Mutable functions

47

Playground - Modifica una lista de compras

48

M茅todos de arrays: sort

49

Playground - Ordena los productos

D铆a 15 - Checkpoint

50

Playground - Sistema de reservaciones de un hotel

D铆a 16

51

Programaci贸n orientada a objetos en JavaScript

52

Objetos literales

53

Playground - Congela el objeto recursivamente

D铆a 17

54

Prototipos en JavaScript

55

Playground - Modifica el prototype de los arrays

56

Playground - Crea un auto usando clases

D铆a 18

57

Abstracci贸n en JavaScript

58

Playground - Sistema de carrito de compras

59

Encapsulamiento en JavaScript

60

Playground - Encapsula datos de los usuarios

D铆a 19

61

Herencia en JavaScript

62

Playground - Jerarqu铆a de animales

63

Polimorfismo en JavaScript

64

Playground - Sistema de pagos

D铆a 20 - Checkpoint

65

Playground - Agenda de vuelos

D铆a 21

66

Patrones de dise帽o

67

Sinlgeton y Factory pattern en JavaScript

68

Playground - Implementa singleton en un chat

D铆a 22

69

Adapter y Decorator pattern en JavaScript

70

Playground - Personaliza productos de una tienda

71

Builder y Protype pattern en JavaScript

72

Playground - Mejora el c贸digo usando builder pattern

D铆a 23

73

Facade y proxy pattern en JavaScript

74

Playground - Proxy en servicio de mensajer铆a

75

Chain of responsability y Observer pattern en JavaScript

76

Playground - Implementaci贸n de Observador en Newsletter

D铆a 24 - Checkpoint

77

Playground - Crea un task manager con patrones de dise帽o

D铆a 25

78

Estructuras de datos en JavaScript

79

Playground - Crea tu propia implementaci贸n de un array

80

Hash tables en JavaScript

81

Playground - Implementaci贸n de una HashTable para Contactos

D铆a 26

82

Set en JavaScript

83

Playground - Remueve duplicados de una lista

84

Maps en JavaScript

85

Playground - Crea un organizador de tareas

D铆a 27

86

Singly Linked List en JavaScript

87

Playground - Agrega m茅todos a la singly linked list

88

Playground - Implementaci贸n de una singly linked list

D铆a 28

89

Stacks en JavaScript

90

Playground - Crea un stack para una playlist

D铆a 29

91

Queues en JavaScript

92

Playground - Crea una cola de emails

D铆a 30

93

隆Lo lograste!

Live Class

94

30 d铆as de JS con Juan DC

95

30 d铆as de JS con Nicobytes

96

30 d铆as de JS con GNDX

97

30 d铆as de JS con LeoCode

98

30 d铆as de JS con Teffcode

99

Sesi贸n: Cierre de los 30 d铆as de JavaScript

Alcance de las variables

9/99

Lectura

En JavaScript no todas las variables son iguales y es importante entender c贸mo funciona el alcance de las variables.

...

Reg铆strate o inicia sesi贸n para leer el resto del contenido.

Aportes 11

Preguntas 1

Ordenar por:

驴Quieres ver m谩s aportes, preguntas y respuestas de la comunidad?

Scope se refiere a las reglas que definen la visibilidad y accesibilidad de las variables en el c贸digo. En JavaScript, existen dos tipos de scope: global y local. Las variables declaradas fuera de una funci贸n tienen un scope global, mientras que las variables declaradas dentro de una funci贸n tienen un scope local. Por ejemplo:

let nombre = 'Juan'; // scope global

function saludar() {
  let nombre = 'Mar铆a'; // scope local
  console.log(`Hola ${nombre}!`);
}

saludar(); // output: Hola Mar铆a!
console.log(`El nombre es ${nombre}`); // output: El nombre es Juan

Hoisting es la capacidad de JavaScript de 鈥渆levar鈥 las declaraciones de variables y funciones al comienzo del 谩mbito actual. Por ejemplo:

console.log(mensaje); // output: undefined
var mensaje = 'Hola';

saludar(); // output: Hola
function saludar() {
  console.log('Hola');
}

Aunque la variable mensaje se declara despu茅s de la llamada a console.log(), JavaScript 鈥渆leva鈥 la declaraci贸n al comienzo del 谩mbito actual. De esta forma, cuando se ejecuta console.log(), la variable mensaje ya existe, aunque su valor sea undefined.

Mi resumen de esta clase

Hola, hola! no me gusta discernir cuando estoy aprendiendo, pero seg煤n tengo entendido existen 3 scope:
Global scope
Function scope
Bloque Scope

Si se declara 鈥淰AR鈥 dentro de una funci贸n, el alcance de esa variable es es misma funci贸n, a diferencia si se declara en un bloque scope como condicionales, ciclos, etc鈥 pru茅brenlo ustedes mismo copiando y pegando este c贸digo:

function alcance(){
var scope;
console.log(scope);

}
scope= 5;
alcance();

Ojo! lo aprend铆 en la clase de Scope y Closure por Oscar Barajas, aqu铆 les dejo el enlace鈥 馃槂

https://platzi.com/cursos/javascript-closures-scope/

Que javascript mueva la declaraci贸n al inicio no quiere decir que tambi茅n mueva el valor que contiene. Es por eso que el resultado que arroja es undefined.

En lenguajes de m谩s bajo nivel como es C, en este mismo ejemplo, al encontrarse una variable que no ha sido previamente declarada, dar铆a error.

Javascript evita ese problema moviendo la declaraci贸n de la variable al inicio.

Tiene sus partes buenas y sus partes malas creo yo鈥 驴Qu茅 opin谩is?

Mi aporte de lo aprendido sobre Hoisting:

Es cuando llamamos una variable antes de declarala e iniciarla y javascript asume de la existencia de esta y la devuelve con un valor de undefined.

Explicaci贸n de los tipos de escope:

  • GLOBAL SCOPE
  • FUNCTION SCOPE
  • BLOCK SCOPE (Introducido en ES6)

9/80 Alcance de las variables

Hay dos tipos de 谩mbito: Global y local

Las variables declaradas fuera de cualquier funci贸n tienen un 谩mbito global, lo que signiffica que pueden ser accedidas desde cualquier parte del c贸digo. Las variables declaradas dentro de una funci贸n tienen un alcance local, lo que significa que solo se pueden acceder y modificar dentro de esa funci贸n.

El uso de var para declarar variables dentro de una funci贸n crea una variable loca, mientras que el uso de let y const crea una variable local.

El hoisting es el comportamiento de JavaScript de mover las declaraciones de variables al incio del 谩mbito en el que se declaran

Variable global

var nombre = "Juan";

function imprimirNombre() {
  console.log(nombre);
}

imprimirNombre(); // salida: "Juan"

Variable local

function imprimirNumero() {
  let numero = 10;
  console.log(numero);
}

imprimirNumero(); // salida: 10
console.log(numero); // error: "numero" is not defined

Hoisting

function miFuncion() {
  console.log(x);
  var x = 10;
}

miFuncion(); // salida: undefined

Esta es una ayuda grafica para entender alcance global y local

En este texto me qued贸 much铆simo m谩s claro el concepto de alcance y hoisting que en otras clases.

Gracias Leo!

Hola. Agrego que se considera buena pr谩ctica solo usar 鈥榣et鈥 y 鈥榗onst鈥 para declarar variables porque conllevan a tener un c贸digo m谩s f谩cil de entender y trabajar en equipo (adem谩s de algunas optimizaciones en memoria). Al usar 鈥榲ar鈥 como declarador nos sentimos con confianza de generar variables super globales que nos inducen a colisiones de definici贸n o a crear scripts gigantes. Los expertos dicen no usar nada de var; JS lo mantiene solo por la retrocompatibilidad.
.
Algunos argumentos t茅cnicos al respecto en este link

con esta explicacion me quedo mas claro el concepto de scope