7 typów JavaScript
Zrozum jakie typy danych istnieją w JS i jak je rozróżniać
Typy — różne półki w szafie
Wyobraź sobie szafę z podpisanymi półkami: jedna na liczby, jedna na tekst, jedna na przełączniki włącz/wyłącz. JavaScript też kategoryzuje informacje — typy. Znając typ, komputer wie co z nim zrobić: dodawać liczby, łączyć tekst, sprawdzać wartości logiczne.
7 typów JavaScript
JavaScript ma 7 typów — 6 prymitywnych i 1 złożony:
| Typ | Przykład | Kiedy używać |
|---|---|---|
string | "Cześć", 'JS' | Tekst, imiona, wiadomości |
number | 42, 3.14, -7 | Liczby, ceny, współrzędne |
boolean | true, false | Tak/Nie, włącz/wyłącz, warunki |
undefined | undefined | Zmienna zadeklarowana bez wartości |
null | null | Celowo pusta wartość |
symbol | Symbol('id') | Unikalne klucze (poziom zaawansowany) |
bigint | 9007199254740993n | Bardzo duże liczby |
object | {}, [], null | Złożone struktury (następna lekcja!) |
Pierwsze 6 to typy prymitywne (proste wartości). object to typ złożony.
Operator typeof
typeof zwraca nazwę typu jako ciąg znaków:
typeof "Cześć" // "string"
typeof 42 // "number"
typeof 3.14 // "number" — liczby dziesiętne to też number!
typeof true // "boolean"
typeof undefined // "undefined"
typeof null // "object" ← PUŁAPKA! (wyjaśnione w następnej lekcji)
typeof {} // "object"
typeof [] // "object" ← tablice to też object!
typeof function(){} // "function"Ważne: typeof zwraca ciąg znaków w cudzysłowie — czyli "number", "string", nie samo number.
Łańcuchy znaków (string) — szczegółowo
let imie = "Maria"; // podwójne cudzysłowy
let miasto = 'Warszawa'; // pojedyncze (to samo)
let powitanie = `Cześć, ${imie}!`; // template literal — wstawia zmienną
console.log(powitanie); // Cześć, Maria!
// Długość stringa
console.log(imie.length); // 5
// Konkatenacja (łączenie)
let pelneImie = "Jan" + " " + "Kowalski"; // "Jan Kowalski"Template literals (backtick `) — najwygodniejszy sposób wstawiania zmiennej do tekstu.
Liczby — NaN i Infinity
console.log(10 / 0); // Infinity (nie błąd!)
console.log(-10 / 0); // -Infinity
console.log("cześć" * 2); // NaN — Not a Number
// NaN — jest typem number, ale 'nie liczbą' jako wartość
console.log(typeof NaN); // "number" ← tak, NaN to number!
// Konwersja stringa na liczbę
console.log(parseInt("42px")); // 42 — bierze liczbę z początku
console.log(parseFloat("3.14")); // 3.14
console.log(Number("42")); // 42
console.log(Number("cześć")); // NaNSprawdzanie NaN: isNaN(value) lub Number.isNaN(value). Nie możesz porównać value === NaN — zawsze false!
Boolean — wartości truthy i falsy
W JavaScript każda wartość jest automatycznie albo 'truthy' albo 'falsy' w kontekście warunku:
Falsy — dokładnie 8 wartości:
false
0
-0
0n // BigInt zero
"" // pusty string
null
undefined
NaNTruthy — WSZYSTKO inne, w tym:
true
1
-1
"0" // string '0' — truthy!
"false" // string 'false' — truthy!
[] // pusta tablica — truthy!
{} // pusty obiekt — truthy!To ma znaczenie w warunkach if: if (value) — sprawdza czy wartość jest truthy.
Pułapka z pustą tablicą — bardzo częsty błąd. [] jest truthy ale 'puste'. Sprawdzaj .length!
null vs undefined
Obie oznaczają 'tu nic nie ma', ale z różnym zamiarem:
let a; // undefined — wartość nie ustawiona
console.log(a); // undefined
let b = null; // null — celowo PUSTE
console.log(b); // null
console.log(typeof a); // "undefined"
console.log(typeof b); // "object" ← niespodzianka!Zasada:
undefined— zmienna istnieje ale nie przypisano wartości (JS ustawia ją)null— jawnie mówisz 'tu nic nie ma'
Na przykład: let user = null; — użytkownik jeszcze nie załadował.
Pamiętaj: typeof zwraca STRING. Więc sprawdzaj: typeof x === "number" (z cudzysłowem). I typeof null === "object" — to błąd JS z 1995 roku, nigdy nie naprawiony, żeby nie psuć starego kodu.