Laboratorium Wstawianie skryptu na stroną: 2. Komentarze: 3. Deklaracja zmiennych

Transkrypt

1 1. Wstawianie skryptu na stroną: Laboratorium 1 Do umieszczenia skryptów na stronie służy znacznik: //dla HTML5 <script>...instrukcje skryptu </script> //dla HTML4 <script type="text/javascript">...instrukcje skryptu </script> 2. Komentarze: // - za komentowanie jednej linijki kodu /* kończący się znakiem */ - komentarz, w którym umieszczamy kilka linijek kodu 3. Deklaracja zmiennych Zmienne to coś w rodzaju "pudełek" w których możemy przechowywać pewne wartości. Każda zmienna powinna mieć zadeklarowaną swoją nazwę. Deklaracja zmiennej ma postać: var nazwa_zmiennej = wartość Nazewnictwo zmiennych: każda nazwa zmiennej musi się zaczynać od litery (A-Z, a-z), lub znaku podkreślenia ("_"), nazwa zmiennej nie może się zaczynać od cyfry (0-9), nazwa zmiennej nie może zawierać spacji (można zamiast spacji używać podkreślenia), nazwa zmiennej nie może zawierać polskich liter, nazwą zmiennej nie może być słowo kluczowe zarezerwowane przez JavaScript. Przykłady: var liczba = 5; var imie = 7,0; var ile_rzeczy = 65; var to_jest_zmienna = '10'; Rodzaje zmiennych: Liczbowe - zawierające wartość liczbową var zmienna = 100; Logiczne (boolean) - zawierające wartość będącą prawdą lub fałszem var zmienna = true; var zmienna = false; Znakowe - zawierające wartość będącą ciągiem znaków (stringiem) var zmienna = "Jakiś tekst"; Null - zawierające wartość pustą czyli null. Wartość null nie jest ani 0, ani pustym ciągiem znaków var zmienna = null; Zasięg zmiennych:

2 Deklarowane zmienne możemy podzielić na globalne i lokalne. Zmienne globalne deklarowane są poza funkcjami i są dostępne dla całego skryptu. Zmienne lokalne są deklarowane wewnątrz funkcji i dostęp do nich ma tylko funkcja, w której dana zmienna została zadeklarowana. Podstawianie pod zmienne obiektów na stronie: Poza wykonywaniem działań na zmiennych możemy je wykorzystać do poprawienia czytelności skryptów poprzez zmniejszenie rozmiarów odwołań do obiektów. Przykładowo, aby się odwołać do wartości jakiegoś pola z formularza musielibyśmy używać zapisu: document.write("tekst " + document.getelementbyid('formularz').poletekstowe.value + " pochodzi z pola formularza"); 4. Operatory Javascript rozróżnia następujące typy operatorów: Operatory arytmetyczne: dodawanie + odejmowanie - mnożenie * dzielenie / modulo(reszta z dzielenia) % negacja - inkrementacja ++ dekrementacja - - Operatory przypisania: = += -= *= /= %= Operatory porównania: == - operator równości!= - operator nierówności > - operator większości < - operator mniejszości >= - operator większe-równe <= - operator mniejsze-równe === - identyczność!== - nie identyczność Operatory logiczne: && - operator "i" - operator "lub"! - operator "nie" ^ - operator "XOR" Sprawdza czy któryś z warunków jest spełniony przy czym nie mogą być spełnione oba naraz

3 5. Instrukcje warunkowe Instrukcja warunkowa wykonuje wybrany kod, w zależności czy wartość wyrażenia jest prawdą (true) czy fałszem (false). if (warunek) {...instrukcje jeżeli warunek jest poprany else{ switch switch (wyrażenie) { case przypadek1: //fragment wykonywany gdy rezultat wyrażenia jest równy rezultat1 - potrzebuje break; break; case przypadek2: //fragment wykonywany gdy rezultat wyrażenia jest równy rezultat2 - potrzebuje break; break; default: //fragment wykonywany gdy powyższe rezultaty nie są równe rezultatowi wyrażenia - nie potrzebuje break; operator? Operator? daje nam takie same możliwości co instrukcja if, z tym, że jest jej skróconą wersją. (wyrażenie)? zwróć_jeżeli_wyrażenie_true : zwróć_jeżeli_wyrażenie_false 6. Pętle Pętla typu while while (wyrażenie) {...fragment kodu który będzie powtarzany... Pętla typu do... while do {...fragment kodu który będzie powtarzany... while (wyrażenie) Pętla typu for for (zainicjowanie zmiennych; wyrażenie testujące; zwiększenie/zmniejszenie zmiennej) { kod ktory zostanie wykonany pewną ilość razy 7. Funkcje function nazwa_funkcji() {...kod funkcji

4 //lub nazwa_funkcji = function() {...kod funkcji anonimowej Instrukcja return function licz(liczba1, liczba2) { var wynik = liczba1 + liczba2; return wynik; alert( licz(10,4) ); 8. document.write() Metoda document.write służy do wpisywania tekstu w kod strony. Wymaga ona podania w argumencie parametru który zostanie wyświetlony na ekranie. Tym parametrem może być ciąg znaków, zmienna numeryczna lub zmienna typu logicznego. Przykładowe zastosowanie może mieć postać: document.write('to jest przykładowy tekst'); //Wyświetli tekst To jest przykładowy tekst //lub document.write("to jest przykładowy tekst"); 9. Funkcja alert() Funkcja ta wyświetla okno dialogowe z komunikatem podanym w nawiasach alert('witaj świecie'); Zadania Zadanie 1 Zaimplementować skrypt, który za pomocą okna dialogowego będzie wyświetlał napis Witaj świecie!. Zadanie 2 Zaimplementować skrypt Tabliczka mnożenia, który będzie wyglądał następująco:

5 Zadanie 3 Zaimplementować skrypt Kalkulator, który będzie posiadał funkcję: dodawanie, odejmowanie, mnożenie oraz dzielenie. Skrypt powinien wykonywać następujące polecenia: sprawdzać czy podana wartość jest liczbą, jeżeli nie musi wysyłać odpowiedni komunikat (isnan), uwzględniać przy wpisywaniu liczb dziesiętnych, również wpisywanie przecinka zamiast kropki (replace), zaokrąglać wynik do dwóch miejsc po przecinku (Math.round(Math.pow)).