jakubszpil

Wprowadzenie do JavaScript

>>Spis treści

  1. Czym jest JavaScript?
  2. Zmienne
  3. Typy danych
  4. Operatory
  5. Struktury kontrolne
  6. Funkcje
  7. Obiekty
  8. Tablice
  9. Zadania do wykonania

>>Czym jest JavaScript?

JavaScript to język programowania, który umożliwia tworzenie dynamicznych i interaktywnych stron internetowych. Jest wykorzystywany zarówno po stronie klienta (w przeglądarce), jak i na serwerze (np. z użyciem Node.js). JavaScript pozwala na reagowanie na akcje użytkownika, manipulowanie elementami HTML, obsługę zdarzeń, walidację formularzy i wiele innych operacji.


>>Zmienne

Zmienne służą do przechowywania danych w programie. W JavaScript zmienne można deklarować za pomocą var, let lub const:

var x = 5; // Zmienna var
let y = 10; // Zmienna let
const z = 15; // Stała const

>>Typy danych

JavaScript obsługuje różne typy danych:

let liczba = 42; // Number
let tekst = "Hello, World!"; // String
let prawda = true; // Boolean
let obiekt = { imie: "Jan", wiek: 30 }; // Object
let tablica = [1, 2, 3, 4, 5]; // Array

>>Operatory

Operatory służą do wykonywania działań na danych.

// Arytmetyczne
let suma = 10 + 5;
let roznica = 10 - 5;
let iloczyn = 10 * 5;
let iloraz = 10 / 5;

// Porównania
let rowne = 10 == 10; // Porównanie wartości
let identyczne = 10 === 10; // Porównanie wartości i typu
let nierowne = 10 != 5; // Nierówność

// Logiczne
let iOperator = true && false; // AND
let lubOperator = true || false; // OR
let nieOperator = !true; // NOT

// Przypisania
let a = 10;
a += 5; // Dodanie i przypisanie
a -= 5; // Odejmowanie i przypisanie

>>Struktury kontrolne

>>>Instrukcja if

Pozwala wykonywać kod warunkowo.

let wiek = 18;

if (wiek >= 18) {
  console.log("Jesteś pełnoletni");
} else {
  console.log("Jesteś niepełnoletni");
}

>>>Pętla for

Wielokrotne wykonywanie fragmentu kodu.

for (let i = 0; i < 5; i++) {
  console.log(i);
}

>>>Pętla while

Wykonuje kod dopóki warunek jest prawdziwy.

let i = 0;

while (i < 5) {
  console.log(i);
  i++;
}

>>Funkcje

Funkcje umożliwiają grupowanie kodu do wielokrotnego użycia.

>>>Deklaracja funkcji

function dodaj(a, b) {
  return a + b;
}

let wynik = dodaj(5, 10);
console.log(wynik); // 15

>>>Funkcje strzałkowe

Skrócony zapis funkcji.

const dodaj = (a, b) => a + b;
let wynik = dodaj(5, 10);
console.log(wynik); // 15

>>Obiekty

Obiekty służą do grupowania powiązanych danych i funkcji.

let osoba = {
  imie: "Jan",
  wiek: 30,
  przedstawSie: function () {
    return `Cześć, mam na imię ${this.imie} i mam ${this.wiek} lat.`;
  },
};

console.log(osoba.przedstawSie()); // Cześć, mam na imię Jan i mam 30 lat.

>>Tablice

Tablice przechowują listę wartości.

let liczby = [1, 2, 3, 4, 5];
console.log(liczby[0]); // 1

liczby.push(6); // Dodanie elementu na końcu
console.log(liczby); // [1, 2, 3, 4, 5, 6]

liczby.pop(); // Usunięcie ostatniego elementu
console.log(liczby); // [1, 2, 3, 4, 5]

>>Zadania do wykonania

>>>Zadanie 1

Napisz funkcję, która przyjmuje dwie liczby jako argumenty i zwraca ich iloczyn.

Pokaż rozwiązanie
function iloczyn(a, b) {
  return a * b;
}

let wynik = iloczyn(5, 10);
console.log(wynik); // 50

>>>Zadanie 2

Utwórz obiekt reprezentujący książkę z atrybutami tytul, autor i rok. Dodaj metodę, która zwraca opis książki.

Pokaż rozwiązanie
let ksiazka = {
  tytul: "W pustyni i w puszczy",
  autor: "Henryk Sienkiewicz",
  rok: 1911,
  opis: function () {
    return `${this.tytul} to książka napisana przez ${this.autor} w roku ${this.rok}.`;
  },
};

console.log(ksiazka.opis()); // W pustyni i w puszczy to książka napisana przez Henryk Sienkiewicz w roku 1911.

>>>Zadanie 3

Napisz funkcję, która przyjmuje tablicę liczb i zwraca największą liczbę z tej tablicy.

Pokaż rozwiązanie
function znajdzNajwieksza(tablica) {
  let najwieksza = tablica[0];
  for (let i = 1; i < tablica.length; i++) {
    if (tablica[i] > najwieksza) {
      najwieksza = tablica[i];
    }
  }
  return najwieksza;
}

let liczby = [1, 2, 3, 4, 5];
console.log(znajdzNajwieksza(liczby)); // 5

>>>Zadanie 4

Utwórz tablicę z kilkoma imionami. Następnie za pomocą pętli for wyświetl każde imię w konsoli.

Pokaż rozwiązanie
let imiona = ["Jan", "Anna", "Krzysztof", "Maria"];

for (let i = 0; i < imiona.length; i++) {
  console.log(imiona[i]);
}
// Jan
// Anna
// Krzysztof
// Maria

To wszystko na temat podstaw JavaScript! Zachęcam do dalszego eksperymentowania, tworzenia własnych funkcji, obiektów i aplikacji oraz zgłębiania bardziej zaawansowanych tematów języka JavaScript.

Quiz: Podstawy JavaScript

Pytanie 1 z 5

Które słowo kluczowe powinieneś użyć do zadeklarowania stałej wartości w JavaScript?

Widzisz jakiś błąd, bądź literówkę? Chcesz coś poprawić?✏️ Przejdź do edycji tego pliku