Share
Después de leer el tutorial introductorio de TypeScript, ahora debería poder escribir su propio código de TypeScript en un IDE que lo admita y luego compilarlo en JavaScript. En este tutorial, aprenderá sobre los diferentes tipos de tipos de datos disponibles en TypeScript.
JavaScript tiene siete tipos de datos diferentes: Nulo, No definido, Booleano, Número, Cadena, Símbolo (introducido en ES6) y Objeto. TypeScript define algunos tipos más, y todos se tratarán en detalle en este tutorial..
Al igual que en JavaScript, el nulo El tipo de datos en TypeScript solo puede tener un valor válido: nulo. Una variable nula no puede contener otros tipos de datos como el número y la cadena. Establecer una variable en nulo borrará su contenido si tuviera alguno.
Recuerda que cuando el strictNullChecks la bandera está establecida en cierto en tsconfig.json, solo el valor nulo es asignable a las variables con tipo nulo. Este indicador está desactivado de forma predeterminada, lo que significa que también puede asignar el valor nulo a variables con otros tipos como número o vacío.
// Con strictNullChecks establecido en true deja a: null = null; // Ok let b: undefined = null; // Error deja c: numero = nulo; // Error let d: void = null; // Error // Con strictNullChecks establecido en falso deja a: null = null; // Ok let b: undefined = null; // Ok deja c: numero = nulo; // Ok vamos a d: void = null; // Okay
Cualquier variable cuyo valor no haya especificado se establece en indefinido. Sin embargo, también puede establecer explícitamente el tipo de una variable como indefinida, como en el siguiente ejemplo.
Tenga en cuenta que una variable con tipo ajustado a indefinido Solo puede tener indefinido como su valor. Si el strictNullChecks opción está configurada para falso, También podrás asignar indefinido a variables con números y tipos de cadenas, etc..
// Con strictNullChecks establecido en true, deje que: undefined = undefined; // Ok let b: undefined = null; // Error deja c: numero = indefinido; // Error let d: void = undefined; // Ok // Con strictNullChecks establecido en falso deja a: undefined = undefined; // Ok let b: undefined = null; // Ok vamos a c: number = undefined; // Ok vamos a d: void = undefined; // Okay
El tipo de datos vacío se utiliza para indicar la falta de un tipo para una variable. Configurando variables para tener un vacío Es posible que el tipo no sea muy útil, pero puede configurar el tipo de retorno de funciones que no devuelven nada a vacío. Cuando se usa con variables, el tipo vacío Solo puede tener dos valores válidos: nulo y indefinido.
// Con strictNullChecks establecido en true, deje que: void = undefined; // Ok, deja b: void = null; // Error deja c: void = 3; // Error let d: void = "apple"; // Error // Con strictNullChecks establecido en falso deja a: void = undefined; // Ok, deja b: void = null; // Ok deja c: void = 3; // Error let d: void = "apple"; // error
A diferencia del número y cuerda tipos de datos, booleano Solo tiene dos valores válidos. Solo puedes establecer su valor en cierto o falso. Estos valores se usan mucho en las estructuras de control donde se ejecuta un fragmento de código si se cumple una condición cierto y otra pieza de código se ejecuta si una condición es falso.
Aquí hay un ejemplo muy básico de declarar variables booleanas:
vamos a: boolean = true; vamos b: booleano = falso; sea c: booleano = 23; // Error let d: boolean = "blue"; // error
los número el tipo de datos se utiliza para representar tanto valores enteros como de coma flotante en JavaScript, así como en TypeScript. Sin embargo, debe recordar que todos los números se representan internamente como valores de punto flotante. Los números también se pueden especificar como literales hexadecimales, octales o binarios. Tenga en cuenta que las representaciones octales y binarias se introdujeron en ES6, y esto puede dar como resultado una salida de código JavaScript diferente según la versión a la que se dirige..
También hay tres valores simbólicos especiales adicionales que caen bajo la número tipo: +infinito, -infinito, y Yaya. Aquí hay algunos ejemplos de cómo usar el número tipo.
// Con strictNullChecks establecido en true, deje que: number = undefined; // Error let b: number = null; // Error deja c: numero = 3; sea d: número = 0b111001; // Binary let e: number = 0o436; // octal let f: number = 0xadf0d; // Hexadecimal let g: number = "cat"; // Error // Con strictNullChecks establecido en falso deja a: number = undefined; // Ok, deja b: número = nulo; // Ok deja c: numero = 3; sea d: número = 0b111001; // Binary let e: number = 0o436; // octal let f: number = 0xadf0d; // Hexadecimal let g: number = "cat"; // error
Cuando la versión de destino se establece en ES6, el código anterior se compilará con el siguiente JavaScript:
dejar a = indefinido; sea b = nulo; sea c = 3; sea d = 0b111001; sea e = 0o436; sea f = 0xadf0d; sea g = "gato";
Debe tener en cuenta que las variables de JavaScript todavía se declaran utilizando dejar, que se introdujo en ES6. Tampoco ve ningún mensaje de error relacionado con el tipo de diferentes variables porque el código JavaScript no tiene conocimiento de los tipos que usamos en el código de TypeScript.
Si la versión de destino se establece en ES5, el código de TypeScript que escribimos anteriormente se compilará con el siguiente JavaScript:
var a = indefinido; var b = nulo; var c = 3; var d = 57; var e = 286; var f = 0xadf0d; var g = "gato";
Como puedes ver, esta vez todas las ocurrencias de la dejar palabra clave se han cambiado a var. También tenga en cuenta que los números octales y binarios se han cambiado a sus formas decimales.
El tipo de datos de cadena se utiliza para almacenar información textual. Tanto JavaScript como TypeScript usan comillas dobles (") así como comillas simples (') para rodear su información textual como una cadena. Una cadena puede contener cero o más caracteres entre comillas.
// Con strictNullChecks establecido en true, deje que: string = undefined; // Error let b: string = null; // Error let c: string = ""; sea d: string = "y"; let e: string = "building"; sea f: string = 3; // Error let g: string = "3"; // Con strictNullChecks establecido en falso deja a: string = undefined; // Ok, deja b: string = null; // Ok deja c: string = ""; sea d: string = "y"; let e: string = "building"; sea f: string = 3; // Error let g: string = "3";
TypeScript también admite cadenas de plantillas o literales de plantillas. Estos literales de plantilla le permiten incrustar expresiones en una cadena. Los literales de plantilla están encerrados por el carácter de marca de retroceso (') en lugar de comillas dobles y comillas simples que encierran cadenas regulares. Fueron introducidos en ES6. Esto significa que obtendrá una salida de JavaScript diferente según la versión a la que se dirige. Aquí hay un ejemplo del uso de literales de plantilla en TypeScript:
let e: string = "building"; sea f: número = 300; let oracion: string = 'El $ e frente a mi oficina tiene $ f pies de altura.';
Tras la compilación, obtendrá el siguiente JavaScript:
// Salida en ES5 var e = "edificio"; var f = 300; var oración = "El" + e + "frente a mi oficina tiene" + f + "pies de altura."; // Salida en ES6 let e = "building"; sea f = 300; dejar frase = 'El $ e en frente de mi oficina tiene $ f pies de altura.';
Como puede ver, la plantilla literal se cambió a una cadena regular en ES5. Este ejemplo muestra cómo TypeScript le permite utilizar todas las funciones más recientes de JavaScript sin preocuparse por la compatibilidad.
Puede definir los tipos de matriz de dos maneras diferentes en JavaScript. En el primer método, especifique el tipo de elementos de matriz seguido de [] que denota una matriz de ese tipo. Otro método es utilizar el tipo de matriz genérica. Formación. El siguiente ejemplo muestra cómo crear matrices con estos dos métodos. Especificando nulo o indefinido como uno de los elementos producirá errores cuando el strictNullChecks bandera es cierto.
// Con strictNullChecks establecido en falso deja a: número [] = [1, 12, 93, 5]; sea b: string [] = ["a", "albaricoque", "mango"]; sea c: número [] = [1, "manzana", "papa"]; // Error let d: Array= [nulo, indefinido, 10, 15]; let e: Array = ["pie", nulo, ""]; // Con strictNullChecks establecido en true, deje que: number [] = [1, 12, 93, 5]; sea b: string [] = ["a", "albaricoque", "mango"]; sea c: número [] = [1, "manzana", "papa"]; // Error let d: Array = [nulo, indefinido, 10, 15]; // Error let e: Array = ["pie", nulo, ""]; // error
El tipo de datos de la tupla le permite crear una matriz donde se conoce de antemano el tipo de un número fijo de elementos. El tipo del resto de los elementos solo puede ser uno de los tipos que ya ha especificado para la tupla. Aquí hay un ejemplo que lo hará más claro:
deja a: [número, cadena] = [11, "lunes"]; sea b: [número, cadena] = ["lunes", 11]; // Error deja c: [número, cadena] = ["a", "mono"]; // Error let d: [número, cadena] = [105, "owl", 129, 45, "cat"]; sea e: [número, cadena] = [13, "bat", "spiderman", 2]; e [13] = "elefante"; e [15] = falso; // error
Para todas las tuplas en nuestro ejemplo, hemos establecido el tipo del primer elemento a un número y el tipo del segundo elemento a un cuerda. Como solo hemos especificado un tipo para los dos primeros elementos, el resto de ellos puede ser una cadena o un número. Creando tuplas segundo y do da como resultado un error porque intentamos usar una cadena como valor para el primer elemento cuando habíamos mencionado que el primer elemento sería un número.
Del mismo modo, no podemos establecer el valor de un elemento tupla en falso después de especificar que solo contendrá cadenas y números. Es por eso que la última línea da como resultado un error..
los enumerar El tipo de datos está presente en muchos lenguajes de programación como C y Java. Falta de JavaScript, pero TypeScript le permite crear y trabajar con enumeraciones. Si no sabes que enums son, te permiten crear una colección de valores relacionados usando nombres memorables.
enumeración Animales cat, lion, dog, cow, monkey let c: Animals = Animals.cat; console.log (Animals [3]); // cow console.log (Animals.monkey); // 4
De forma predeterminada, la numeración de enumeraciones comienza en 0, pero también puede establecer un valor diferente para el primero o cualquier otro miembro manualmente. Esto cambiará el valor de todos los miembros que los siguen aumentando su valor en 1. También puede establecer todos los valores manualmente en una enumerar.
enumeración Animales cat = 1, lion, dog = 11, cow, monkey let c: Animals = Animals.cat; console.log (Animals [3]); // undefined console.log (Animals.monkey); // 13
A diferencia del ejemplo anterior, el valor de Animales [3] es indefinido esta vez. Esto se debe a que el valor 3 se habría asignado a dog, pero establecimos explícitamente su valor en 11. El valor para cow se mantiene en 12 y no 3 porque se supone que el valor es uno mayor que el valor del último miembro.
Supongamos que está escribiendo un programa en el que el valor de una variable está determinado por los usuarios o el código escrito en una biblioteca de terceros. En este caso, no podrá establecer el tipo de esa variable correctamente. La variable podría ser de cualquier tipo, como una cadena, un número o un valor booleano. Este problema se puede resolver utilizando el alguna tipo. Esto también es útil cuando está creando matrices con elementos de tipos mixtos.
deja a: any = "apple"; sea b: cualquiera = 14; sea c: cualquiera = falso; sea d: cualquiera [] = ["puerta", "cocina", 13, falso, nulo]; b = "gente";
En el código anterior, pudimos asignar un número a segundo y luego cambiar su valor a una cadena sin obtener ningún error porque el tipo alguna Puede aceptar todo tipo de valores..
los Nunca type se usa para representar valores que nunca se supone que ocurran. Por ejemplo, puede asignar Nunca como el tipo de retorno de una función que nunca devuelve. Esto puede suceder cuando una función siempre lanza un error o cuando se atasca en un bucle infinito.
deja a: nunca; // Ok, deja b: nunca = falso; // Error let c: never = null; // Error let d: never = "lunes"; // Función de error atascada (): nunca while (verdadero)
Este tutorial le presentó a todos los tipos que están disponibles en TypeScript. Aprendimos cómo asignar un tipo diferente de valor a una variable mostrará errores en TypeScript. Esta comprobación puede ayudarlo a evitar muchos errores al escribir programas grandes. También aprendimos cómo apuntar a diferentes versiones de JavaScript.
Si está buscando recursos adicionales para estudiar o usar en su trabajo, vea lo que tenemos disponible en el mercado de Envato.
En el siguiente tutorial, aprenderá acerca de las interfaces en TypeScript. Si tiene alguna pregunta relacionada con este tutorial, hágamelo saber en los comentarios..
Accentsconagua