el curso de manipulación de arrays es buenísimo …
Introducción a TypeScript
Por qué usar TypeScript
TypeScript vs. JavaScript
Configurado nuestro proyecto
Atrapando bugs
El compilador de TypeScript
Veamos el TSConfig.json
Tipos de datos primitivos
Qué es el tipado en TypeScript
Tipos inferidos
Numbers
Booleans
Strings
Arrays
Tipos de datos especiales
Any
Union Types
Alias y tipos literales
Null y Undefined
Funciones
Retorno de funciones
Objetos en funciones
Objetos como tipos
Módulos: import y export
Usando librerías que soportan TypeScript
Usando librerías que NO soportan TypeScript
Próximos pasos
Toma el Curso de Tipos Avanzados y Funciones en TypeScript
No tienes acceso a esta clase
¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera
Nicolas Molina
Es una colección de datos ordenada. Los definimos de la siguiente manera:
let prices = [1,2,3,4,5];
/* Método Push para agregar un elemento al final del array */
prices.push(6);
console.log(prices); // [1,2,3,4,5,6]
Para el array prices
, TypeScript, de no indicarle explícitamente, va a inferir que este solo contendrá valores del tipo number
, por lo que si se quiere agregar un valor string
, por ejemplo, nos indicará un error:
//TypeScript
prices.push("texto"); //ERROR. Se espera agregar solo números al array.
Esto debido a que en su inicialización se le asignó un array que solo contenía números.
También nos indicará error si pretendemos hacer operaciones exclusivas de un tipo de dato sobre la de otro tipo:
let meses = ["Mayo","Junio","Julio"];
meses.map( item => item * 2 ); //ERROR. Se pretende realizar una multiplicación usando strings.
Lo puedes definir así:
let prices: (number | string)[] = ["hola",2,4,6,"mundo"];
let otherPrices: (boolean | number)[];
Para este caso, a menos que la variable sea una constante, no es necesario que inicialices la variable, pues ya le indicaste el tipo de dato.
//TypeScript
let prices = ["hola",2,4,6,"mundo"];
// "hola", "mundo" => string
// 2,4,6 => number
Dejamos claro que queremos que soporte los tipos de dato string
y number
.
Contribución creada por: Martín Álvarez.
Aportes 20
Preguntas 5
el curso de manipulación de arrays es buenísimo …
📌📍📝 ==> La forma correcta de asignarle el tipo a un array cuando contiene numeros, strings y booleans es:
let prices: (number | string | boolean)[]
Creo que al profe se le paso el Object con mayuscula.
recordemos la diferencia entre object y Object.
recordemos que object es el correcto, por que nos va a diferenciar entre datos primitivos (number, string, boolean, etc) y todo lo que no sea esto, puede caber dentro de object.
(() => {
const prices = [1,2,3,4,5,6, 'hola', true];
//lo que no puedo hacer
// prices.push('jkgdsakjgd');
// prices.push(true);
// prices.push({});
prices.push(12313131);
let products = ['hola', true];
products.push(false);
//para escribir booleans, numbers y strings hay que hacerlo de forma explicita
//se puede usar | objecta y acepta arrays y objetos pero para eso hay un modulo más adelante
const mixed: (number | string | boolean)[] = ['hola', true];
//ahora si me deja ingresar números
mixed.push(12);
let numbers = [1,2,3,4,5,6,7,8];
numbers.map(item => item * 2);
console.log(numbers);
})();
Cuando creamos el siguiente array de puros numeros
const numbers = [1, 2, 3, 4, 5]
TS infiere que el tipo es number[]
. Si lo quisieramos hacer de manera explicita seria asi
const numbers: number[] = [1, 2, 3, 4, 5]
.
Cuando agregamos mas de un tipo de dato en un array, TS lo infiera de esta manera
const arr: (number | boolean | string)[] = [1, true, "str"]
.
Por ultimo, cuando un array contiene otros arrays u objetos podemos usar el tipo de dato Object
const arr: Object[] = [{}, [], {}, []]
Usando Object, me permitió usar el tipo Boolean sin habérselo dicho:
.
Usando object, ya reaccionó como era y no me lo permitió:
Escriban lo siguiente en chatGPL y vean la magia:
Creame un snippet para declarar un array en ts que reciba todo tipo de datos y nombralo como “universalarray”
object !== Object ?
const numeros: number[] = [1, 2, 3, 4, 5];
//@ts-ignore: Esto da error porque un array de números no acepta textos
numeros.push('hola');
const cadenas : string[] = ['Hola', 'que tal', 'bien', 'chau'];
//@ts-ignore: Esto también da error por lo mismo en este caso de strings
cadenas.push(1);
//Más de un tipo de dato
const poblationCountries : (string | number)[] = ["Paraguay", 7000000, "Uruguay", 4000000];
//@ts-ignore: Da error porque no lo pusimos en el mixin de datatypes
poblationCountries.push(true);
//La forma implícita es la más recomendable siempre y cuando se pueda
const inferedNumbers = [1, 2, 3, 4, 5];
//@ts-ignore: Esto da error igual de forma inferida
inferedNumbers.push('hola');
const inferedStrings = ['Hola', 'que tal', 'chau'];
//@ts-ignore: Esto da error igual de forma inferida
inferedStrings.push(1);
//Más de un tipo de dato
const inferedPoblationCountries = ["Paraguay", 7000000, "Uruguay", 4000000];
//@ts-ignore: Da error porque no lo pusimos en el mixin de datatypes
inferedPoblationCountries.push(true);
La forma correcta de asignarle los tipos que admite un array es la siguiente, así evitamos que la variable prices no sea usada como array
let prices:Array<number|string> = [1,2,3,4,5,6,7,8];
prices.push('string');
prices.push(1); //number
Como aprendizaje esta bien, aunque creo que es una mala practica mezclar tipos de datos en un array.
alt + 1 = | (pipe) en Mac
El profe mostró algunas formas de meter un array dentro de otro, pero prueba esta:
// Al hacer esto ...
let mixed_one = [1, 2, 3, 'x', true, [1, true, 'x']];
// El editor muestra esto:
let mixed_one: (string | number | boolean | (string | number | boolean)[])[]
✅
hay que tener en cuenta 2 cosas:
let arr = []
por defecto, Typescript les asignara como tipo de dato any, el cual acepta cualquier tipo de valor
object, por el contrario, solo acepta tipos de datos no primitivos, como los arrays y objetos
Este es el curso del que habla el profesor Curso de Manipulación de Arrays en JavaScript
Si hay un curso que me ha servido muchísimo en la practica como desarrollador frontend, es el curso de manipulación de arrays, lo super recomiendo.
Llegando al final de este primer modulo te comparto estas notas que encontre en Medium que estan muy utiles
https://medium.com/@roperluo.me/typescript-types-study-notes-3060f9bf48af
Tambien podemos expresar con any, de esta forma indicamos que puede tener cualquier tipo de dato
let myList: any = [];
myList.push('fabio', 28, {lastname:'sosa'})
¿Quieres ver más aportes, preguntas y respuestas de la comunidad?