Vstupy a výstupy v JavaScriptu Vstup: použitím metody prompt objektu window čtením hodnot z položek formuláře Výstup : použitím metody alert objektu window.

Prezentace na téma: "Vstupy a výstupy v JavaScriptu Vstup: použitím metody prompt objektu window čtením hodnot z položek formuláře Výstup : použitím metody alert objektu window."— Transkript prezentace:

1 Vstupy a výstupy v JavaScriptu Vstup: použitím metody prompt objektu window čtením hodnot z položek formuláře Výstup : použitím metody alert objektu window použitím metody write objektu dokument přiřazením hodnoty do položek formuláře přiřazením hodnoty vlastnosti innerHTML objektu dokument přiřazením hodnoty vlastnosti innerText objektu dokument

2 var r,S; //deklarace proměnných r=parseFloat(prompt("Zadej polomer:",0)); //vstup S=Math.PI*r*r; //výpočet document.write(" S = "+S+" "); //výstup Vstup metodou prompt objektu window

3 Získání hodnoty z položky formuláře Obsah kruhu function vypocet() { var r,S; r=parseFloat(document.f.R.value); S=Math.round(100*Math.PI*r*r)/100; document.write("Obsah kruhu je "+S); } Obsah kruhu Zadej polomer:

4 Výstup metodou alert objektu window var r,S; r=parseFloat(prompt("Zadej polomer:",0)); S=Math.PI*r*r; alert( "S = "+S);

5 Výstup metodou write objektu window Ve skriptu umístěném v těle dokumentu píše do místa, kde je skript ve zdrojovém textu zapsán: - píše do místa, kde je skript ve zdrojovém textu zapsán: NADPIS Text odstavce document.write("A tento text byl vypsán skriptem"); x=Math.PI*2; document.write(" A jeste výpocet: "+ x +" "); document.write("Konec skriptu"); Zde pokracuje stranka

6 Výstup metodou write objektu window … function vypocet() { var r,S; r=parseFloat(document.f.R.value); S=Math.round(100*Math.PI*r*r)/100; document.write("Obsah kruhu je"+S); } … Je-li použita ve funkci, která je volána po zobrazení dokumentu, píše do nového dokumentu

7 Výstup přiřazením do položky formuláře - neformátovaný výstup Obsah kruhu function vypocet() { var r,S; r=parseFloat(document.f.R.value); S=Math.round(100*Math.PI*r*r)/100; document.f.vyst.value="Obsah kruhu je "+S; } Obsah kruhu Zadej polomer: Výsledky:

8 Výstup přiřazením hodnoty vlastnosti innerHTML Obsah kruhu function vypocet() { var r,S; r=parseFloat(document.f.R.value); S=Math.round(100*Math.PI*r*r)/100; document.all.vys.innerHTML="Obsah kruhu je "+S+" "; } Obsah kruhu Zadej polomer: Výsledky:

9 Výstup přiřazením hodnoty do vlastnosti innerText Obsah kruhu function vypocet() { var r,S; r=parseFloat(document.f.R.value); S=Math.round(100*Math.PI*r*r)/100; document.all.odst1.innerText="Obsah kruhu je "+S; } Obsah kruhu Zadej polomer: Výsledky:

10 JavaScript část 3 Funkce, příkaz if

11 Funkce  samostatná pojmenovaná část programu (skriptu)  provede se až, když je zavolaná (obvykle v reakci na událost)  lze ji aplikovat (volat) opakovaně na různých místech programu  uvnitř funkce je možné volat jinou funkci  zpřehledňuje program, zkracuje zdrojový text  umožňuje získávat hodnoty, se kterými bude program (skript) pracovat: Vrací výsledek jako hodnotu function Obsah1(a) {b =a*a; return b;} x=Obsah1(3); document.write(x); Provede akci (výpočet a výpis výsledku, změna obsahu objektu apod.) function Obsah2(a) {b =Math.PI*a*a; document.f1.vysledek.value=b;}

12 Příklad

13 Rozdělení funkcí Funkce vestavěné parseInt(x), parseFloat(x), … matematické funkce objektu Math, … uživatelem vytvořené Definice: function jmeno(x,z) { příkazy } Volání funkce: s parametry: jmeno(x,z) bez parametrů: jmeno()

14 Jak se funkce ve skriptu definuje  V jazyku JScript se definice funkce(í) vkládá obvykle do hlavičky dokumentu  Jako každý skript i tyto definice jsou součástí prvku hlavička tělo { var dx,dy,v; dx=x2-x1; dy=y2-y1; v=Math.sqrt(dx*dx+dy*dy); return v; } function dist( x1,y1,x2,y2 ) klíčové slovo název funkce seznam tzv. formálních parametrů

15 Volání funkce Provedení funkce vyvoláme příkazem, který obsahuje název (identifikátor) funkce se seznamem skutečných parametrů.  funkce vrací hodnotu volání je součástí výrazu na pravé straně přiřazovacího příkazu: Příklad: y=2/Math.sqrt(a); x=Obsah1(3);  funkce nevrací hodnotu – volání je samostatným příkazem funkce s parametry: jmeno(seznam skutečných parametrů) Příklad: Vyp(x1,x2,25); Obj(this.form); Dej_vysledek(a*3,15,b); funkce bez parametrů: jmeno() Příklad: Vypocet();

16 Kvadraticka rovnice function jake_koreny() { var a,b,c,d,x1,x2; a=document.koef.A.value; b=document.koef.B.value; c=document.koef.C.value; d=b*b-4*a*c; if (d>0) document.koef.vysl.value= "dva reálné kořeny"; if (d==0) document.koef.vysl.value= "dvojnásobný reálný kořen"; if (d<0) document.koef.vysl.value= "dva komplexní kořeny"; } Jaké kořeny má kvadratická rovnice? Zadej rovnici Ax 2 + Bx + C A: B: C: Rovnice má definice funkce volání funkce Volání funkce

17 Lokální a globální proměnné, parametry Ve funkci lze pracovat s:. lokálními proměnnými: definovány v těle funkce. globálními proměnnými: def. mimo tělo funkce (ve skriptu). parametry: definovány v hlavičce funkce Možnosti předávání parametrů při práci s funkcemi: z funkce ven return globální proměnné parametry do funkce var v=0;globální proměnná function dist (x1,y1,x2,y2) formální parametry { var dx,dy;lokální proměnné dx=x2-x1;dy=y2-y1; v=Math.sqrt(dx*dx+dy*dy); } V globální proměnné v je po provedení funkce výsledek. … Lze ji případně použít v dalších funkcích.

18 Parametry a jejich předávání Parametry: Příklad:  formální: v hlavičce definice funkcefunction F(x,y)  skutečné: ve volání funkcev=F(a,b); Skutečné parametry se při zavolání funkce dosazují na místo formálních. Dva způsoby předávání:  hodnotou skutečný parametr – konstanta, proměnná nebo výraz hodnota skutečného parametru se nemění (dosadí se jen hodnota)  odkazem skutečný parametr – proměnná (ve funkci se pracuje přímo s parametrem) změna hodnoty formálního parametru  změna skutečného parametru Příklad: Hlavička: function dist (x1,y1,x2,y2) Volání: d=dist(3,4,5,6); d=dist(a1,a2,b1,b2); d=dist(a1+p,a2+p,b1+q,b2+q); Obsah(3);

19 Příklad Funkce function Cels2Fahr() { var teplCels=parseFloat(document.teplota.celsius.value); var teplFahr=(9/5)*teplCels+32; document.teplota.fahrenheit.value=Math.round(teplFahr*10)/10; } function Fahr2Cels() { var teplFahr=parseFloat(document.teplota.fahrenheit.value); var teplCels=(teplFahr-32)*(5/9); document.teplota.celsius.value=Math.round(teplCels*10)/10; } Teplota ve stupních Celsia >> °C na °F >>>" onclick="Cels2Fahr()"> <INPUT type="button" value="<<< °F na °C <<<" onclick="Fahr2Cels()"> Fahrenheita

20 Parametry a jejich předávání Funkce v=0; function F1(a,b) { a=a*b; return a;} function F2(a,b) { a.value=a.value*b; return a;} function Vyp() { s="v="+v+" "; v=document.f.C.value; s+="v="+v+" "; x=F1(v,5); s+="x="+x+" "; s+="v="+v+" "; x=F1(document.f.C.value,5); s+="x="+x+" "; s+="document.f.C.value="+document.f.C.value+" "; x=F2(document.f.C,5).value; s+="x="+x+" "; s+="document.f.C.value="+document.f.C.value+" "; document.all.V.innerHTML=s; document.f.C.value=3;} Napis cislo: