Retorno de funciones

Resumen de la clase

En TS podemos especificar que tipo de dato retorna la función e incluso podemos indicar cuando esa funcion no retorna nada.

// Retornando un string
function joinName(fName: string, lName: string): string {
 return `${fName} ${lName}`
}

// Funcion sin retorno
function printName(name: string): void {
  console.log(name)
}

El curso de manipulacion de arrays es buenisimo, lo uso de referencia seguido

Lo mismo pero con el método reduce:

  const calcTotal = (prices: number[]): number => {
    return prices.reduce((total, price) => total + price, 0);
  };
  console.log(calcTotal([10, 20, 30])); // 60

Les comparto mis apuntes. 😄

Void

Normalmente, lo usamos para funciones de efecto secundario, funciones que llaman a otras funciones.

Lo utilizamos para funciones que no tengan un retorno, que no retornen ningún tipo de valor.

Sintaxis tipo explícito

Funciones declarativas

function functionName (parameters: dataTypes): dataTypes { statements }

Arrow functions

const functionName = (parameters: dataTypes): dataTypes => { statements }

Código de la clase

(() => {
    const calcTotal = (prices: number[]): string => {
        let total = 0;
        prices.forEach(item => total += item);
        return total.toString();
    }

    // const rta = calcTotal([1, 2, 1, 1, 1]);
    // console.log(rta);

    const printTotal = (prices: number[]): void => {
        const rta = calcTotal(prices);
        console.log(`El total es ${rta}`);
    }

    const rta = printTotal([1, 2, 1, 1, 1]);
})();

Esta super interesante esto del tipo de dato que queremos retornar en una funcion, entonces podemos decirle a una función que retorne algún Literal Types de esta manera:

  type SizeTshirt = "M" | "L" | "XG" | "S";
  type User = { name: string; user: string; size: SizeTshirt };

  const greeting = (user: string, name: string, size: SizeTshirt): User => {
    return {
      user,
      name,
      size,
    };
  };

Aqui esta la url del github en la rama de esta clase:
https://github.com/platzi/curso-typescript-fundamentos/tree/16-step

Esta interesante el curso 😄

  const calcTotal =(prices: number[])=> {
    let total = 0;
    total = prices.reduce((e,i)=>e+i);
    console.log(`El total es: ${total}`); 
    return total;
  };

  const Nguardado = calcTotal([12,34,31,4,134])
  console.log(Nguardado+1);

Otras soluciones alternativas

Ejercicio de la clase:

(() => {
  const calcTotal = (prices: number[]): string => {
    let total = 0;
    prices.forEach((item) => {
      total += item;
    });
    return total.toString();
  }

  const printTotal = (prices: number[]): void => {
    const rta = calcTotal(prices);
    console.log(`El total es ${rta}`);
  }

  printTotal([1, 2, 3, 5, 6]);
})();

💡 Un dato interesante es que en JavaScript las funciones que no retornan un valor, implícitamente retortan undefined.
Sin embargo, void y undefined no son lo mismo en TypeScript como hemos podido ver en las clases de este curso.

Para quien pensó en como hacer un clousure con Typescript esto te puede servir. Este aporte fue posible gracias al curso profesional de Javascript.

function newClousure (a: number): (b: number) => number {

  return function(b) {
    return a + b;
  }
}

Con arrow functions

const newClousure = (a: number): (b: number, c: string) => number => {
  return (b, c) => {
    return 5;
  }
}

aquí las tengo :v

❤️|

Como le menciono Nico podemos usar el reduce para hacerlo de una manera mas elegante les dejo el código que desarrolle usando el reduce adicionalmente al usar arrow functions si nuestra función solo realiza una acción podemos escribir una sola linea de código evitando poner las llaves {} después de definir la función

(() => {
  const calTotal = (prices:  number[]): string =>
   prices.reduce((sum, price) => sum + price)
   .toString();

   const printTotal = (prices: number[]): void =>
   console.log(calTotal(prices));

   printTotal([1,2,3]);

})();

✅