CursosEmpresasBlogLiveConfPrecios

Contenido del curso

Introducción a TypeScript

  • 1
    El lenguaje de programación TypeScript

    El lenguaje de programación TypeScript

    08:43 min
  • 2
    Instalación de herramientas para TypeScript

    Instalación de herramientas para TypeScript

    05:47 min
  • 3
    Instalación de herramientas en Windows

    Instalación de herramientas en Windows

    01:05 min
  • 4
    Navegación y refactorización

    Navegación y refactorización

    04:37 min

Entorno de Desarrollo

  • 5
    El compilador de TypeScript

    El compilador de TypeScript

    08:00 min
  • 6
    El archivo de configuración de TypeScript

    El archivo de configuración de TypeScript

    07:22 min
  • 7
    Mi primer proyecto TypeScript

    Mi primer proyecto TypeScript

    05:09 min

Tipos en TypeScript

  • 8
    Tipado en TypeScript

    Tipado en TypeScript

    01:37 min
  • 9
    Number, Boolean y String

    Number, Boolean y String

    14:09 min
  • 10
    Any

    Any

    08:28 min
  • 11
    Void y never

    Void y never

    15:58 min
  • 12
    null y undefined

    null y undefined

    11:03 min
  • 13
    Object

    Object

    07:44 min
  • 14
    Array

    Array

    Viendo ahora
  • 15
    Tupla

    Tupla

    11:25 min
  • 16
    Enum

    Enum

    10:59 min
  • 17
    Unión de Tipos, Alias y Tipos Literales

    Unión de Tipos, Alias y Tipos Literales

    11:58 min
  • 18
    Aserciones de tipo

    Aserciones de tipo

    11:26 min
  • 19
    Funciones en TypeScript

    Funciones en TypeScript

    14:19 min
  • 20
    Resumen

    Resumen

    06:54 min

Tipos Personalizados

  • 21
    Interfaces

    Interfaces

    10:18 min
  • 22
    Interfaces: propiedades opcionales

    Interfaces: propiedades opcionales

    10:57 min
  • 23
    Extensión de interfaces

    Extensión de interfaces

    10:54 min
  • 24
    Clases

    Clases

    14:02 min
  • 25
    Clases públicas y privadas

    Clases públicas y privadas

    15:10 min
  • 26
    Métodos Get y Set

    Métodos Get y Set

    08:46 min
  • 27
    Herencia de clases y propiedades estáticas

    Herencia de clases y propiedades estáticas

    17:41 min
  • 28
    Resumen

    Resumen

    13:24 min

Módulos

  • 29
    Principios de responsabilidad única

    Principios de responsabilidad única

    15:03 min
  • 30
    Resolviendo módulos

    Resolviendo módulos

    10:04 min
  • 31
    Webpack y agrupación de Módulos

    Webpack y agrupación de Módulos

    14:02 min

Cierre

  • 32
    Cierre

    Cierre

    00:57 min
Tomar examen

Array

Escuelas

  • Desarrollo Web
    • Fundamentos del Desarrollo Web Profesional
    • Diseño y Desarrollo Frontend
    • Desarrollo Frontend con JavaScript
    • Desarrollo Frontend con Vue.js
    • Desarrollo Frontend con Angular
    • Desarrollo Frontend con React.js
    • Desarrollo Backend con Node.js
    • Desarrollo Backend con Python
    • Desarrollo Backend con Java
    • Desarrollo Backend con PHP
    • Desarrollo Backend con Ruby
    • Bases de Datos para Web
    • Seguridad Web & API
    • Testing Automatizado y QA para Web
    • Arquitecturas Web Modernas y Escalabilidad
    • DevOps y Cloud para Desarrolladores Web
  • English Academy
    • Inglés Básico A1
    • Inglés Básico A2
    • Inglés Intermedio B1
    • Inglés Intermedio Alto B2
    • Inglés Avanzado C1
    • Inglés para Propósitos Específicos
    • Inglés de Negocios
  • Marketing Digital
    • Fundamentos de Marketing Digital
    • Marketing de Contenidos y Redacción Persuasiva
    • SEO y Posicionamiento Web
    • Social Media Marketing y Community Management
    • Publicidad Digital y Paid Media
    • Analítica Digital y Optimización (CRO)
    • Estrategia de Marketing y Growth
    • Marketing de Marca y Comunicación Estratégica
    • Marketing para E-commerce
    • Marketing B2B
    • Inteligencia Artificial Aplicada al Marketing
    • Automatización del Marketing
    • Marca Personal y Marketing Freelance
    • Ventas y Experiencia del Cliente
    • Creación de Contenido para Redes Sociales
  • Inteligencia Artificial y Data Science
    • Fundamentos de Data Science y AI
    • Análisis y Visualización de Datos
    • Machine Learning y Deep Learning
    • Data Engineer
    • Inteligencia Artificial para la Productividad
    • Desarrollo de Aplicaciones con IA
    • AI Software Engineer
  • Ciberseguridad
    • Fundamentos de Ciberseguridad
    • Hacking Ético y Pentesting (Red Team)
    • Análisis de Malware e Ingeniería Forense
    • Seguridad Defensiva y Cumplimiento (Blue Team)
    • Ciberseguridad Estratégica
  • Liderazgo y Habilidades Blandas
    • Fundamentos de Habilidades Profesionales
    • Liderazgo y Gestión de Equipos
    • Comunicación Avanzada y Oratoria
    • Negociación y Resolución de Conflictos
    • Inteligencia Emocional y Autogestión
    • Productividad y Herramientas Digitales
    • Gestión de Proyectos y Metodologías Ágiles
    • Desarrollo de Carrera y Marca Personal
    • Diversidad, Inclusión y Entorno Laboral Saludable
    • Filosofía y Estrategia para Líderes
  • Diseño de Producto y UX
    • Fundamentos de Diseño UX/UI
    • Investigación de Usuarios (UX Research)
    • Arquitectura de Información y Usabilidad
    • Diseño de Interfaces y Prototipado (UI Design)
    • Sistemas de Diseño y DesignOps
    • Redacción UX (UX Writing)
    • Creatividad e Innovación en Diseño
    • Diseño Accesible e Inclusivo
    • Diseño Asistido por Inteligencia Artificial
    • Gestión de Producto y Liderazgo en Diseño
    • Diseño de Interacciones Emergentes (VUI/VR)
    • Desarrollo Web para Diseñadores
    • Diseño y Prototipado No-Code
  • Contenido Audiovisual
    • Fundamentos de Producción Audiovisual
    • Producción de Video para Plataformas Digitales
    • Producción de Audio y Podcast
    • Fotografía y Diseño Gráfico para Contenido Digital
    • Motion Graphics y Animación
    • Contenido Interactivo y Realidad Aumentada
    • Estrategia, Marketing y Monetización de Contenidos
  • Desarrollo Móvil
    • Fundamentos de Desarrollo Móvil
    • Desarrollo Nativo Android con Kotlin
    • Desarrollo Nativo iOS con Swift
    • Desarrollo Multiplataforma con React Native
    • Desarrollo Multiplataforma con Flutter
    • Arquitectura y Patrones de Diseño Móvil
    • Integración de APIs y Persistencia Móvil
    • Testing y Despliegue en Móvil
    • Diseño UX/UI para Móviles
  • Diseño Gráfico y Arte Digital
    • Fundamentos del Diseño Gráfico y Digital
    • Diseño de Identidad Visual y Branding
    • Ilustración Digital y Arte Conceptual
    • Diseño Editorial y de Empaques
    • Motion Graphics y Animación 3D
    • Diseño Gráfico Asistido por Inteligencia Artificial
    • Creatividad e Innovación en Diseño
  • Programación
    • Fundamentos de Programación e Ingeniería de Software
    • Herramientas de IA para el trabajo
    • Matemáticas para Programación
    • Programación con Python
    • Programación con JavaScript
    • Programación con TypeScript
    • Programación Orientada a Objetos con Java
    • Desarrollo con C# y .NET
    • Programación con PHP
    • Programación con Go y Rust
    • Programación Móvil con Swift y Kotlin
    • Programación con C y C++
    • Administración Básica de Servidores Linux
  • Negocios
    • Fundamentos de Negocios y Emprendimiento
    • Estrategia y Crecimiento Empresarial
    • Finanzas Personales y Corporativas
    • Inversión en Mercados Financieros
    • Ventas, CRM y Experiencia del Cliente
    • Operaciones, Logística y E-commerce
    • Gestión de Proyectos y Metodologías Ágiles
    • Aspectos Legales y Cumplimiento
    • Habilidades Directivas y Crecimiento Profesional
    • Diversidad e Inclusión en el Entorno Laboral
    • Herramientas Digitales y Automatización para Negocios
  • Blockchain y Web3
    • Fundamentos de Blockchain y Web3
    • Desarrollo de Smart Contracts y dApps
    • Finanzas Descentralizadas (DeFi)
    • NFTs y Economía de Creadores
    • Seguridad Blockchain
    • Ecosistemas Blockchain Alternativos (No-EVM)
    • Producto, Marketing y Legal en Web3
  • Recursos Humanos
    • Fundamentos y Cultura Organizacional en RRHH
    • Atracción y Selección de Talento
    • Cultura y Employee Experience
    • Gestión y Desarrollo de Talento
    • Desarrollo y Evaluación de Liderazgo
    • Diversidad, Equidad e Inclusión
    • AI y Automatización en Recursos Humanos
    • Tecnología y Automatización en RRHH
  • Finanzas e Inversiones
    • Fundamentos de Finanzas Personales y Corporativas
    • Análisis y Valoración Financiera
    • Inversión y Mercados de Capitales
    • Finanzas Descentralizadas (DeFi) y Criptoactivos
    • Finanzas y Estrategia para Startups
    • Inteligencia Artificial Aplicada a Finanzas
    • Domina Excel
    • Financial Analyst
    • Conseguir trabajo en Finanzas e Inversiones
  • Startups
    • Fundamentos y Validación de Ideas
    • Estrategia de Negocio y Product-Market Fit
    • Desarrollo de Producto y Operaciones Lean
    • Finanzas, Legal y Fundraising
    • Marketing, Ventas y Growth para Startups
    • Cultura, Talento y Liderazgo
    • Finanzas y Operaciones en Ecommerce
    • Startups Web3 y Blockchain
    • Startups con Impacto Social
    • Expansión y Ecosistema Startup
  • Cloud Computing y DevOps
    • Fundamentos de Cloud y DevOps
    • Administración de Servidores Linux
    • Contenerización y Orquestación
    • Infraestructura como Código (IaC) y CI/CD
    • Amazon Web Services
    • Microsoft Azure
    • Serverless y Observabilidad
    • Certificaciones Cloud (Preparación)
    • Plataforma Cloud GCP

Platzi y comunidad

  • Platzi Business
  • Live Classes
  • Lanzamientos
  • Executive Program
  • Trabaja con nosotros
  • Podcast

Recursos

  • Manual de Marca

Soporte

  • Preguntas Frecuentes
  • Contáctanos

Legal

  • Términos y Condiciones
  • Privacidad
  • Tyc promociones
Reconocimientos
Reconocimientos
Logo reconocimientoTop 40 Mejores EdTech del mundo · 2024
Logo reconocimientoPrimera Startup Latina admitida en YC · 2014
Logo reconocimientoPrimera Startup EdTech · 2018
Logo reconocimientoCEO Ganador Medalla por la Educación T4 & HP · 2024
Logo reconocimientoCEO Mejor Emprendedor del año · 2024
De LATAM conpara el mundo
YoutubeInstagramLinkedInTikTokFacebookX (Twitter)Threads

      Comentarios

      Angel David Corredor

      Angel David Corredor

      Estudiante
      Hace 5 años
        Mauro Nava

        Mauro Nava

        Estudiante
        Hace 5 años
        Christian Velázquez

        Christian Velázquez

        Estudiante
        Hace 5 años
      Jose Daniel Barría Reyes

      Jose Daniel Barría Reyes

      Estudiante
      Hace 6 años
        Alex Leonardo Rodriguez Carvajal

        Alex Leonardo Rodriguez Carvajal

        Estudiante
        Hace 5 años
        Moisés Manuel Morín Hevia

        Moisés Manuel Morín Hevia

        Estudiante
        Hace 5 años
      Agustina Corvo

      Agustina Corvo

      Estudiante
      Hace 5 años
        Jimmy Buriticá Londoño

        Jimmy Buriticá Londoño

        Estudiante
        Hace 4 años
      Boris Vargas Paucara

      Boris Vargas Paucara

      Estudiante
      Hace 6 años
        Moisés Manuel Morín Hevia

        Moisés Manuel Morín Hevia

        Estudiante
        Hace 5 años
      Alex Camacho

      Alex Camacho

      Profesor
      Hace 6 años
        Moisés Manuel Morín Hevia

        Moisés Manuel Morín Hevia

        Estudiante
        Hace 5 años
      Santiago Marín Marín

      Santiago Marín Marín

      Estudiante
      Hace 5 años
      Federico Walovnik

      Federico Walovnik

      Estudiante
      Hace 5 años
        Daniel Adolfo Ordoñez Rubio

        Daniel Adolfo Ordoñez Rubio

        Estudiante
        Hace 5 años
        Moisés Manuel Morín Hevia

        Moisés Manuel Morín Hevia

        Estudiante
        Hace 5 años
      Miguel Angel Reyes Moreno

      Miguel Angel Reyes Moreno

      Estudiante
      Hace 5 años
      Luis E. Gama Ramirez

      Luis E. Gama Ramirez

      Estudiante
      Hace 5 años
        Cristian Blandon

        Cristian Blandon

        Estudiante
        Hace 5 años
        Moisés Manuel Morín Hevia

        Moisés Manuel Morín Hevia

        Estudiante
        Hace 5 años
      Andres Felipe Pinchao Ramirez

      Andres Felipe Pinchao Ramirez

      Estudiante
      Hace 5 años
      Andrés Felipe Eslava Zuluaga

      Andrés Felipe Eslava Zuluaga

      Estudiante
      Hace 6 años
      Juan Esteban Galvis

      Juan Esteban Galvis

      Estudiante
      Hace 6 años
      Gonzalo Piñeiro Aleman Urquiza

      Gonzalo Piñeiro Aleman Urquiza

      Estudiante
      Hace 6 años
      Axel Enrique Galeed Gutierrez

      Axel Enrique Galeed Gutierrez

      Estudiante
      Hace 4 años
      Ariel Chura

      Ariel Chura

      Estudiante
      Hace 5 años
        Misael Dan Guerrero Lee

        Misael Dan Guerrero Lee

        Estudiante
        Hace 5 años
      Jano Belmar

      Jano Belmar

      Estudiante
      Hace 5 años
        Adrian Ducuara Benitez

        Adrian Ducuara Benitez

        Estudiante
        Hace 5 años
      Jesus Abel Jimenez Bracho

      Jesus Abel Jimenez Bracho

      Estudiante
      Hace 4 años
      Leandro Alvarez

      Leandro Alvarez

      Estudiante
      Hace 4 años
      Gustavo Adolfo Perez Ramos

      Gustavo Adolfo Perez Ramos

      Estudiante
      Hace 5 años
      Obed Paz

      Obed Paz

      Estudiante
      Hace 5 años
      • Se puede crear un arreglo que soporte una lista definida de tipos de datos. e.g:

        let myArray: (string | number | boolean)[]; myArray = [false, 1, '2'];
      • De igual forma se puede crear un arreglo irrestricto como los de Javascript. e.g:

        let myArray: any[]; myArray = [{}, true, 'two', 0b11];

      Muchas gracias crack

      Gracias por el aporte. Creo que, comienza a gustarme Ts.

      Dos notaciones: [] y Array<Type> ejemplo:

      const names = string[]; const months = Array&lt;string&gt;;

      Se puede acceder con indices.

      names[0]; months[5];

      se puede usar la prop length se puede usar el method push Supongo que todos los de Array. Buscar en MDN.

      excelente ejemplo!

      tHANKS,

      Si queremos que un array contenga elementos de más de un tipo, lo podemos declarar de la siguiente manera:

      let arrExample: Array<string | number | boolean>; arrExample = ['firstItem', 2, 'thirdItem', 4, true]; // no da error

      Bien por el aporte.

      // ------- Tipo: Array ------- // Explicito let users: string[]; users = ['luixaviles', 'paparazzi', 'lensqueen']; // users = [1, true, 'test']; // --&gt; Error // Inferido let otherUsers = ['luixaviles', 'paparazzi', 'lensqueen']; // otherUsers = [1, true, 'test']; // --&gt; Error // Array&lt;tipoDato&gt; let pictureTitles: Array&lt;string&gt;; pictureTitles = ['Favorite Sunset', 'Vacation Time', 'Landscape']; // Accediendo a los valores en un Array console.log('first user : ', users[0]); // --&gt; users[indice]: luixaviles console.log('first title : ', pictureTitles[0]); // Propiedades en Array console.log('users.length : ', users.length); // -&gt; Tamaño del Array // Uso de funciones en Arrays users.push('aPlatziUser'); // -&gt; agrega dato a la cola del Array users.sort(); // --&gt; ordena el Array de menor a mayor (alfabetica) console.log('users', users);

      Buenísimo !"

      1. Array. Al igual que en JavaScript, TypeScript permite definir un arreglo para contener un conjunto de valores, para definir los arreglos se pueden usar nos notaciones [] y Array<type>.

        // Corchetes [] const nickname: string[] = ['Syaan', 'Matt', 'Lou'] const idNumber: number[] = [1, 2, 3, 4, 5] // Array<type> const pictureTitles: Array<string> = ['Favorite Sunset', 'Vacation Time', 'Landscape']

      Gracias, eres la mejor !

      En la versión actual typescript ya reconoce por sí solo los diferentes tipos de valores ingresados en un array sin generar error.

      Como hago para declarar un array de objetos en el cual pueda acceder a las propiedades de los mismos? Es decir, por lo que entiendo no podria utilizar object[] Seria la solucion usar Object[] o Array<Object>?

      Hola, Federico :) Puedes usar ambas sintaxis para declarar un arreglo

      // suponiendo que Object es una clase en particular let arreglo: Object[] = []; //inicia el arreglo con = [] o let arreglo: Array<Object> = []

      Ambas estan correctas, los arrays son un tipo de dato objeto. Puedes acceder a las propiedades/atributos por medio de índices.

      • Al igual que JS, TS permite definir un arreglo para contener un conjunto de valores.
      • Usa 2 notaciones: [] y Array<tipo>

      Documentación oficial de tipos de datos usados en TypeScript

      No es mas facil hacer el Console.log en en navegador. ? Digo por que son muchos comandos los que hay que hacer.

      Para los gustos, los colores.

      xD yo lo corro desde el cmd de windows, pero seee en el navegador sería sin compilar.

      MY NOTES FOR ARRAY

      • Al igual que Javascript, Typescript permite definir un arreglo para contener un conjunto de valores .
      • Usa dos notaciones: [] y Array<tipo> .
      // Corchetes [] //Tipo Explicito // tipodeDato[] let users:string[]; users =['luixaviles', 'paparazzi', 'lensqueen']; //Si le pusieramos distintos tipos de datos al que se le establecio al array //Daria error // users = [1, true, 'test']; Error //Tipo Inferido //Si le asignamos a una variable un array sin especificar el tipo //Typescript infiere el tipo de dato que tendra dependiendo lo que le pasemos let otherUsers = ['luixaviles', 'paparazzi', 'lensqueen']; // users = [1, true, 'test']; Error // Arra<TIPO> //Definimos el array esplicitamente y dentro de los <> ponemos el tipo de dato que //Tendra el array let pictureTitles: Array<string>; //Al berificar con el cursor la variable veremos el tipo de dato que tiene el array pictureTitles =['Favorite Sunset', 'Vacation Time', 'Landscape']; //Accediendo a los valores en un Array //Podremos acceder al elemento de un array igual que en js console.log(pictureTitles[0]); //Propiedades en Array console.log(users.length) //3 //Funciones en Array users.push('platzi users'); users.sort(); console.log('users', users);

      Al igual que en JS o lenguajes de alto nivel, TS permite almacenar un conjunto de datos - Para definirlo se usan dos formas: []TYPE || Array<TYPE>

      //Tipo Explícito: [] let myFirstArray: string[]; // Se especifica que el tipo del arreglo contiene strings - Únicamente contiene Strings myFirstArray = ['Andrés', 'Jhon', 'Iván', 'Santo']; // myFirstArray = [123, false, 'indicator'] // Error //Tipo Inferido: [] let mySecondArray = [ 123, false, 'indicator' ]; mySecondArray = [true, 'compulsive', 23]; mySecondArray = ['myString', false, 456]; // En los tipos inferidos de los arrays, la forma estructural de como se declara define los tipos // que puede tener dentro el arreglo, en este caso es ( string | number | boolean ) y no importa el orden // solo debe cumplir con que existan esos tres tipos de datos dentro del Array. Sino, arrojará Error //Tipo Explícito: Array<TYPE> let myNumbers: Array<number>; myNumbers = [12, 34, 56]; console.log('valores del arreglo myNumbers -> ', myNumbers[2]) console.log('valores del arreglo myfirstArray -> ', myFirstArray[0]) mySecondArray.pop() mySecondArray.unshift(678) console.log('valores del arreglo mySecondArray -> ', mySecondArray) myFirstArray.sort() console.log('valores del arreglo myFirstArray -> ', myFirstArray)

      Dejo la documentación de Mozilla sobre los Array y sus métodos (Que son bastantes): https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array

      Si la variable la declaran en singular el compilador arroja un error.

      Una consulta. ¿Cuál de las notaciones es mejor usar?

      let variableName: datatype[] = [value]; // O let variableName: Array<type> = [value];

      ¿Cuál tiene mejores prácticas? Gracias. 😄

      Hola, no se muy bien por que pasa esto.

      2021-08-09_22h32_26.png

      Al tratar de usar cualquier método del string "Hola" que esta en la primera posicion del array, el método se me subraya como error.

      Necesitas decirle a Typescript que en esa linea vas a manejar el elemento como String. Eso lo verás en una clase posterior. Este es el enlace:

      Aserciones de Tipo

      Holas, en el minuto 7:07 el profesor escribe user. y aparecen propiedades, a mi solo me aparecen las propiedades y no la tabla explicativa del lado derecho, alguien me puede indicar por favor que me falta presionar o agregar en el vscode para que aparezca esa tabla?

      Hola Jano-belmar, espero se encuentre bien, VS Code normalmente se integra bien a este lenguaje, quiere decir que debería mostrar esa ventanita de detalles si no es así entonces trata de instalar los siguientes plugins:

      • ESLint
      • TSLint
      • Prettier - Code formatter (Este último para apariencia del código)

      Espero te sirve, #NuncaParesDeAprender

      tambien se puede hacer lo siguiente:

      let variable: any []; variable = [false, 1, '2']; console.log(variable)

      Algunas funciones de Array en contexto typescript:

      // Uso de funciones en Arrays users.push('aPlatziUser'); users.sort(); console.log('users', users); let newUsers = ['Leandro','Gabriela']; let arrayConcat =users.concat(newUsers); console.log('users concat', arrayConcat); let usersJoin = users.join('-'); console.log('users Join', usersJoin); let usersIndexOf = arrayConcat.lastIndexOf('Leandro'); console.log('users IndexOf', usersIndexOf); let usersPop=users.pop(); console.log('users pop', usersPop);

      Tipo: Array

      • Al igual que JavaScript, TypeScript permite definir un arreglo para contener un conjunto de valores
      • Usa dos notaciones: [] y Arrat<tipo>
      // Tipo Explicito let users: string[]; users = ['name1', 'name2', 'name3']; // users = [1, true, 'test'] // Error solo string // Tipo inferido let otherUsers = ['a', 'b']; // otherUsers = [1, true, 'test'] // Error solo string // Array<TIPO> let pictureTitles: Array<string>; pictureTitles = ["A", "B"]; console.log("fistUser", users[0]); console.log("fistTitle", pictureTitles[0]);

      Me parece bien utilizar la nomenclaruta de variable: tipo[ ] para arreglos rapidos y de pocos elementos que vaya a ocupar en mi proyecto. Y usar variable: Array<tipo> para aquellos arreglos que van a contener muchos elementos y su longitud estara variando a lo largo de la aplicacion.