dla Początkujących
6 godz. 26 min · JavaScript · Full-stack i Programowanie
Adam GospodarczykProgramowanie to szeroka dziedzina, która nieustannie się rozwija. Rozpoczynając naukę możemy opierać się głównie na wskazówkach bardziej doświadczonych osób, bądź autorach kursów i nauczycielach. W praktyce najważniejsze na początku jest dobre zrozumienie tego, czym jest programowanie, jakie możliwości daje oraz jakie możemy wybrać ścieżki rozwoju. W tym kursie spojrzymy na programowanie z szerokiej perspektywy, dając Ci solidne podstawy do dalszej nauki.
To kolejne trudne pytanie, na które nie ma jednoznacznej odpowiedzi. Dobra wiadomość jest taka że języki programowania, podobnie jak angielski, niemiecki czy hiszpański mają cechy wspólne. Nie oznacza to że nauka jednego, da Ci dostęp do wszystkich ale poznasz ogólne mechanizmy, które spotkasz w niemal wszystkich pozostałych technologiach. W tym kursie skupiamy się właśnie na takich obszarach, opierając przykłady o obecnie najpopularniejszy język jakim jest JavaScript.
Być może zastanawiasz się jak dokładnie wygląda praca programisty? Czym różni się front-end od back-endu i czy wysokie umiejętności analityczne są wymagane niezależnie od obszaru programowania, którym się zajmujemy? Dodatkowo samo zostanie programistą to tylko początek drogi. Możliwości jakie przed nami stoją nie tylko są ogromne, ale również nieustannie się rozwijają, stawiając przed nami nowe wyzwania.
Ten kurs podzielony jest na dwie części - teoretyczną, która przedstawi Ci szerokie spojrzenie na programowanie oraz praktyczną, w której samodzielnie będziesz w stanie przekonać się jak pisać programy z wykorzystaniem języka JavaScript - najpopularniejszego języka na świecie. To, że będziemy przerabiać przykłady w JavaScript, nie stanowi przeszkody a wręcz lepiej przygotuje Cię do pracy z innymi językami jak Python, C# czy C++ lub Kotlin. To wszystko ułatwi Ci podejmowanie decyzji dotyczących dalszej nauki i rozwoju jako programista.
W pierwszych lekcjach części praktycznej kursu dowiesz się jak skonfigurować środowisko pracy wraz z edytorem, w którym przyjdzie Ci pracować. Pomożemy Ci w dobraniu odpowiednich ustawień i wtyczek, które przyspieszą naukę i pomogą w lepszym zrozumieniu podstawowych koncepcji programistycznych. Krok po kroku dowiesz się jak przygotować środowisko i rozpocząć komfortową pracę.
Mimo, że będziemy pracować z JavaScript, posłuży nam on do przedstawienia najważniejszych koncepcji programowania w każdym innym języku. Nie będziemy uczyć się tworzenia stron i środowiska przeglądarki a jedynie przećwiczymy najważniejsze koncepcje języków programowania w środowisku konsolowym. Dzięki temu zdobyte umiejętności z łatwością przełożysz na inne języki jak Python, Java czy Swift, bo wszystkie posiadają identyczne konstrukcje, a poznać należy wyłącznie różnice.
OOP to jeden z najważniejszych paradygmatów programowania, który powinien poznać każdy aspirujący Programista. Dzięki temu będziesz mógł zdecydowanie lepiej zrozumieć możliwości i powiązania klas i obiektów, które tworzą programiści a także pisać kod, który jest prostszy i reużywalny. To koncepcja, którą także wyjaśnimy obrazowo w kursie. Oczywiście, poza teorią w kursie pokażemy Ci przykłady tworzenia funkcjonalnych klas w JavaScript.
Kolejną ważną koncepcją, którą musi znać każdy początkujący Programista jest praca z błędami - innymi słowy obsługa błędów lub debugowanie naszej aplikacji. To niezwykle ważne, bo oszczędzi Ci mnóstwa frustracji oraz wielu godzin rozpoznawania, co w kodzie nie działa poprawnie. Z kursu w praktyce dowiesz się, jak testować swoje aplikacje, łatwo wykrywać błędy i korzystać z narzędzi, które będą je dla nas wykrywać lub automatycznie poprawiać!
Ten kurs przygotowaliśmy tak, aby był fundamentem wiedzy o Programowaniu, którego używamy w wielu naszych ścieżkach na eduweb.pl. To znaczy, że kurs który masz przed sobą rozpoczyna ścieżkę Python, JavaScript, Ruby i wiele innych. Wiemy, że w sieci jest mnóstwo materiałów na temat podstaw programowania i chcieliśmy przygotować wyjątkowy kurs, który da Ci spokój w natłoku wielu informacji w sieci. Zaangażowaliśmy w to najlepszych autorów eduweb oraz naszym zdaniem jednych z najlepszych programistów w Polsce. To, co jest jednak najważniejsze - kurs omawia programowanie bardzo prostym językiem, dzięki czemu jest przystępny dla każdego!
Kurs przeznaczony jest dla osób początkujących, które stawiają swoje pierwsze kroki na scieżce programisty lub programistki. Jednak skorzystają z niego także te osoby, które myślą o nauce programowania w celu uzupełnienia innych umiejętności, na przykład internetowi przedsiębiorcy, freelancerzy, UI/UX i web designerzy. Jeżeli czujesz się zagubiony lub przytłoczony dużą ilością często sprzecznych informacji - ten materiał pozwoli Ci szerzej spojrzeć na programowanie. To z kolei przełoży się na lepsze decyzje, które będziesz podejmować w kontekście swojego rozwoju. W kursie znajdziesz wskazówki i porady dotyczące efektywnej nauki programowania, które pomogą Ci szybciej zdobyć nowe umiejętności i pracę w zawodzie. Najważniejszą z nich jest fakt, że programowanie to dynamicznie rozwijająca się dziedzina, która wymaga od Ciebie nieustannej nauki. Zatem wypracowanie odpowiednich nawyków i technik nauki jest niezwykle istotne, niezależnie od miejsca w którym aktualnie się znajdujesz.
W tej lekcji zajmiemy się kolejnym typem danych, który z angielskiego nazywa się boolean,
a po polsku często mówi się, że są to wartości bulowskie.
Tak potocznie można to tłumaczyć, a tak
naprawdę chodzi o wartości typu prawda lub fałsz.
Teraz jak się to zapisuje?
Będę chciał żebyśmy sobie wyobrazili troszkę większy program, którego na razie
nie mamy, ale taki który myślę, że jest łatwy do wyobrażenia.
Otóż jeżeli np.
chodzisz po internecie, to często możesz zobaczyć, że wchodzisz na jakąś stronę gdzie
można się zalogować no i widzisz przycisk zaloguj się.
Ale kiedy już się zalogujesz to tego przycisku nie ma.
Wynika to z tego, że w takim kodzie strony internetowej są pewnego rodzaju instrukcje
warunkowe, które sprawdzają czy ktoś jest zalogowany, nie jest, pokaż przycisk zaloguj się. Jeżeli jest nie pokazuj tego przycisku pokaż np.
przycisk wyloguj się. Więc będziemy chcieli sobie utworzyć taką
stałą, którą nazwiemy isLoggedIn, czyli is log in, powiedzmy że
ona nam będzie przechowywać czy ktoś jest zalogowany czy nie. Nie jest zupełnie
istotne na tym etapie jak to sprawdzić, skąd taką wartość weźmiemy itd.
Wyobraź sobie, że mam jakąś funkcję, później o tych funkcjach będziemy mówić i ona nam
odpowiada na jedno pytanie, czy ktoś jest zalogowany czy nie,
zwróć mi prawdę lub fałsz. I taka prawda lub fałsz literalnie wygląda w ten sposób.
Czyli w języku JavaScript i w wielu innych językach zapisujemy to jako true.
Nie jest to w cudzysłowach, bo gdybym to tak
zapisał to byłaby to wartość testowa, w której po prostu wpisałem true,
ale mogłem też wpisać prawda i niczym się to
nie różni od siebie tak naprawdę z punktu widzenia języka.
Natomiast jeżeli piszemy to tak, bez
cudzysłowów, to jest to specjalna wartość, która określa prawdę.
Drugą wartością, która określa fałsz jest
false zapisywane w ten sposób i również jest to specjalna wartość
praktycznie w każdym języku programowania.
One są dostępne zawsze, wszędzie w każdym języku
ewentualnie może to wyglądać trochę inaczej, czasami jest reprezentowana jako 0
lub 1. Natomiast zapiszmy tutaj true. I teraz nasza stała, którą nazwaliśmy isLoggedIn,
mogliśmy ją nazwać dowolnie np.
czyZalogowany przechowuje wartość true.
No i teraz mógłbyś zapytać co z tą wartością możemy zrobić.
I teraz ja muszę niestety troszeczkę
wybiec w przyszłość i pokazać Ci instrukcje warunkowe, o których jeszcze nie mówiliśmy
w kursie, a będzie im poświęcony cały dział,
natomiast bez tego nie jestem w stanie Ci
tak naprawdę pokazać do czego są przydatne wartości prawdziwe i fałszywe, czyli
prawda i fałsz.
Więc wybiegniemy sobie delikatnie w przyszłość. Wyobraź sobie, że mamy właśnie
program, gdzie na pewnym etapie dowiedzieliśmy się czy ktoś jest
delegowany czy nie. W jakiś sposób byśmy to sprawdzili i mielibyśmy stałą która
przechowuje true lub false. O tym już zapominamy.
Wiemy, że tutaj jest wartość odpowiadająca prawdzie czyli albo jest zalogowany albo
nie i na tej podstawie chcę podjąć jakąś decyzję.
Więc stworzylibyśmy instrukcję warunkową o czym jeszcze za kilka lekcji będziemy mówić
i tam trzeba przekazać wartość prawdziwą
lub fałszywą. Więc jeżeli przekażemy wartość tego isLoggedIn tutaj
to jest dokładnie tak samo jak byśmy tutaj wstawili true,
prawda? To jest dokładnie to samo bo już wiesz, że zmienne czy stałe jak tworzymy to
po to, żeby przechowywały jakieś wartości, do tych wartości się można odwoływać.
Więc jeżeli ja tutaj napiszę isLoggedIn
to w tym konkretnym przypadku
podstawiam tutaj true. I tworzymy sobie taki blok, który się
wykona jeżeli jest to prawda. I zrobimy sobie ten consoleLog, który już znasz
i tym razem nie będziemy do niego podstawiać żadnej zmiennej, ale wartość
tekstową, o których już wiesz, wstawimy tutaj bezpośrednio co oczywiście w
każdym miejscu naszego programu również możemy robić. Nie musimy zapisywać wartości
tekstowej zmiennej i potem się do zmiennej odwoływać. Możemy tam gdzie można
przekazywać wartości przekazać albo zmienną albo wpisać taką wartość tak po prostu
literalnie. Więc wpiszemy tutaj zalogowano bo chcemy taki tekst wyświetlić tutaj po
prawej stronie. Zapisuje to i zauważ że ten tekst się tutaj wyświetlił, a to oznacza
tylko tyle, że ta wartość jest to wartość prawdziwa jest tutaj true.
Natomiast możemy również stworzyć blok else, który mówi w przeciwnym wypadku
jeżeli ten warunek się nie wykona, to chcemy wykonać inny blok kodu.
I tutaj piszemy console.log nie zalogowano.
Zapisuje, zauważ że nasz program cały czas
wyświetla zalogowano, bo tutaj mamy wartość true.
Natomiast jeżeli ta stała przyjmie wartość false, czyli nie jest to prawda,
jest to fałsz.
Zauważ, że wyświetliło się nie zalogowano. Czyli poznałeś w tym momencie dwie nowe
wartości jest to prawda lub fałsz i widzisz że one się mogą przydawać
szczególnie w instrukcjach warunkowych, o których jeszcze w tym kursie później powiemy,
bo pozwalają nam determinować jakieś wybory.
Jeżeli ktoś jest zalogowany wykonaj pewien kod np.
na stronie internetowej pokaż przycisk wyloguj, ale jeżeli nie jest zalogowany
czyli w przeciwnym wypadku wykonaj inny kod. My tutaj tylko wyświetliliśmy tekst nie
zalogowano, ale zamiast tego na stronie moglibyśmy pokazać np.
przycisk do logowania czy formularz.
Na koniec muszę Ci powiedzieć o jeszcze
jednej ważnej rzeczy. Otóż mamy w języku JavaScript i w wielu innych językach
wartości określane jako prawdziwe i fałszywe bo true lub false to jest wprost
prawda albo fałsz, ale są też wartości uznawane za fałszywe.
Teraz będę chciał Ci to pokazać. Utworzę zmienną value jak wartość bo chcę tutaj
przedstawić czy wpisać, przypisać jakąś wartość. I przypiszę coś takiego:
pusty ciąg znaków. Może dla Ciebie to
wygląda dziwnie, bo wcześniej pisaliśmy np. Jan,
ale co ważne ciąg znaków może być pusty.
Czyli jest to wartość tekstowa ale ona nie ma w sobie żadnego tekstu.
Taka wartość może się znaleźć w zmiennej z wielu powodów.
Na stronach internetowych na przykład jak ktoś coś wpisuje do formularza i pominie
jakieś pole, nic nie wpisze, to później kiedy możemy odczytywać wartości tych pól
to będziemy mieli właśnie taki pusty ciąg znaków. To jest to co byśmy otrzymali
jeżeli ktoś by nic nie wpisał. I to jest uznawane za wartość fałszywą.
Jeżeli byśmy stworzyli instrukcję warunkową If I podali tam value
i następnie chcielibyśmy wypisać w console.log jeżeli ta wartość jest prawdziwa to
chcielibyśmy wypisać: ta wartość jest prawdziwa,
zapisuje, zauważ że nigdzie się to nie pojawiło.
No i właśnie z jakiego powodu.
Dlatego że w instrukcjach warunkowych, kiedy przekażemy tutaj false,
albo w zasadzie w tym przypadku jeżeli przekażemy tutaj true
ta klinika się pokaże, ale zamiast true możemy
też przekazywać wartości prawdziwe i na odwrót zamiast false możemy przekazywać
wartości fałszywe. I to co jest ważne to w języku JavaScript,
ale podobnie będzie np. w języku PHP,
pusty ciąg znaków jest uznawany za wartość fałszywą.
Zauważ że nam się to tutaj nie wyświetla, ale
wystarczy że w tym pustym ciągu znaków wpisze cokolwiek, nawet jedną literkę,
zapisze i widzimy ta wartość jest prawdziwa. Dlatego, że mamy tutaj już
cokolwiek i to jest zamieniane, można powiedzieć, w tym miejscu na prawdę.
To również będzie bardziej jasne później,
ale pamiętaj że oprócz prawdy i fałszu
również wszystkie wartości są określane jako prawdziwe albo fałszywe.
I teraz będę chciał Ci pokazać jakie
wartości w przypadku języka JavaScript są wartościami fałszywymi.
I wystarczy żebyś zapamiętał te wartości bo
każda inna będzie uznawana za wartość prawdziwą.
Gdyby się znalazła pod jakąś zmienną, którą przekażemy do instrukcji if to wtedy taki
blok kodu się wykona. A więc wartości fałszywe wpiszemy to w
komentarzu, żeby to nam nie psuło w żaden sposób naszego programu.
Wartości fałszywe w przypadku konkretnie języka JavaScript.
Tutaj w komentarzu je wypisze to będzie np.
false taki jak na samej górze w pierwszej linijce widzisz. Następnie zero.
Gdybyśmy postawili tutaj zero albo bezpośrednio albo znalazłoby się to tutaj,
czyli wartość liczbowa ale zero będzie uznawana za fałszywą
i taka klinika kodu by się tutaj nie wykonała, więc zero.
Kolejną wartością fałszywą będzie pusty ciąg znaków, który już Ci przed momentem pokazałem.
Kolejną wartością fałszywą byłby null, o którym jeszcze powiemy.
Kolejną wartością będzie undefined.
O tym też jeszcze będziemy mówić w jednej
z kolejnych lekcji i również wartość NaN czyli not a number. To jest wartość, o której
już powiedzieliśmy w przypadku wartości liczbowych.
Wiem, że na początku przygody z programowaniem to się może wydawać
skomplikowane, ale tutaj warto zapamiętać, że w przypadku języka JavaScript wszystkie te
wartości czyli, albo wartość false, albo wartość liczbowa 0, albo pusty ciąg znaków,
albo null i undefined o który jeszcze będzie albo not a number są uznawane za fałszywe.
I jeżeli jakakolwiek z nich znalazłaby się w zmiennej,
tak jak tutaj w stałej value i następnie to value byśmy podstawili do takiego if, to nam się
taki kod nie wykona bo nie jest to wartość prawdziwa.
Natomiast każda inna wartość czyli np.
ciąg znaków w którym cokolwiek będzie, czy np.
liczba 1, każda inna wartość będzie uznawana za wartość prawdziwą.