03.05 Return hodnoty

Výuka

Proč return hodnoty?

Dosud jsme viděli dva typy funkcí:

1. Funkce s vedlejším efektem - např. console.log() něco vypíše, ale nic nevrací
2. Funkce vracející hodnotu - např. square(5) vrátí 25

Return hodnoty umožňují:

• Oddělit výpočet od použití - funkce spočítá, volající rozhodne co s výsledkem
• Skládat funkce - výsledek jedné funkce můžeš předat další
• Znovupoužitelnost - stejnou funkci použiješ v různých kontextech

Představ si to jako: Rozdíl mezi kalkulačkou, která výsledek vypíše (vedlejší efekt) vs kalkulačka, která vrátí číslo, se kterým můžeš dál pracovat (return hodnota).

Jak to funguje?

1. Funkce provede výpočet
2. `return` vrátí hodnotu volajícímu
3. `return` OKAMŽITĚ ukončí funkci (kód za ním se neprovede)
4. Pokud funkce nemá `return`, vrací `undefined`

Dvě kategorie funkcí:

• Pure funkce (čisté) - vrací hodnotu, žádné vedlejší efekty, se stejným vstupem vždy stejný výstup
• Impure funkce (nečisté) - mění stav, zapisují do databáze, vypisují, zasahují "ven"

Klíčové koncepty

• Return ukončuje funkci - kód za return se neprovede
• Funkce může vracet cokoli - číslo, text, objekt, pole, dokonce i jinou funkci
• Bez return = undefined - funkce bez return automaticky vrací undefined
• Pure vs Impure - pure funkce jsou předvídatelné a snadněji testovatelné

JavaScript

Příklad 1: Funkce s return vs bez return

// ✅ Funkce s return - vrací hodnotu
const square = function(x) {
  return x * x;
};

const result = square(5);
console.log(result * 2);  // Můžeš použít výsledek
// → 50

// ⚠️ Funkce bez return - jen vedlejší efekt
const printSquare = function(x) {
  console.log(x * x);
};

const result2 = printSquare(5);  // Vypíše 25
console.log(result2);            // undefined - funkce nic nevrátila
// → undefined

Co se stalo?

• square vrací hodnotu - můžeš s ní dál pracovat
• printSquare jen vypisuje - nevrací nic (tedy undefined)

Příklad 2: Return okamžitě ukončí funkci

const checkAge = function(age) {
  if (age < 18) {
    return "Příliš mladý";
    console.log("Tohle se NIKDY neprovede!");  // Dead code
  }
  return "Dospělý";
};

console.log(checkAge(15));
// → Příliš mladý

Co se stalo?

• Po return se funkce okamžitě ukončí
• Kód za return se neprovede (tzv. "dead code")
• To je užitečné pro předčasné ukončení funkce

Příklad 3: Return bez hodnoty = undefined

const greet = function(name) {
  console.log("Hello " + name);
  return;  // Prázdný return
};

console.log(greet("Alice"));
// → Hello Alice
// → undefined

const greet2 = function(name) {
  console.log("Hello " + name);
  // Žádný return
};

console.log(greet2("Bob"));
// → Hello Bob
// → undefined

Co se stalo?

• return bez hodnoty vrací undefined
• Funkce bez return také vrací undefined
• Obojí je stejné!

Příklad 4: Pure vs Impure funkce

Pure funkce - žádné vedlejší efekty:

// ✅ Pure - vždy stejný vstup = stejný výstup
const add = function(a, b) {
  return a + b;
};

console.log(add(2, 3));  // → 5
console.log(add(2, 3));  // → 5 (vždy stejné)

Impure funkce - vedlejší efekty:

let counter = 0;

// ⚠️ Impure - mění globální stav
const increment = function() {
  counter = counter + 1;  // Mění proměnnou venku
  return counter;
};

console.log(increment());  // → 1
console.log(increment());  // → 2 (pokaždé jiný výsledek!)

Co se stalo?

• Pure funkce je předvídatelná - se stejným vstupem vždy stejný výstup
• Impure funkce má vedlejší efekt - mění stav mimo funkci
• Pure funkce se snadněji testují a debugují!

Příklad 5: Funkce může vrátit cokoli

// Vrací číslo
const getAge = () => 25;

// Vrací text
const getName = () => "Alice";

// Vrací objekt
const getPerson = () => ({ name: "Alice", age: 25 });

// Vrací pole
const getNumbers = () => [1, 2, 3, 4, 5];

// Vrací funkci!
const multiplier = function(factor) {
  return number => number * factor;
};

const double = multiplier(2);
console.log(double(5));
// → 10

Poznámka: Funkce vracející funkci se nazývají "higher-order functions" - o tom více v lekci 16!

Příklad 6: Skládání funkcí

const double = x => x * 2;
const square = x => x * x;
const subtract = (a, b) => a - b;

// Výsledek jedné funkce předáme další
const result = double(square(subtract(10, 5)));
//                              ↓
//                         10 - 5 = 5
//                        ↓
//                    5 * 5 = 25
//                ↓
//            25 * 2 = 50

console.log(result);
// → 50

Co se stalo?

• Funkce vracejí hodnoty, které můžeš předat dalším funkcím
• To je síla return hodnot - můžeš skládat funkce dohromady!

TypeScript

TypeScript umožňuje specifikovat návratový typ funkce - typ hodnoty, kterou funkce vrátí:

// Explicitní návratový typ: number
const square = function(x: number): number {
  return x * x;
};

// Návratový typ: string
const greet = function(name: string): string {
  return "Hello " + name;
};

// Návratový typ: void (nevrací nic)
const log = function(message: string): void {
  console.log(message);
  // Žádný return, nebo prázdný return
};

// TypeScript kontroluje, že vracíš správný typ
const add = function(a: number, b: number): number {
  return a + b;        // ✅ OK - vrací number
  // return "hello";   // ❌ Error: Type 'string' is not assignable to type 'number'
};

Funkce vracející funkci:

const multiplier = function(factor: number): (n: number) => number {
  return (number: number) => number * factor;
};

const double: (n: number) => number = multiplier(2);
console.log(double(5));  // → 10

TypeScript přidává:

• ✅ Kontrolu návratového typu - musíš vrátit správný typ
• ✅ Lepší dokumentaci - hned vidíš, co funkce vrací
• ✅ Bezpečnost - nemůžeš omylem vrátit špatný typ

Rozdíl JS vs TS

JavaScript:

const divide = function(a, b) {
  if (b === 0) {
    return "Nelze dělit nulou";  // Vrací string
  }
  return a / b;  // Vrací number
};

// Někdy vrací string, někdy number - matoucí!
console.log(divide(10, 2));  // 5 (number)
console.log(divide(10, 0));  // "Nelze dělit nulou" (string)

TypeScript:

const divide = function(a: number, b: number): number {
  if (b === 0) {
    return "Nelze dělit nulou";  // ❌ Error: Type 'string' is not assignable to type 'number'
  }
  return a / b;
};

// Správné řešení - vrátit speciální hodnotu nebo vyhodit chybu
const divide = function(a: number, b: number): number {
  if (b === 0) {
    throw new Error("Nelze dělit nulou");
  }
  return a / b;
};

Tip

💡 Preferuj pure funkce:

// ❌ Impure - mění globální stav
let total = 0;
const addToTotal = (value) => {
  total += value;
  return total;
};

// ✅ Pure - vrací novou hodnotu
const addToValue = (current, value) => current + value;

💡 Funkce by měla buď vracet hodnotu, nebo mít vedlejší efekt, ne obojí:

// ⚠️ Matoucí - vrací hodnotu A má vedlejší efekt
const calculateAndLog = (x) => {
  const result = x * 2;
  console.log(result);  // Vedlejší efekt
  return result;        // Vrací hodnotu
};

// ✅ Lepší - rozdělené na dvě funkce
const calculate = (x) => x * 2;
const logResult = (result) => console.log(result);

const result = calculate(5);
logResult(result);

💡 Return brzy (early return) pro čitelnější kód:

// ❌ Vnořené if-y
const checkValue = function(value) {
  if (value !== null) {
    if (value > 0) {
      if (value < 100) {
        return "OK";
      }
    }
  }
  return "Invalid";
};

// ✅ Early return
const checkValue = function(value) {
  if (value === null) return "Invalid";
  if (value <= 0) return "Invalid";
  if (value >= 100) return "Invalid";
  return "OK";
};