Funkcje i instrukcje języka Java Script 1. Cele lekcji

(1)

Funkcje i instrukcje języka Java Script 1. Cele lekcji

a) Wiadomości Uczeń:

1. zapoznaje się z operatorami i typami danych języka Java Script;

2. poznaje konstrukcje definicji funkcji;

3. poznaje pętlę If i For, Do i While oraz przykłady ich użycia w języku Java Script;

4. poznaje deklarację tablicy.

b) Umiejętności Uczeń potrafi:

1. stosować funkcje i właściwie używać typów danych;

2. dokonywać konwersji typów znaków na liczby, liczb na tekst;

3. stosować pętle i tablice.

2. Metoda i forma pracy

Wykład.

Prezentacja.

Praca komputerze grupach przy komputerze.

Praca z kartą pracy ucznia.

3. Środki dydaktyczne

1. Prezentacja multimedialna: „Java Script – język programowania stron HTML” i „Java Script – dane, zmienne, instrukcje”.

2. Karta pracy ucznia: „Funkcje i instrukcje języka Java Script”.

4. Przebieg lekcji

a) Faza przygotowawcza

Odczytanie listy obecności, zalogowanie się uczniów do systemu Windows.

b) Faza realizacyjna

Nauczyciel prosi o przypomnienie zasady umieszczania skryptów na stronach WWW.

Uczniowie odpowiadają:

Możliwych jest kilka sposobów:

 umieszczanie kodu JS w pliku zewnętrznym,

 bezpośrednio w kodzie HTML wewnątrz poleceń <SCRIPT LANGUAGE=JavaScript TYPE=”text/javascript”>

….

</SCRIPT>

(2)

 :wewnątrz kodu, jako obsługa zdarzenia lub poprzez adres URL, do którego odwołuje się polecenie HTML.



Nauczyciel pyta o sposób, w jaki można wprowadzać dane na stronę internetową przy pomocy języka html.

Uczniowie odpowiadają: …obiektem umożliwiającym wprowadzanie danych jest formularz, realizuje to zadanie polecenie: <form>…</form>

Nauczyciel wyjaśnia, że jednym ze sposobów uzyskania dynamiczności strony WWW jest

zastosowanie skryptów języka Java Script i informuje, że na lekcji uczniowie zapoznają się z typami danych, operatorami i funkcjami oraz pętlami i przykładowymi możliwościami języka. Po zapoznaniu z tematyką zajęć, zapisanie tematu lekcji na tablicy.

Nauczyciel udostępnia uczniom prezentację „Java Script – język programowania stron HTML” z poleceniem powtórzenia wiadomości o zasadach wprowadzania i umieszczania skryptów. Uczniowie pracują samodzielnie w czasie od 5 do 7 minut. Zgodnie z poleceniem zapisują najważniejsze cechy jezyka Java Script:

 Java Script to skryptowy język programowania;

 efekty wykonania są widoczne w oknie przeglądarki internetowej;

 dzięki zastosowaniu skryptów strona staje się dynamiczna;

 istnieje możliwość reagowania na zdarzenia, np. kliknięcie obiektu, wpisania danych formularza. Język JavaScript posiada kolekcję obiektów i działa na obiektach.

Nauczyciel przypomina przykłady zastosowania skryptów na stronach:

Sprawdzenie poprawności wprowadzanych danych.

Stworzenie listy kontaktów.

Nauczyciel wyjaśnia konstrukcje języka – pętle, operatory, funkcje – wyświetla prezentacje multimedialną – „Java Script – dane, zmienne, instrukcje”.

Nauczyciel prezentuje skrypty do wykonywania obliczeń na stronie WWW. Przypomina algorytm Euklidesa.

Nauczyciel przedstawia zadanie – zasady rozwiązywania zadania z karty pracy ucznia.

Praca własna – wykonanie kolejnych poleceń zapisanych w karcie pracy „Funkcje i instrukcje języka Java Script”

c) Faza podsumowująca

Notatka podsumowująca wiadomości o funkcjach i pętlach języka JavaScript:

Właściwości określają pewne atrybuty obiektów. Metoda definiuje akcje (czynności) jakie można wykonać na obiekcie. Każdy obiekt może reagować na zdarzenia zdefiniowane dla danego obiektu.

5. Bibliografia

Tom Negrino, Dori Smith, Po prostu JavaScript, Helion, 1999 polecane adresy internetowe:

http://www.diversity.pl/index.php?option=com_content&task=view&id=53&Itemid=121 http://js.webinside.pl/

(3)

6. Załączniki

a) Karta pracy ucznia

Funkcje i instrukcje języka Java Script.

b) Prezentacja

Java Script – jezyk programowania stron HTML.

Java Script – dane, zmienne, instrukcje.

c) Zadanie domowe

Zaplanuj, jak wykonać kalkulator w języku JavaScript. Skorzystaj z funkcji dodawania:

function dodaj(formularz) {

var a, b;

a=formularz.wartoscA.value;

b=formularz.wartoscB.value;

document.formularz.wynik.value=parseInt(a)+parseInt(b);

}

oraz formularza:

<table width=30%><tr><td>liczba1<td>

<INPUT TYPE="text" NAME="wartoscA" VALUE="0" SIZE=4><tr><td>liczba2<td>

<INPUT TYPE="button" VALUE="Sumuj" onClick="dodaj(this.form)"><tr><td>Wynik:<td>

</FORM>