JavaScript ES5 – od zera do mistrza! Wszystkie detale!

JavaScript to jedno z najważniejszych języków programowania na świecie. Bez niego nowoczesne aplikacje webowe nie byłyby tak dynamiczne i interaktywne. Jeśli chcesz nauczyć się JavaScript od podstaw, zaczynając od wersji ES5, to jesteś we właściwym miejscu. W tym artykule przeprowadzimy Cię przez koncepcje, składnię oraz przykłady kodu, które pozwolą Ci zrozumieć ten język.

1. Czym jest JavaScript ES5?

ES5 (ECMAScript 5) to wersja standardu JavaScript, która została wydana w 2009 roku. Choć obecnie mamy nowsze wersje, ES5 wciąż jest szeroko wspierany w przeglądarkach i stanowi podstawę dla wielu aplikacji.

2. Podstawy JavaScript ES5

Zanim przejdziemy do bardziej zaawansowanych zagadnień, zacznijmy od podstawowej składni JavaScript.

2.1 Zmienne w ES5

W ES5 do definiowania zmiennych używamy słowa kluczowego var:

var imie = "Jan";
var wiek = 25;
console.log(imie, wiek);

Zmienna zadeklarowana za pomocą var ma zakres funkcyjny, co oznacza, że jej wartość może być zmieniana w obrębie funkcji.

2.2 Funkcje w JavaScript ES5

Funkcje są podstawą programowania w JavaScript. W ES5 używamy składni:

function powitanie(imie) {
    return "Cześć, " + imie + "!";
}
console.log(powitanie("Jan"));

2.3 Obiekty i tablice

JavaScript jest językiem obiektowym. Możemy tworzyć obiekty i tablice w prosty sposób:

// Obiekt
var osoba = {
    imie: "Jan",
    wiek: 30
};

// Tablica
var liczby = [1, 2, 3, 4, 5];

console.log(osoba.imie, osoba.wiek);
console.log(liczby[0]); // Pierwszy element tablicy

3. JavaScript de cero hasta los detalles ES5 przykłady

Aby lepiej zrozumieć JavaScript ES5, przyjrzyjmy się kilku bardziej zaawansowanym przykładom.

3.1 Metody tablicowe w ES5

ES5 wprowadziło kilka przydatnych metod do pracy z tablicami, takich jak forEach, map i filter.

var liczby = [1, 2, 3, 4, 5];

// forEach - iteracja po tablicy
liczby.forEach(function(liczba) {
    console.log("Liczba:", liczba);
});

// map - nowa tablica z przekształconymi wartościami
var podwojone = liczby.map(function(liczba) {
    return liczba * 2;
});
console.log(podwojone);

// filter - filtrowanie tablicy
var parzyste = liczby.filter(function(liczba) {
    return liczba % 2 === 0;
});
console.log(parzyste);

3.2 Obiekty i konstruktory

W ES5 możemy tworzyć obiekty za pomocą funkcji konstruktora:

function Osoba(imie, wiek) {
    this.imie = imie;
    this.wiek = wiek;
}

var jan = new Osoba("Jan", 30);
console.log(jan.imie, jan.wiek);

4. Tryb ścisły (Strict Mode) w ES5

Tryb ścisły w ES5 pomaga unikać błędów, wymuszając bardziej rygorystyczną składnię. Można go włączyć na początku pliku lub w funkcji:

"use strict";

var liczba = 10;
console.log(liczba);

5. JSON – wymiana danych

JavaScript ES5 obsługuje JSON (JavaScript Object Notation), czyli format wymiany danych:

var osoba = {
    imie: "Anna",
    wiek: 25
};

var jsonOsoba = JSON.stringify(osoba); // Konwersja do JSON
console.log(jsonOsoba);

var obiektOsoba = JSON.parse(jsonOsoba); // Konwersja z JSON do obiektu
console.log(obiektOsoba.imie, obiektOsoba.wiek);

6. Podsumowanie

JavaScript ES5 to podstawa dla każdego programisty front-endu. Znajomość jego składni i funkcji pozwala lepiej zrozumieć nowoczesne wersje JavaScript i budować interaktywne aplikacje. Mam nadzieję, że ten przewodnik pomoże Ci lepiej opanować JavaScript de cero hasta los detalles ES5!

Masz pytania? Daj znać w komentarzach!