Przejdź do treści
{ }Pracownia Web
JS

JavaScript

36 tematów · od podstaw do egzaminu INF.03 i dalej

Moduł 1

Start

Narzędzia, konsola i pierwszy skrypt.

  1. 01Czym jest JavaScript i gdzie żyjeKlient vs serwer, konsola DevTools, VS Code, dołączanie skryptu (inline, src, defer), komentarze, console.log, czytanie błędów, stanowisko egzaminacyjneINF.03
Moduł 2

Fundamenty języka

Zmienne, typy, operatory, warunki, pętle, funkcje, tablice i obiekty – wszystko, o co pyta część pisemna INF.03.

  1. 02Zmienne i typy danychlet, const i var (dialekt egzaminacyjny), nazwy zmiennych, typy string, number, boolean, undefined, null, operator typeofINF.03
  2. 03Liczby, operatory i konwersja typówArytmetyka, % i **, operatory skrócone, ++/--, Number/parseInt/parseFloat, Math.round/ceil/floor/random, toFixed, NaN, pułapka "5" + 3INF.03
  3. 04Napisy (String)Cudzysłowy i template stringi, length i indeksy, toUpperCase/toLowerCase, slice, indexOf/lastIndexOf, includes, split, replace, trim – i format tekstu wyniku jak w arkuszuINF.03
  4. 05Porównania i instrukcje warunkowe==/===, if/else if/else, operator ?:, &&, || i nawiasy, switch i ścisłe porównanie w caseINF.03
  5. 06Pętlefor, while, do…while, for…of; licznik, warunek i krok; break/continue; równoważność for ⇄ while; sumowanie i algorytmy krokoweINF.03
  6. 07FunkcjeDeklaracja, parametry i argumenty, return i przypisanie wyniku, zasięg zmiennych, funkcja strzałkowa, znaczące nazwyINF.03
  7. 08TabliceLiterał [] i new Array(), indeksy i length, push/pop/shift/unshift, indexOf/includes, join/split, slice/splice, sort z komparatorem, losowy elementINF.03
  8. 09ObiektyLiterał {}, kropka i nawiasy kwadratowe, metody i this, get/set, obiekt jako cennik, tablica obiektów, referencjeINF.03
  9. 10Okna dialogowe, konsola, document.write i debuggeralert, prompt (zwraca napis!), confirm, console.log/table/error, document.write, czytanie błędów, breakpointy w Chrome DevToolsINF.03
Moduł 3

DOM, zdarzenia i formularze

Rdzeń części praktycznej INF.03 – od odczytu kontrolek po galerie, zakładki i trening na arkuszach.

  1. 11Model DOM: znajdowanie elementów i zmiana treściDrzewo DOM, getElementById, querySelector(All), getElementsByClassName/TagName i pętla po kolekcji, innerHTML vs textContent vs innerTextINF.03
  2. 12Zdarzenia myszy i klawiaturyonclick="f()" i addEventListener, obiekt zdarzenia (target, key), click/dblclick/mouseover/mouseout, keydown/keyup, focus/blur, change/input, load, submit i preventDefaultINF.03
  3. 13Odczyt kontrolek formularzavalue, checked, radio, select, textarea, range, type=file i C:\fakepath – jak odczytać każdą kontrolkę i nie pomylić napisu z liczbąINF.03
  4. 14Wzorzec egzaminacyjny „kalkulator”: kontrolki → obliczenie → akapitPełny przepływ zadania INF.03 krok po kroku – od czytania kryteriów, przez pusty akapit i parseFloat, po dokładny format napisu i test na dwóch zestawach danychINF.03
  5. 15Zmiana stylów, klas i atrybutówelement.style i camelCase, pokaż/ukryj przez display, zakładki jedną funkcją, classList, setAttribute, podmiana img.src, filtry CSS z suwakówINF.03
  6. 16Tworzenie i usuwanie elementówcreateElement, appendChild/append, setAttribute, pętla generująca elementy, nowy element ze zdarzeniem, remove/removeChild/replaceChild, scrollIntoView, chat i lista zadańINF.03
  7. 17Stan aplikacji: zmienne globalne, indeksy, zawijanieZmienna poza funkcją jako pamięć strony, licznik z limitem, galeria z zawijaniem indeksu, rotacja cytatów, jedna funkcja dla wielu przycisków, odczyt stanu z DOMINF.03
  8. 18Walidacja formularzy: HTML5 i JavaScriptAtrybuty required/min/max/pattern/type, checkValidity i setCustomValidity, pseudoklasy :invalid i :user-invalid, walidacja w JS z komunikatem w akapicie, submit + preventDefault, dostępnośćINF.03
  9. 19Trening egzaminacyjny: część praktycznaPrzebieg 150-minutowego egzaminu, budżet czasu, czytanie kryteriów „Zasad oceniania”, lista kontrolna skryptu i trzy pełne zadania w stylu arkuszy 2024–2026 z rozwiązaniamiINF.03
  10. 20Trening egzaminacyjny: część pisemnaCzytanie kodu w dialekcie ES5, strategia eliminacji dystraktorów, katalog najczęstszych błędnych przekonań z mini-przykładami i bank ponad 40 pytań w formacie CKEINF.03
Moduł 4

Nowoczesny JavaScript

Poza egzaminem INF.03. ES6+, metody tablic, domknięcia, referencje, klasy, JSON i localStorage.

  1. 21Składnia ES6+ na co dzieńTemplate stringi, destrukturyzacja, spread/rest, parametry domyślne, ?. i ??, for…of, skrócone metody
  2. 22Metody tablic wyższego rzęduforEach, map, filter, find, some/every, reduce, sort z komparatorem, łańcuchowanie, funkcja jako wartość
  3. 23Zasięg, hoisting, domknięcia i thisZasięg blokowy i funkcyjny, hoisting, TDZ, var w pętli, closure (licznik, debounce), this w metodzie, callbacku i strzałce
  4. 24Referencje, kopiowanie i mutowalnośćPrymitywy vs obiekty, przypisanie = referencja, const a mutacja, kopia płytka i głęboka, structuredClone, Object.freeze, porównywanie
  5. 25Błędy, JSON i localStoragetry…catch…finally, throw, obiekt Error i własne błędy, JSON.stringify/parse, localStorage i sessionStorage – „backend bez backendu”
  6. 26Klasy i programowanie obiektoweclass, konstruktor, get/set, pola prywatne
  7. 27Zdarzenia zaawansowane i delegacjaBubbling i capturing, target vs currentTarget, delegacja, preventDefault, input/change/submit, klawiatura, DOMContentLoaded
  8. 28Czas, daty i animacjasetTimeout, setInterval, clearInterval, obiekt Date i formatowanie, requestAnimationFrame – zegar, odliczanie, slider
Moduł 5

Asynchroniczność i serwer

Poza egzaminem INF.03. Event loop, Promise, async/await, fetch i REST – pomost do INF.04.

  1. 29Event loop, callbacki i PromiseStos, kolejka zadań i mikrozadań, callback hell, Promise, then/catch/finally, łańcuchowanie, Promise.all/allSettled/race/any
  2. 30async/await i fetchasync/await, try/catch z await, równolegle vs po kolei, fetch, response.ok, json(), stany ładowania i błędu, AbortController, CORS, aplikacja pogodowa
  3. 31REST, CRUD i wysyłanie formularzyMetody HTTP, kody statusu, JSON w żądaniu, FormData, formularz bez przeładowania, json-server i fetch do PHP
Moduł 6

Narzędzia i biblioteki

Moduły, testy, jQuery, React, TypeScript i Node.js.

  1. 32Moduły ES, npm, Vite i jakość koduimport/export, type="module", Node i npm, projekt w Vite, ESLint, Prettier i Git w projekcie
  2. 33Testy jednostkoweVitest, describe/test/expect, matchery, przypadki brzegowe, mini-cykl TDD, wyciąganie czystych funkcji z kodu DOM
  3. 34jQuery – czytanie i porównanie z czystym JSCzym jest jQuery i dlaczego było wszędzie; $(), .on, .text/.val, .css, .addClass, .hide/.fadeIn, .append, .each, $.ajax – obok odpowiedników w vanilla JS
  4. 35React – komponenty i stanJSX, komponenty funkcyjne, props, useState, listy z key, formularze kontrolowane, podnoszenie stanu, useEffect i fetch, start z Vite
  5. 36Co dalej: TypeScript i Node.jsTypy, unie, interfejsy, funkcje i generyki w TypeScript, tsc i tryb strict; Node.js – skrypty, process.argv, fs/promises, npm scripts, moduły ES, mini serwer HTTP i json-server