Tipos de datos - pt 2

Null

El valor null es un tipo de dato que representa un valor vacío o nulo. En JavaScript, podemos utilizar la palabra clave null para representar el valor nulo. A menudo, utilizamos null para representar un valor que aún no ha sido inicializado o para representar un valor que no tiene sentido en el contexto actual.

Ejemplo:

const nombre = null;
console.log(nombre); // imprime "null"

Undefined

El valor undefined es un tipo de dato que representa un valor que aún no ha sido asignado o que no tiene un valor válido. En JavaScript, podemos utilizar la palabra clave undefined para representar el valor undefined.

Ejemplo:

let nombre;
console.log(nombre); // imprime "undefined"

Diferencias entre Null y Undefined

Es importante tener en cuenta que null y undefined son valores diferentes en JavaScript. null representa un valor intencionalmente vacío, mientras que undefined representa un valor que aún no ha sido asignado o que no tiene un valor válido.

Por ejemplo, podríamos utilizar null para representar que un gatito aún no tiene dueño:

let gatito = {
  nombre: "Michi",
  edad: 3,
  dueño: null
};

console.log(gatito.dueño); // "null"

Por otro lado, podríamos utilizar undefined para representar que un gato aún no ha sido adoptado:

let gato;
console.log(gato); // "undefined"

Es importante tener en cuenta que null y undefined son valores diferentes en JavaScript y deben ser tratados de manera diferente.

Symbol

Los símbolos son un tipo de dato único en JavaScript que se utiliza para crear identificadores únicos. Cada vez que se crea un símbolo, se genera un nuevo identificador único, lo que lo hace ideal para usar como claves de objetos o para identificar elementos de manera única en una aplicación.

Ejemplo:

const simbolo = Symbol();

let perrito = {
  nombre: "Firulais",
  edad: 3,
  [simbolo]: "Identificador único"
};

console.log(perrito[simbolo]); // "Identificador único"

También puedes proporcionar una descripción opcional al crear un símbolo, lo que puede ser útil para depurar y mantener el código:

const simbolo = Symbol("Identificador único de gatitos");

Es importante tener en cuenta que los símbolos son valores únicos, lo que significa que dos símbolos creados de manera independiente nunca serán iguales, incluso si tienen la misma descripción. Esto hace que los símbolos sean ideales para usar como identificadores únicos en tus futuras aplicaciones.

BigInt

Los bigint son un nuevo tipo de dato en JavaScript que se usa para representar números enteros de un tamaño mayor al que puede manejar JavaScript de manera nativa. Los bigint se escriben con el sufijo n, por ejemplo: 12345678901234567890n.

Aquí tienes un ejemplo de cómo usar bigint en JavaScript:

const numeroGrande = 12345678901234567890n;

console.log(numeroGrande + 1n); // 12345678901234567891n
console.log(numeroGrande * 2n); // 2469135780246913578n
console.log(numeroGrande / 3n); // 411218936707805260n

Es importante tener en cuenta que los bigint solo pueden ser usados para operaciones matemáticas y no pueden ser usados con operadores de comparación, como == o ===. En su lugar, debes usar los métodos BigInt.asIntN y BigInt.asUintN para hacer comparaciones entre bigint y números normales.

También es importante tener en cuenta que los bigInt no son compatibles con todas las funciones y métodos de JavaScript que aceptan números, por lo que debes asegurarte de verificar la documentación de la función o método que quieres usar antes de intentar usar bigInt con ellos.

Todo esto y más lo puedes aprender en el Curso Básico de JavaScript

Comentarios

Luis Castro

student•

El tipo de dato Symbol() y Bigint no son explicados en el Curso Básico de Java Script

. Symbol: El tipo de dato Symbol se introdujo en ECMAScript 6 y se utiliza para crear valores únicos e inmutables que se pueden utilizar como identificadores de propiedades de objetos. Un Symbol se crea usando la función Symbol(). Cada símbolo que se genera es único y no se puede duplicar, lo que lo hace ideal para evitar colisiones de nombres de propiedades en objetos.

Ejemplo:

const propiedad1 = Symbol(); // declaración de Symbol 1
const propiedad2 = Symbol(); // declaración de Symbol 2

let obj = {}; // declaración de objeto

obj[propiedad1] = "Valor de la propiedad 1"; // asignaión de propiedad
obj[propiedad2] = "Valor de la propiedad 2"; // asignaión de propiedad

console.log(obj[propiedad1]); // "Valor de la propiedad 1"
console.log(obj[propiedad2]); // "Valor de la propiedad 2"

BigInt: El tipo de dato BigInt se introdujo en ECMAScript 2020 y se utiliza para representar números enteros de tamaño arbitrario. BigInt es necesario cuando se trabaja con números enteros extremadamente grandes que exceden el rango de los números que se pueden representar con el tipo de datos Number en JavaScript. BigInt se crea mediante la adición del sufijo n a un número entero literal o utilizando la función BigInt().

Ejemplo:

const entero1 = 9007199254740991n; // declaración Bigint con 'n'
const entero2 = BigInt("9007199254740992"); // declaración Bigint con 'función'

console.log(typeof entero1); // "bigint"
console.log(typeof entero2); // "bigint"

const suma = entero1 + entero2;
console.log(suma); // 18014398509481983n

Max Castillo

student•

Excelente explicación, me había confundido con lo de Symbol

Federico Guillermo Moreira Tejera

student•

Muy buena explicación Luis, no sabia que exisian 2 formas para definir BigInt

José Fernando Fuentes Roa

student•

Hola a todos, este meme siempre me permite recordar la diferencia entre 0, null y undefined. Espero que les sirva a Uds. también. Saludos y nunca paren de aprender 💚

Darwin Contreras

student•

esta bueno jaja

Max Castillo

student•

Interesante forma de entenderlo 🤣

David Trespalacios

student•

Esto de Symbol() parece confuso, lo aclaré un poco con este articulo de latteandcode

Juan Vargas Mejía

student•

Excelente aporte, no entendí mucho con la definición definición del reto, pero en tu artículo se entiende super bien.

Julian Roa Villamil

student•

no sabía lo de Symbol, muy interesante, lo relaciono con el concepto de hash o como generador de contraseñas únicas, habría alguna forma de ver su valor? trate de imprimir uno pero me sale la propia función y probe con .toString y nada, Investigue y es como por una protección del lenguaje, aun así me parece interesante

Leonardo de los angeles Espinoza Hernandez

student•

Claro que la hay, symbol es super interesante y más a futuro podrás encontrarle un uso más importante con el tema de evitar colisiones

Si tienes un symbol como el siguiente

const challenge = Symbol("30 Días de JS")

Puedes acceder a su valor mediante el atributo "description"

challenge.description
// 30 Días de JS

Y esto es fundamental, porque puedes crear 2 variables con un symbol que tenga el mismo valor pero NUNCA serán las mismas. Ejemplo

const challenge = Symbol("30 Días de JS")
const challengeFake = Symbol("30 Días de JS")

console.log(challenge === challengeFake)
// false

Espero te sirva de ayuda!

Darwin Contreras

student•

Yo encontré donde lo explicaron con ejemplos en este video https://www.youtube.com/watch?v=XVBkTsj99so espero les sirva de apoyo.

Benjamin Rodriguez

student•

Esto deberia ir antes del playground ¿No?

Leonardo de los angeles Espinoza Hernandez

student•

Digamos que no, estos tipos de datos son un poco más especiales y si los poníamos en el playground... pues es algo confuso si lo miras así 👇

typeof null // "object"
typeof undefined // "undefined"
typeof NaN //"number"
typeof Symbol //"function"

Y no queremos mostrarles este lado oscuro de JS... por ahora.

Ricardo Alfonso Chavez Vilcapoma

student•

He segudio la ruta de JS hasta el curso de POO intermedio...pero jamás tocaron el tema de Symbol hasta ese momento 😅. Igual anotado porque no lo conocía.

Muriel Velez Jorge Albeiro

student•

enlace para crear diagramas de bases de datos relaciones en forma de tablas

Alexis Fernando Quilindo Tumiña

student•

Entendi mejor lo de Symbol con este video tiene ejemplos:

https://www.youtube.com/watch?v=XVBkTsj99so&ab_channel=jonmircha

Sergio Luis Arango Montes

student•

Creo que el ejemplo del gatito puede quedar mejor asi, definimos el objeto gatito y una variable que almacene nuestro dueño:

 // Aqui no asignamos un valor al dueño.
let nombreDeDueño;

let gatito1 = {
  nombre: "Un Michi",
  edad: 3,
  dueño: nombreDeDueño
};

console.log(gatito1.dueño); // "undefined"

let gatito2 = {
  nombre: "Otro Michi",
  edad: 2,
  dueño: null
};

console.log(gatito2.dueño); // "null"

Asi para el gatito1 el atributo dueño seria undefined ya que no se le a dado un valor por defecto a la variable "nombreDeDueño" en la cual se pretende almacenar el nombre del padre gatuno. Por otra parte para el gatito2 el atributo dueño se asigna como null, esto indicando que ninguna variable se le a asignado.

Carlos Andrade

student•

5/78 Tipos de datos - pt 2

Null

El valor Null el JavaScript se utiliza para representar un vlaor vacío o nulo. Es una formade indicar que una variable no tiene ningún valor asignado. En otras palabras. Null indica que una variable no contiene ningún objeto, valor o referencia a otro objeto.

const nombre = null;
console.log(nombre); // imprime "null"

En el ejemplo proporcionado se declara una constante nombre y se le asigna el valor null. Cuando se imprime la constante en la consola, se muesta la cadena de teto null, que es la representación textual del valor “null” en JavaScript.

La palabra clave null a menudo se utiliza para indicar que un valor aun no ha sido inicializado o para representar que un valor que no tiene sentido en el contexto actual. Por ejemplo, si una variable se utiliza para almacenar la respuesta a una pregunta y la respuesta aún no se ha proporcionado, podríamos inicializarla con el valor null para indicar que aún no hay respuesta.

Undefined

El valor undefined en javaScript se utiliza para representar un valor que aún no ha sido asginado o que no tiene un valor valido. Es una forma de inidcar que una variable o propiedad existe pero aun no se ha inicializado con un valor.

let nombre;
console.log(nombre); // imprime "undefined"

En el ejemplo proporcionado se declara una variable nombre sin asignarle un valor. Al imprimir la variable en la consola, se muestra la cadena de texto undefined que es la representaciḱin textual del valor undefined en JavaScript.

La palabra clave “undefined” a menudo se utiliza para indicar que una variable p propiedad no tiene un valor válido o que no se ha inicialziado. Por ejemplo, si una función espera recibir un argumento, pero el argumento no se proporciona en la llamada de la función, entonces el valor del argumento serpa undefined.

Diferencias entre Null y Undefined

La principal diferencia es que null representa un valor intencionalmente vacío. mientras que undefined representa un valor que aún no ha sido asignado o que no tiene un valor válido

let gatito = {
  nombre: "Michi",
  edad: 3,
  dueño: null
};

console.log(gatito.dueño); // "null"

En el ejemplo se utiliza null para represnetar que un gatito no tiene dueño, muentas que undefined se utiliza para representar que un gato aún no ha sido adoptado. En ambos casos, se utilizan los valores para indicar la ausencia de información, pero con diferentes matices.

let gato;
console.log(gato); // "undefined"

Es importante tener en cuenta que null y undefined son valores diferentes en JavaScript y deben ser tratados de manera diferente en el código. Por ejemplo, al verificar si su valor es undefined, en lugar de null

Symbol

Este tipo de dato es único y se utiliza para crear identificadores únicos en una aplicación. los símboles se crean utilizando la función constructora symbol() y cada vez que se crea un símbolo, se genera un identificador único.

Los símbolos pueden ser utilizados como claves de objetos y para identificar elementos de manera única en una aplicación. Además, se puede proporcionar una descripción opcional al crear un símbolo, lo que puede ser útil para depurar y mantener el código.

Al ser valores únicos dos símbolos creados de manera independiente nunca serán iguales, incluso si tienen la misma descripción.

const simbolo1();
const simbolo2();
console.log(simbolo1===simbolo2);//false

const simbolo3 = Symbo3("identificador único");
const simbolo4 = Symbo4("identificador único");

console.log(simbolo3 === simbolo4); // false

let gatito = {
nombre: "Michi",
edad: 3,
[simbolo3]: "Identificador único"
};

console.log(gatito[simbolo3]); // "Identificador único"

BigInt

Son un nuevo tipo de datos en JavaScript que se utilizan para representar números enteros de un tamaño mayor al que pueden manejar JavaScript de manera nativa. Los números bigint se escriben con el sufijo n al final de un número.

const numeroGrande = 12345678901234567890n;

console.log(numeroGrande + 1n); // 12345678901234567891n
console.log(numeroGrande * 2n); // 2469135780246913578n
console.log(numeroGrande / 3n); // 411218936707805260n

Los bigint no pueden ser utilizaod con operadores de comparación como === ó == y que se deben usar los métodos BigInt.asIntN y BigInt.asUintN para hacer comparaciones entre los bigint y los números normales. Además, se señala que los bigint no son compatibles con todas las características y métodos de JavaScript, por lo que es necesario verificar la documentación antes de utilizarlos

Representación de un número grande usando bigint

const numeroGrande = 12345678901234567890n;

Suma de dos números bigint

const num1 = 9999999999999999999n;
const num2 = 1111111111111111111n;
console.log(num1 + num2); // 11111111111111111110n

Uso de BigInt.asIntN para comparar un bigint con un número normal:

const num1 = 10000000000000000000n;
const num2 = 10;

console.log(BigInt.asIntN(64, num1) === num2); // true

Operaciones matemáticas utilizando bigint:

const num1 = 50000000000000000000n;
const num2 = 20000000000000000000n;

console.log(num1 / num2); // 2n
console.log(num1 - num2); // 30000000000000000000n

Lautaro Olivero

student•

Creo que Symbol no esta explicado de forma tan clara y que da para mas explicación que solo una lectura corta, procedo a dejarles un enlace a una pagina para que lean mas sobre el mismo y un link a un video que en lo personal me ayudo.

Lo demás bastante claro ✨✨

Max Castillo

student•

No conocía el tipo Symbol, es gratificante saber que siempre se puede aprender algo nuevo.

Gilberto Espinoza Maciel

student•

Symbol es un objeto incorporado cuyo constructor devuelve un symbol primitivo — también llamado Symbol value o simplemente Symbol — que está garantizado que sea único.

Cada llamada a Symbol.for("key") devolverá siempre el mismo Symbol para un valor dado de "key".

Source. MDN

Luis Castro

student•

Un refuerzo para lo aprendido

const numeroGrande = 12345678901234567890n;

console.log(numeroGrande + 1n); // 12345678901234567891n
console.log(numeroGrande * 2n); // 2469135780246913578n
console.log(numeroGrande / 3n); // 411218936707805260n

const propiedad1 = Symbol(); // declaración de Symbol 1
const propiedad2 = Symbol(); // declaración de Symbol 2

let obj = {}; // declaración de objeto

obj[propiedad1] = "Valor de la propiedad 1"; // asignaión de propiedad
obj[propiedad2] = "Valor de la propiedad 2"; // asignaión de propiedad

console.log(obj[propiedad1]); // "Valor de la propiedad 1"
console.log(obj[propiedad2]); // "Valor de la propiedad 2"

const entero1 = 9007199254740991n; // declaración Bigint con 'n'
const entero2 = BigInt("9007199254740992"); // declaración Bigint con 'función'

console.log(typeof entero1); // "bigint"
console.log(typeof entero2); // "bigint"

const suma = entero1 + entero2;
console.log(suma); // 18014398509481983n

 // Aqui no asignamos un valor al dueño.
let nombreDeDueño;

let gatito1 = {
  nombre: "Un Michi",
  edad: 3,
  dueño: nombreDeDueño
};

console.log(gatito1.dueño); // "undefined"

let gatito2 = {
  nombre: "Otro Michi",
  edad: 2,
  dueño: null
};

console.log(gatito2.dueño); // "null"

const simbolo3 = Symbo3("identificador único");
const simbolo4 = Symbo4("identificador único");

console.log(simbolo3 === simbolo4); // false

let gatito = {
nombre: "Michi",
edad: 3,
[simbolo3]: "Identificador único"
};

console.log(gatito[simbolo3]); // "Identificador único"

const numeroGrande = 12345678901234567890n;

console.log(numeroGrande + 1n); // 12345678901234567891n
console.log(numeroGrande * 2n); // 2469135780246913578n
console.log(numeroGrande / 3n); // 411218936707805260n

Tipos de datos - pt 2

¡Te damos la bienvenida a este reto!

¡Bienvenido al mundo de JavaScript!

Día 1

Variables, funciones y sintaxis básica

Tipos de datos

Playground - Retorna el tipo

Tipos de datos - pt 2

Día 2

Operadores

Hoisting y coerción

Playground - Calcula la propina

Alcance de las variables

Día 3

Condicionales

Playground - Calcula años bisiestos

Switch

Playground - Obten información de mascotas según su tipo

Ciclos

Playground - Dibuja un triangulo

Día 4

Arrays

Playground - Encuentra al michi mas famoso

Objetos

Playground - Obten el promedio de los estudiantes

Día 5 - Checkpoint

Playground - encuentra el palindromo más grande

Día 6

Reasignación y redeclaración

Modo estricto

Día 7

Debugging y manejo de errores

Programación funcional

Día 8

Closures

Playground - Crea una calculadora con closures

Higher order functions

Playground - Crea tu propio método map

Día 9

ECMAScript

TC39

Día 10 - Checkpoint

ES6

ES7

Playground - Task planner

Día 11

Asincronismo

Playground - Promesas

Manejando el asincronismo

Playground - Resuelve el callback hell usando promesas

Playground - Resuelve el callback hell usando async/await

Día 12

Arrays a profundidad

Métodos de arrays: Every, Find y findIndex

Playground - Válida el formulario

Día 13

Métodos de arrays: Includes, Join y concat

Playground - agrupa los productos

Métodos de arrays: Flat y FlatMap

Playground - Encuentra la ubicación del valor buscado

Día 14

Mutable functions

Playground - Modifica una lista de compras

Métodos de arrays: sort

Playground - Ordena los productos

Día 15 - Checkpoint

Playground - Sistema de reservaciones de un hotel

Día 16

Programación orientada a objetos en JavaScript

Objetos literales

Playground - Congela el objeto recursivamente

Día 17

Prototipos en JavaScript

Playground - Modifica el prototype de los arrays

Playground - Crea un auto usando clases

Día 18

Abstracción en JavaScript

Playground - Sistema de carrito de compras

Encapsulamiento en JavaScript

Playground - Encapsula datos de los usuarios