Tipos inferidos

En el anterior curso 2020 de TS el profesor expostaba un objeto vacio para poder quitar los errores del editor:

export {}

Sin embargo, nunca entendí bien el porqué, aunque tenga más líneas de código, creo que es mejor practica la que se ve en esta clase.

Inmediately Invoked Function Expression (IIFE).

También se pueden usar para simular un ‘top level await’:

(async () => { 
	...
	const students = await window.fetch(...)
	...
})() 

Les recomiendo la extensión Error Lens en VSCode.
Te permite ver los errores en tiempo real y te indica en la misma línea, en donde tenés el error y la descripción del mismo.
Ejemplo:

De esta clase podemos concluir:

• TS usa tipos inferidos para “asignar” tipos de datos a variables sin que se las tengamos que asignar de manera explicita
• Entre los beneficios de usar TS esta el hecho de que tenemos los metodos usados a cada tipo de datos, como en el caso de una variable “string”, podemos acceder a el método toLowerCase de manera mas rápida
• Al no tener aun modularizacion, TS nos alerta de que ciertas variables ya han sido declaradas, esto lo podemos prevenir con funciones anónimas autoejecutadas

una función anónima auto-ejecutada :

(( ) => {

}) ( );

No hay ninguna ventaja de utilizar un arrow function en un **IIFE **(Immediately Invoke Function Expression) por lo cual usar una funcion normal me parece mas correcto

(function() {

})()

Les comparto mis apuntes. 😄

Tipo de dato inferido

Sin necesidad de especificar el tipo de dato, TypeScript supone o deduce el mismo con el valor que le asignamos a la variable.

Es recomendable usarlo por encima del tipo de dato explico cada vez que sea posible.

Variables (let y var)

En TypeScript nos dice el tipo de dato que tienen que recibir estás variables, ya que como son variables pueden solamente cambiar a lo largo del programa pero solo por ese tipo de dato.

Constantes (const)

Aquí TypeScript no nos dice tipo de dato de nuestra constante, porque como su nombre lo indica, la misma no puede cambiar a lo largo del programa por otro valor.

Funciones anónimas autoejecutable

((parameters) => {
		statements
})();

Esas funciones se les conoce como IIFE (Immediately Invoked Function Expression)
Acá te dejo la documentaciòn

Ese Tipo de función es llamado Función IFEE (Immediately-invoked function expressions y este tipo de función se manda a llamar por si sola. Se puede escribir como arrow function o function declaration

(() => {
  
})()
(function() {
  
})()

muy interesante, siempre escuchaba sobre TS pero no habia tenido la oportunidad ni la necesidad de usarlo, pues definitivamente me esta gustando TS…

//* Función anónima autoejecutada

(() => {
  let myProductName = 'Product 1'
  let myProductPrice = 123

  //!myProductName = 123 no podemos hacer esto
  myProductName = 'change'
  myProductName.toUpperCase()

  myProductPrice.toString()

  const myProductStock = 1000
  //! myProductStock = 2000; no podemos hacerlo porque es una constante

})();

//* Hacemos esto para poder usar los mismos nombres de variables en otros archivos de TS.

Aquí te muestro varias formas de evitar las advertencias de TypeScript sobre la asignación de un número a una variable inferida como string utilizando diferentes enfoques:
.

1. Utilizar any:

let myProductName: any = 'Product 1';
let myProductPrice: any = 123;

myProductName = 12321;  // Sin alerta de TypeScript

Al asignar el tipo any a las variables, le estás diciendo a TypeScript que permita cualquier tipo de valor, lo cual incluye la asignación de un número a una variable inferida como string. Sin embargo, debes tener en cuenta que el uso excesivo de any puede eliminar gran parte de los beneficios de TypeScript, ya que pierdes el control de tipos estático.

1. Utilizar unknown:

let myProductName: unknown = 'Product 1';
let myProductPrice: unknown = 123;

myProductName = 12321;  // Sin alerta de TypeScript

Al utilizar unknown, estás indicando que no tienes información sobre el tipo de la variable. Al igual que any, unknown permite asignar cualquier tipo de valor a la variable sin advertencias de TypeScript. Sin embargo, al trabajar con variables de tipo unknown, debes realizar una verificación de tipo o una conversión explícita antes de realizar operaciones específicas del tipo.

1. Utilizar una anotación de tipo explícita combinando string y number:

let myProductName: string | number = 'Product 1';
let myProductPrice: string | number = 123;

myProductName = 12321;  // Sin alerta de TypeScript

Como mencioné anteriormente, al utilizar una anotación de tipo union (string | number), le estás indicando a TypeScript que la variable puede ser tanto una cadena de texto como un número. Esto permite asignaciones de ambos tipos sin mostrar una advertencia.
.
En general, se recomienda utilizar las anotaciones de tipo más específicas posibles en lugar de any o unknown, ya que te permiten aprovechar los beneficios del sistema de tipos estático de TypeScript y detectar errores potenciales en tiempo de compilación. Sin embargo, en situaciones específicas donde necesites flexibilidad extrema o cuando no tengas información sobre el tipo de la variable, any o unknown pueden ser opciones válidas.

a example :3

let myProductName = 'producto'; // tipo inferido (ya es una variable de strings)

let myProductPrice = 12; // tipo inferido (ya es una variable de tipo number)

 myProductName = 2; // ERROR! NO SE PUEDE ASIGNAR UN NUMERO A UNA VARIABLE DE TIPO STRING

myProductName = 'cambio'; // BIEN :)

 myProductPrice = 'hola'; // ERROR! NO SE SE LE PUEDE ASIGNAR UN STRING A UNA VARIABLE DE TIPO NUMBER

myProductPrice = 22; // BIEN :)

Les comparto otras formas de crear funciones anónimas auto-ejecutables

Forma clásica:

(function(){
  console.log('Versión clásica');
})();

Con arrow function:

(()=>{
  console.log('Versión arrow function')
})();

Crockford --> Creador de JSON:

((function(){
  console.log('Versión Crockford');
})());

Forma Unaria:

+function(){
  console.log('Forma unaria');
}();

les recomiendo que instalen esta extension
https://marketplace.visualstudio.com/items?itemName=pmneo.tsimporter

Dejo mi aporte de la clase

https://github.com/CarlosArgelio/typescript-basic/commit/53350d3340cf6f5e854ee544697f06b66902283b

Jajajaja hasta hoy entendí como es que funciona una IIFE. Siempre había escrito el código por mero hábito, no me había puesto a analizarlo.

Excelente clase, este curso es muy didáctico y siento que se me está facilitando el aprendizaje.

TIPADO INFERIDO: Typescript deduce el tipado por default, es decir que si no colocamos el tipado tipescript lo hace por nosotros a través de su motor de inferencia.

que te avise que usaste esos valores en otro archivos es excelente.

Algo curioso que noté, o que percibo, es que la inferencia de tipo, cuando se declara un valor let, Typescript te advierte del cambio, no tanto de tipo, sino de valor, como si quisiese tratarlo como constante de cierta forma.

También es curioso que al declarar constantes, el editor no te sugiere el tipo asignado en el tooltip.

Immediate-Invoked Function Expression (()=>{})()

Y yo que no entendia porque seguia tirandome errores, hasta que conoci las funciones anonimas autoejecutadas