0% encontró este documento útil (0 votos)
317 vistas40 páginas

Presentación de TypeScript

TypeScript es un lenguaje de programación moderno que permite crear aplicaciones web robustas en JavaScript mediante la adición de tipos estáticos y características de programación orientada a objetos. TypeScript se compila a JavaScript limpio, lo que permite ejecutar el código resultante en cualquier lado. Las principales características de TypeScript incluyen tipos de datos, interfaces, clases, módulos y herencia.

Cargado por

Jose Salazar
Derechos de autor
© © All Rights Reserved
Nos tomamos en serio los derechos de los contenidos. Si sospechas que se trata de tu contenido, reclámalo aquí.
Formatos disponibles
Descarga como PDF, TXT o lee en línea desde Scribd
0% encontró este documento útil (0 votos)
317 vistas40 páginas

Presentación de TypeScript

TypeScript es un lenguaje de programación moderno que permite crear aplicaciones web robustas en JavaScript mediante la adición de tipos estáticos y características de programación orientada a objetos. TypeScript se compila a JavaScript limpio, lo que permite ejecutar el código resultante en cualquier lado. Las principales características de TypeScript incluyen tipos de datos, interfaces, clases, módulos y herencia.

Cargado por

Jose Salazar
Derechos de autor
© © All Rights Reserved
Nos tomamos en serio los derechos de los contenidos. Si sospechas que se trata de tu contenido, reclámalo aquí.
Formatos disponibles
Descarga como PDF, TXT o lee en línea desde Scribd
Está en la página 1/ 40

TypeScript

Es un lenguaje de programación moderno que


permite crear aplicaciones web robustas en
JavaScript.
TypeScript

● Es un precompilador.
● No requiere ningún plugin.
Instalación de TypeScript

Para la instalación de TypeScript se necesita utilizar el


gestor de paquetes de Node Js (NPM).

1. Abrir la consola.
2. Escribir el siguiente comando.

> npm install -g typescript


Comprobación de la instalación

Para la comprobación de la instalación de TypeScript


se necesita utilizar la consola y escribir el siguiente
comando.

> tsc -v
Iniciar con TypeScript

1. Crear un nuevo directorio.


2. Agregar un nuevo archivo con la extensión .ts.
3. Abrir la consola.
4. Escribir el siguiente comando para compilar el
archivo.

> tsc app.ts


Configuración para TypeScript

1. Abrir la consola.
2. Escribir el siguiente comando.

> tsc -init

Este comando creará un archivo llamado tsconfig.json.


Configuración para TypeScript

Ejemplo del archivo tsconfig.json

{
"compilerOptions" : {
"module" : "commonjs",
"target" : "es5",
"noImplicitAny" : false,
"sourceMap" : false
}
}
Definición de variable.

En TypeScript hay dos formas de declarar variables:


Let tiene un alcance de bloque.
Var no tiene un alcance de bloque.
var

Ejemplo de uso de var.

var foo = 123;

if (true) {
var foo = 456;
}

console.log(foo);
let

Ejemplo de uso de let.

let foo = 123;

if (true) {
let foo = 456;
}

console.log(foo);
Tipos de datos

TypeScript es un lenguaje que añade a JavaScript una


capa de tipado estático e incorpora la programación
orientada a objetos.
Datos primitivos: Boolean

Boolean
true o false
let acceso : boolean = true;

acceso = false;
Datos primitivos: Number

Number
Datos numéricos.
let decimal: number = 6;
let hex: number = 0xf00d;
let binary: number = 0b1010;
let octal: number = 0o744;
Datos primitivos: String

String
Cadenas de caracteres y/o textos.
let nombre: string = ‘Juan Perez’;
let direccion: string = “Guatemala, Zona 1”;
let mensaje: string = `Hola Mundo`;
Datos primitivos: String Template

Template
Son plantillas para concatenar strings.
let nombre: string = ‘Juan Perez’;
let edad: number = 37;
let mensaje: string = `Hola, mi nombre es ${ nombre }.
y mi edad es de ${ edad}`;
Datos primitivos: Any

Any
Puede ser cualquier tipo de objeto de javascript.
let variable: any = 4;
variable = "maybe a string instead"; // typeof = string
variable = false; // typeof = boolean
Datos primitivos: Array

Array
Arrays, sino se les especifica tipo son ANY.
let listNumber: number[ ] = [ 1, 2, 3, 4 ];
let listString: Array<string> = [“Hola”, “Saludos”, “Adios”];
Definición de métodos

Métodos con parámetros obligatorios.

function sumar(x: number, y: number): number{


return x + y;
}

function calcular(x: number, y: number): void {


let total: number = (x + y);
}
Definición de métodos

Métodos con parámetros opcionales.

function sumar(x?: number, y?: number): number{


return x + y;
}

function calcular(x?: number, y?: number): void {


let total: number = (x + y);
}
Definición de métodos

Métodos con parámetros y valor por defecto.

function sumar(x: number = 10, y: number = 10): number{


return x + y;
}

function saludar(x: string=”Hola”, y?: string): void {


let mensaje: string= (x + y);
}
Definición de métodos lambda

Métodos con parámetros.

let sumar = (x: number, y: number) => {


(x + y);
}

let saludar = (nombre: string) => {


“Hola “ + nombre;
}
Promesas

Representa un resultado eventual de una operación


asincrónica.
Promesas

Ejemplo de promesa:

const promise = new Promise((resolve, reject) => {


resolve(123);
});
promise.then((res) => {
console.log('Fue llamado: ', res == 123); // Devuelve: true
});
promise.catch((err) => {
console.log(“Hay un error”);
});
Programación
Orientada a Objetos
con TypeScript
Ejemplo de clase en TypeScript

class Persona {
public nombre: string;

constructor(nombre: string) {
this.nombre = nombre;
Clases }

saludar(): string{
return "Hola, soy " + this.nombre;
}
}
Ejemplo para instanciar una clase

Instancia let persona = new Persona(“Juan”);


TypeScript también admite modificadores
Modificadores de acceso o visibilidad.
● public
● private
de acceso ● protected
Ejemplo de herencia en TypeScript

class Persona {
public nombre: string;

constructor(nombre: string) {
this.nombre = nombre;
Herencia }

mostrar(telefono: string) {
console.log(`${this.nombre} y el
número ${telefono}.`);
}
}
Ejemplo de herencia en TypeScript

class Contacto extends Persona {


constructor(nombre: string) {
super(nombre);
}

Herencia mostrar(telefono: string) {


console.log(‘Contacto: ’);
super.mostrar(telefono);
}
}
Ejemplo de herencia en TypeScript

Uso let contacto1 = new Contacto(“Juan”);


contacto1.mostrar(“43315542”);
de let contacto2 = new Contacto(“Pedro”);
contacto2.mostrar(“43231242”);
Herencia
En TypeScript las interfaces son las
encargadas de comprobar los tipos de las
Interface variables que se pasan como argumentos
y del cumplimiento de los contratos
Ejemplo de interface en TypeScript

interface Persona{
nombre: string,
apellido: string
Implementación }

de let batman:Persona = {
nombre: "Bruno",
Interface }
apellido: “Diaz”
Ejemplo de interface en TypeScript

interface Persona{
nombre: string,
puesto: string
Implementación }

de class Empleado implements Persona {


nombre: string;
Interface puesto: string;
constructor (nombre: string, puesto: string)
{
this.nombre = nombre;
this.puesto = puesto;
}
}
Los módulos en typescript nos permiten
agrupar lógica en trozos de código para
que sean exportados.
Módulos Es un forma de crear aplicaciones
escalables con cierto orden y un código
fácil de mantener.
Ejemplo de módulos en TypeScript

mi_modulo.ts

const MiModulo = {
Exportación saludar(): string {
return ‘Hola’;
de }
}

Módulos export { MiModulo };


Ejemplo de módulos en TypeScript

app.ts

Importación import { MiModulo } from ‘./mi_modulo’;


de MiModulo.saludar();
Módulos
Ejemplo de módulos en TypeScript

persona.ts

class Persona{
Exportación saludar(): string {
return ‘Hola’;
de }
}

Clases
export { Persona };
Ejemplo de módulos en TypeScript

app.ts

import { Persona } from ‘./persona’;


Importación
de let persona = new Persona();

Clase persona.saludar();
Conclusiones

También podría gustarte