Wprowadzenie do JavaScript

1. Czym jest JavaScript?

JavaScript (JS) to język programowania, który pierwotnie został stworzony do nadawania interaktywności stronom internetowym. Dziś jest jednym z najpopularniejszych języków na świecie i można go znaleźć niemal wszędzie — od stron WWW, przez aplikacje mobilne, aż po serwery i urządzenia IoT.

Kluczowe cechy JavaScriptu:

  • Jest językiem skryptowym – uruchamiany bezpośrednio w przeglądarce lub w środowisku Node.js.
  • Jest językiem interpretowanym – nie wymaga wcześniejszej kompilacji do kodu maszynowego.
  • Jest językiem dynamicznie typowanym – typy danych są ustalane w czasie wykonywania programu.
  • Jest językiem wysokiego poziomu – skupia się na logice, a nie na zarządzaniu pamięcią.
  • Jest językiem obiektowym (z prototypowym dziedziczeniem).
  • Jest językiem wieloparadygmatowym – obsługuje styl proceduralny, obiektowy i funkcyjny.

2. Zastosowania JavaScriptu

Choć JS powstał dla przeglądarek, dziś ma znacznie szersze zastosowanie:

Obszar Przykłady zastosowań Technologie
Front-end (interfejs użytkownika) Animacje, walidacja formularzy, interaktywne elementy React, Vue, Angular
Back-end (serwer) Obsługa żądań, API, logika biznesowa Node.js, Express
Aplikacje mobilne Aplikacje natywne i hybrydowe React Native, Ionic
Aplikacje desktopowe Programy działające na komputerze Electron
Automatyzacja / DevOps Skrypty, narzędzia CLI npm, Gulp, Webpack

3. Jak działa JavaScript?

JavaScript działa w środowisku, które dostarcza tzw. silnik JavaScript. Najpopularniejsze silniki to:

  • V8 (Google Chrome, Node.js)
  • SpiderMonkey (Firefox)
  • JavaScriptCore (Safari)

Silnik JS wykonuje kod w następujących krokach:

  1. Parsuje kod (analizuje składnię),
  2. Tworzy drzewo AST (Abstract Syntax Tree),
  3. Kompiluje do kodu bajtowego,
  4. Interpretuje i wykonuje instrukcje.

W przeglądarce JavaScript współpracuje z DOM (Document Object Model) – czyli strukturą strony internetowej, dzięki czemu może:

  • zmieniać wygląd elementów,
  • reagować na zdarzenia (kliknięcia, ruch myszy),
  • komunikować się z serwerem (AJAX, Fetch API).

4. Składnia i podstawowe elementy języka

4.1. Zmienne

Służą do przechowywania danych.

4.2. Typy danych

Typ Przykład
String (tekst) "Hello"
Number (liczba) 42, 3.14
Boolean true, false
Null null
Undefined undefined
Object {name: "Jan", age: 30}
Array [1, 2, 3]

Przykład:

4.3. Operatory

  • Aritmetyczne: +, -, *, /, %
  • Porównania: ==, ===, !=, !==, <, >, <=, >=
  • Logiczne: &&, ||, !

Uwaga: == porównuje wartości, a === porównuje wartości i typy danych.

5. Funkcje

Funkcje pozwalają grupować kod, który można wielokrotnie wywoływać.

Nowoczesna składnia (ES6):

6. Instrukcje sterujące

Warunki

Pętle

7. Obiekty i tablice

Tablice

Obiekty

8. Praca z DOM i zdarzeniami (w przeglądarce)

JavaScript umożliwia manipulowanie stroną HTML.

9. Nowoczesny JavaScript (ES6+)

Nowe wersje języka (ES6 i nowsze) wprowadziły:

  • let i const – nowy sposób definiowania zmiennych,
  • arrow functions (() => {}),
  • template literals (`Witaj ${name}`),
  • destrukturyzację obiektów i tablic,
  • klasy (class),
  • moduły (import, export),
  • Promise / async / await – obsługa asynchroniczności.

Przykład asynchronicznego kodu:

10. Podsumowanie

JavaScript to fundament współczesnego web developmentu. Opanowanie podstaw JS otwiera drzwi do nauki frameworków (React, Vue, Angular), backendu (Node.js), czy nawet mobilnych aplikacji.

Co dalej warto poznać:

  • Manipulacja DOM w praktyce
  • Moduły i importy (import/export)
  • Programowanie asynchroniczne
  • Narzędzia deweloperskie (npm, Webpack, Babel)
  • Frameworki front-endowe
Wróć do spisu lekcji Rozwiąż quiz