Zanim oficjalnie zaczniemy, JavaScript (w skrócie JS) – wbrew temu co sugeruje pierwszy człon nazwy – nie ma nic wspólnego z językiem programowania zwanym Java.
Kod JS jest zupełnie inny od tego, który można zobaczyć w Javie i różne są także przeznaczenia obu języków. Skoro wytłumaczyliśmy już sobie najważniejszą podstawę, możemy przejść do prezentacji najważniejszych informacji dotyczących JavaScript, wraz z krótką demonstracją, jak wygląda kod JS.
Co to JavaScript?
Javascript to skryptowy język programowania opracowany przez firmę Netscape. Wykorzystywany jest głównie na stronach internetowych, gdzie stosuje się go w celu zwiększenia ich interaktywności.
Należy też zaznaczyć, że jest to trzecia z podstawowych (obok HTML i CSS) technologii używanych przy tworzeniu stron internetowych. JavaScript pozwala zmieniać treść w zależności od sytuacji, wyświetlać video i interaktywne wykresy, bądź też mapy. Bez JS nie byłoby Internetu, jaki znamy teraz.
Co można zrobić dzięki JavaScript?
Struktura kodu JS pozwala programiście stworzyć niemalże dowolną funkcjonalność w witrynie. To właśnie dzięki JavaScript powstały formularze kontaktowe, czy koszyk w sklepie internetowym, czyli funkcjonalności, z których korzystamy na co dzień.
Jednym z głównych i najważniejszych zastosowań JavaScript jest dynamiczne modyfikowanie HTML i CSS.
Dzięki temu, możemy:
- dowolnie zmieniać i ukrywać atrybuty i zawartość HTML;
- wpływać na zmianę stylu CSS;
- podpinać do strony skrypty takie jak Google Analytics czy też Piksel Facebooka, służące do optymalizacji witryny i mierzenia ruchu.
Gdzie i jak można umieścić kod JS?
Istnieją trzy sposoby umieszczenia kodu JS na stronie:
- Pomiędzy znacznikami
- Pod postacią lokalnego pliku o rozszerzeniu .js, który dołącza się do strony przy pomocy specjalnego znacznika – <script src=”/js/nazwa_pliku.js”></script>
- Jako plik zewnętrzny umieszczony na innej witrynie, przy pomocy znacznika – <script src=”http://www.xyz.pl/…./js/nazwa_pliku.js”></script>
Kody te można umieszczać:
- Wewnątrz znacznika
- W części nagłówkowej strony pomiędzy
Jakie wady i zalety ma JavaScript na stronie internetowej?
JavaScript, jak każdy język programowania, ma swoje zalety i wady. Niestety, ale rzeczy idealne nie istnieją, więc trzeba nauczyć się skutecznie wykorzystywać zalety, minimalizując wpływ wad.
Oto najważniejsze zalety JavaScipt:
- Prostota – Jedną z największych zalet JavaScript jest bardzo prosta i intuicyjna składnia. Kod można zacząć pisać już po kilkunastu minutach nauki.
- Popularność – JavaScript to niezwykle popularny język. Dzięki temu w Internecie bez problemu można znaleźć poradniki i kursy, a efekty stosowania JavaScript zobaczyć można niemalże na każdej stronie internetowej.
- Wpływ na stronę internetową – JavaScript pozwala odciążyć serwer, zmniejszając ilość danych przesyłanych pomiędzy hostingiem a użytkownikiem. Najlepszym przykładem może tu być formularz rejestracyjny, w którym, dzięki zastosowaniu kodu JS, wpisane przez użytkownika informacje sprawdzane są w przeglądarce. Pozwala to uniknąć zbędnego przesłania danych, przeanalizowania ich przez skrypty na serwerze i odesłaniu informacji do użytkownika.
- Uniwersalność – Kod JS pozwala na wykonanie niemalże dowolnego działania na stronie, od zmiany koloru czcionki zaczynając, na zaawansowanych operacjach czyniących stronę interaktywną, kończąc.
- JS jest ciągle rozwijany – Mimo głosów wieszczących rychły upadek JavaScript, ten ma się całkiem dobrze i jest ciągle rozwijany.
Oto kluczowe wady JavaScript:
- Niejednoznaczna interpretacja kodu przez przeglądarki – Efekt działania tego samego kawałka kodu może wyglądać zupełnie inaczej w Chrome i Firefoxie. Nawet napisany zgodnie z wszelkimi zaleceniami kod, może w określonych przypadkach zacząć żyć swoim życiem.
- Nieustanny rozwój – Tak, to także minus. Framework, który stosujemy teraz, może zostać za jakiś czas wyparty przez inny, nowszy, którego trzeba będzie nauczyć się od nowa.
- Nadużywanie JS przez programistów – JavaScript nie nadaje się do używania wszędzie. W miejscach, gdzie potrzebna jest bardzo wysoka wydajność, lepiej z niego zrezygnować, podczas gdy wiele osób implementuje kod JS także tam, co może powodować komplikacje.
Na JavaScript można narzekać, nie da się jednak ukryć, że na horyzoncie nie ma żadnej alternatywy, a nawet jeśli się pojawi to… JS przejmie najlepsze rozwiązania i po chwili nikt już nie będzie pamiętał o tym, że istniała jakaś konkurencja.
Przykłady kodu JS (syntax)
Kod JS jest bardzo rozbudowany i płynne stosowanie go wymaga wielu miesięcy intensywnej nauki. Sama składnia nie należy na szczęście do trudnych i bez problemu można szybko ją opanować i radzić sobie z czytaniem czyjegoś kodu.
Oto podstawowe przykłady syntaxu:
Deklarowanie zmiennych
String to typ danych, składający się z ciągu znaków. W JavaScript stringi zapisuje się w następujący sposób:
var imieKota1 = „Puszek”;
var imieKota2 = „Pusia”;Zmienne pozwalają na przechowywanie w pamięci różnego rodzaju danych. Nie muszą to być oczywiście ciągi znaków, mogą to być także np. liczby.
Instrukcje warunkowe
Instrukcje warunkowe służą m.in. do zautomatyzowania zależności w stylu „jeśli…, to…”. Może to wyglądać następująco:
const nr = prompt("Podaj liczbę");
if (nr > 10) { //jeśli...
console.log("Liczba jest większa od 10"); //... to
} else { //jeśli nie...
console.log("Liczba jest mniejsza od 10"); //... to
}Podany powyżej kod analizuje wprowadzoną przez użytkownika liczbę. Jeśli będzie ona większa od 10, warunek zostanie spełniony i wyświetli się napis „Liczba jest większa od 10”. Jeśli podana liczba będzie mniejsza, zobaczymy „Liczba jest mniejsza od 10”. Fragmenty znajdujące się po // są komentarzami, które w niektórych sytacjach wykorzystuje się do zapisywania, co robi dany fragment kodu.
