Úloha 1 – Zjištění délky a úprava textu v JavaScriptu

Úvod do úlohy

Řetězce (strings) jsou jedním z nejčastěji používaných typů dat v JavaScriptu. Potřebujeme je k práci s textem – ať už jde o zobrazování jména uživatele, validaci e-mailu nebo skládání výsledné zprávy. Abychom text dokázali efektivně zpracovávat, JavaScript nám nabízí celou řadu vlastností a metod, které můžeme na řetězcích využít. Porozumění těmto nástrojům je zásadní, protože právě práce s textem se objevuje téměř v každé praktické aplikaci.

Teorie a principy

1. Tečková notace

   • Pokud máme uložený řetězec v proměnné, přistupujeme k jeho vlastnostem a metodám pomocí tečky.

   • Například:

2. Vlastnosti vs. metody

   • Vlastnosti jsou hodnoty přidružené k objektu. U řetězců nejznámější je .length, která udává počet znaků. Vlastnosti zapisujeme bez závorek.

   • Metody jsou funkce, které na řetězci něco provedou (např. změní velikost písmen, vyříznou část textu, nahradí znak). Metody vždy voláme se závorkami (), i když nemají žádný parametr.

3. Neměnnost řetězců

   • Důležité je pochopit, že metody nemění původní řetězec, ale vždy vrací nový řetězec.

   • Pokud chceme výsledek použít, musíme si ho uložit do proměnné.

Praktické příklady kódu

Typické chyby / záludnosti

• Zapomenuté závorky u metod
  

• Snaha změnit řetězec přímo
  

• Záměna vlastností a metod

  • length je vlastnost, píše se bez závorek.

  • toUpperCase() je metoda, vždy se závorkami.

Shrnutí

• K vlastnostem a metodám přistupujeme pomocí tečkové notace.

• Vlastnosti (např. length) píšeme bez závorek.

• Metody (např. toUpperCase()) píšeme vždy se závorkami.

• Řetězce jsou neměnné – metody vždy vrací nový řetězec, původní zůstává stejný.

• Výsledky metod je potřeba si uložit, jinak se ztratí.

Úloha

Zadání (kontext úlohy):

Představ si, že připravuješ krátký text pro uvítací stránku. Potřebuješ zjistit, kolik znaků obsahuje a zároveň ho zobrazit i ve velkých písmenech.

Cíl úlohy:

Procvičit si použití vlastnosti (.length) a metody (.toUpperCase()) na řetězci.

Vstupní podmínky:

• Student pracuje pouze s nově vytvořeným souborem script.js.

• V souboru si vytvoří vlastní proměnnou s libovolným textem (např. věta, slovo, jméno).

Požadovaný výstup:

1. Do konzole se vypíše počet znaků textu.

2. Do konzole se vypíše text převedený na velká písmena.

3. Do konzole se vypíše původní text, aby bylo vidět, že zůstal nezměněný.

Doplňující pokyny:

• Nezapomeň, že .length se píše bez závorek.

• U metod, jako je .toUpperCase(), musíš vždy použít závorky.

Řešení úlohy

Co je zde splněno:

• použití vlastnosti .length pro zjištění počtu znaků,

• použití metody .toUpperCase() pro převod na velká písmena,

• zachování původního textu a jeho vypsání,

• výstup do konzole ve třech variantách podle zadání.

Vylepšení oproti začátečnické verzi:

• využití šablonových řetězců (backticky `) zjednodušuje spojování textu s proměnnými,

• kód je přehlednější a méně náchylný k chybám.

Poznámky:

• Častá chyba je psát text.length() se závorkami – to je špatně, protože length je vlastnost, ne metoda.

• Naopak u toUpperCase jsou závorky nutné: text.toUpperCase().