Types, Type Inference y Type keyword

3/28
Recursos
Transcripción

A diferencia de JavaScript, TypeScript es un lenguaje fuertemente tipado. Mientras que en JavaScript declaramos una constante de la siguiente manera:

const a = 'hola'

En TypeScript utilizando el carácter ‘:’ le asignamos un tipo de dato a la variable :

const a: string = 'hola'

En caso de que no le asignemos un tipo de dato a la variable, TypeScript automáticamente le va a asignar un tipo de dato, esto es el Type Inference.

Si le asignamos el tipo de dato any a una variable, esta variable va a poder almacenar cualquier tipo de dato, similar a JavaScript Vainilla.

Dentro de TypeScript contamos con la palabra reservada type que nos va a ser de utilidad cuando hagamos nuestros propios tipos de datos.

Aportes 32

Preguntas 3

Ordenar por:

¿Quieres ver más aportes, preguntas y respuestas de la comunidad? Crea una cuenta o inicia sesión.

Declaración de Variables en TypeScript
’let’ y ‘const’ son tipos de declaradóres de variables similares a var, que permiten evitar algunos de los “problemas” de JavaScript.
const, por ejemplo evita la reasignación a una variable.

const numLivesForCat = 9; // no se puede re asignar

let, impide el block-scoping
Las variables ‘let’ no son visibles fuera de su bloque o bucle for más cercano.

let hello = "Hello!"; // declaración normal
// block scoping test
var a = 5;
var b = 10;

if (a === 5) {
  let a = 4; // El alcance es dentro del bloque if
  var b = 1; // El alcance es global
  console.log(a);  // 4
  console.log(b);  // 1
} 
console.log(a); // 5
console.log(b); // 1

Tipos de Datos en TypeScript
Boolean - El tipo de dato más básico, puede ser true o false

let isDone: boolean = false;

Number - Los valores numéricos reciben el tipo de dato ‘number’.
También soporta decimal y hexadecimal. Binario y Octal a partir de ECMAScript 2015.

let decimal: number = 67;
let hex: number = 0xf00d;
let binary: number = 0b1010;
let octal: number = 0o744;

String - Usamos ‘string’ para referirnos a estos tipos de datos textuales.
Podemos usar comillas dobles (") o simples (’) para rodear la cadena. Tambien los `` para mezclar las cadenas con otras variables.

let color: string = "blue";
color = 'red';
let fullName: string = `Bob Bobbington`;
let sentence: string = `Hola!, mi nombre es ${fullName}`;

Array - Los tipos de dato Array pueden ser escritos de dos maneras.
1 - Colocamos el tipo de datos seguido de un [], señalamos que sera un array de ese tipo

let list: number[] = [1, 2, 3];

2 - Usamos un generic, Array<elemType>

let list: Array<number> = [1, 2, 3];

Any - Cuando aun no sabemos que tipo de dato vamos a utilizar.

let notSure: any = 4;
// ...las reasignamos...
notSure = "quizas es un string";
notSure = false; // ahora es un boolean
// si la usamos en un Array podemos mezclar los tipos de datos
let list: any[] = [1, true, "free"];

Void - Lo opuesto a any
Visto comunmente en las functions y quiere decir que no retorna ningun valor.

function warnUser(): void {
    console.log("Este es mi mensaje");
}
// declarar variables con javascript
let nombre = 'Alejandro';
// declarar variables con TypeScript (lleva el tipo de dato)
let apellido: string = 'Dubon';
//reasignar una variable solo la llamamos de nuevo y le asignamos el nuevo valor
apellido = 'Estrada';
//apellido = 1; //a una variable string no se le puede asignar un numero

let a: number = 10;
//si no se especifica el type, TypeScript se ejecutra el type-inference 
let b = 20;
const resultado = a + b;

//la funciones que retornan valores tambien deben llevar el tipo de datos que retornan
function suma(num1:number, num2:number): number{
    return num1 + num2
}
suma(1,2);

//funciones con javascript vanilla
function suma2(num1, num2){
    return num1 + num2
}

// type-keyword asignamos un alias a nuestros types (es un alias que tiene una connotacion significativa en nuestro programa)
type identificacion = string;


los tipos de datos personalizados permiten que una variable contenga un tipo de dato u otro dicho de otra forma:

type dni: string | number;

let dni1: dni = "1-234567-8";
let dni2: dni = 12345678;
  • Sintaxis de declaración de un variable:
    let name: type = value

  • Sintaxis de una función:
    function nombre(parametro: tipoDato): tipoDatoRetorno {
    //Logica
    return variable;
    }

  • El tipo de dato any significa que no tiene un tipo asignado, y hace referencia a js vanila.

TYPE KEYOWORD

  • Un type es un tipo de dato que puede ser utilizado para realizar nuestros propios tipo de dato.
    Sintaxis
    type nombre = tipoDato;
    Ejemplo:
    type dni = string
    let dniEmpleado: dni = “123243”;

Resumen de la clase, complemente un poco lo aprendido agregando los tipos de datos de TypeScript
https://www.typescriptlang.org/docs/handbook/basic-types.html

Entonces estos Types, Type Inference y Type keyword ¿son funcionalidades que nos provee Typescript?

Type es magia

En Type script se pueden asignar diferentes tipos de variables con la palabra “type”:

let :number = 7;
let:string = 'Curso Platzi';
let:boolean = true

También se pueden aplicar a funciones indicando el tipo de variables en los argumentos y retorno de la mísma:

function totalEdades(edad1: number, edad2: number): number  {
	return edad1 + edad2;
}

También se puede crear variables personalizadas mediante la palabra clave “type”, esto nos permite tener un mayor sobre un grupo de tipo de variables. Ejemplo:

type nota = number; // Se puede el grupo de variables a type nota = string;
let nota1: nota = 20;
let nota2: nota = 18;

se parece un poco a Swift esta clase, me parece

Seria de gran ayuda que el instructor compartiera los codigos para tener solo que centrarse en entender la logica.

Al finnn alguien que habla bien inglés ❤️ ❤️ geniooo

Excelente clase

Diferencia entre const y let?

Genioo!!! muy buena la clase

Crack!

mi pregunta es en java - eclipse al correr un .java podias ver los resultados en consola. como veo los resultados en la consola en visual code. por ejemplo: function suma(num1:number,num2:number):number{
return num1+num2;
}
print suma(2,4);
---- consola ----
6
como hacer eso en visual studio que estension usar ayuda plz! thx!

Está buenísimo eso del Type Keyword, es bastante útil, gracias por explicarlo.

Muy buena clase, excelente explicación.

Muy buena explicación!

Explicación clara y concisa

A diferencia de JavaScript, TypeScript es un lenguaje fuertemente tipado. Mientras que en JavaScript declaramos una constante de la siguiente manera:

const a = ‘hola’

En TypeScript utilizando el carácter ‘:’ le asignamos un tipo de dato a la variable :

const a: string = 'hola’
En caso de que no le asignemos un tipo de dato a la variable, TypeScript automáticamente le va a asignar un tipo de dato, esto es el Type Inference.

Si le asignamos el tipo de dato any a una variable, esta variable va a poder almacenar cualquier tipo de dato, similar a JavaScript Vainilla.

Dentro de TypeScript contamos con la palabra reservada type que nos va a ser de utilidad cuando hagamos nuestros propios tipos de datos.

// Types

let a: string = 'hola';
a = 'holas';
// Podemos asignar un tipo a nuestras variables: number o string

let b: number = 3;

b = 7;

// Si se cambia un number a string da error, lo mismo si se cambia de string a number

let c: number = 4;
c = 'hola'; // da error

// Type Inference

// Lo mismo sucede con los functions, se le asigna un tipo a los parametros y a la misma function

const num1 = 1;
const num2 = 2;

function suma(num1: number, num2: number){
    return num1 + num2;
}

function sumaJavascriptVanilla() {
    return num1 + num2;
}

// Creamos un Type keyword
// En este caso se usara para la creacion de un dni

type dni = number;
let dniNumber: dni = 123;
let dniNumber1: dni = 1234;

Dale like si te ayudo!

Para más detalles sobre los tipos de datos vistos y explorar el restante, pueden revisar la documentación.

los tipos es una característica principal de typescript comparando con javascript.

Excelente clase, como comentario obligado, no olvidar realizar el curso de TypeScript

Muy buena explicación.

buen profe

En conclusión; con TypeScript aplicas un boost a JavaScript.