Einführung Javascript Programmierung
Einführung Javascript Programmierung
1. Was machen wir im TuT genau?
2 .Was ist JavaScript?
3 .Wie binde ich JavaScript in denn html Code ein?
4.Was ist beim Programmieren zu beachten?
5. Die if-Anweisung
6. Variablen Werte zuweisen und mit if-Anweisung abfragen
7.Operatoren
8.Schleifen
9.Zeichenketten
10.Arrays
11.Einfache Spiele Aktionen
1. Was machen wir im TuT genau?
2 .Was ist JavaScript?
3 .Wie binde ich JavaScript in denn html Code ein?
4.Was ist beim Programmieren zu beachten?
5. Die if-Anweisung
6. Variablen Werte zuweisen und mit if-Anweisung abfragen
7.Operatoren
8.Schleifen
9.Zeichenketten
10.Arrays
11.Einfache Spiele Aktionen
1. In diesem TuT möchte ich euch die Programmierersprache Javascript näher bringen.
Wir werden am ende erste einfache Spiele Aktionen mithilfe von JavaScript Programmieren.
2. Javascript ist eine Client seitige Sprache das bedeutet das der Anwender das Programm abspielt dieses kann man Browser einsehen.
Hier noch einmal ausführlicher wer es nicht verstanden hat:
3. Javascript kann inmitten eurer HTML-Seite eingebaut werden.
Code:
<script type=“text/javascript“> </Script>
Kleiner Hinweis
4.Beim schreiben einer Javascriptanwendung müssen wir 4 Punkte beachten:
- N4m3n setzten sich aus Buchstaben und Zahlen zusammen und dürfen keine Sonderzeichen beinhalten, ausgenommen dem unterstrich
- Man darf keine Namen vergeben die schon für befehle vergeben werden
- Namen dürfen keine L e e r z e i c h e n enthalten
- Man muss Penibel auf klein/GROß Schreibung achten im Code
Wenn man diese Punkte beachtet dürfte bei unserem Projekt nichts schief gehen.
5.Wenn man eine „Fallunterscheidung“ durchführen möchte kann man die if-else-Anweisung dafür benutzen:
Code:
if (Bedienung)
{Anweisungsfolge}
else
{Anweisungsfolge}
man kann auch mehrere Anweisungen auswerten:
Code:
if (Bedingung)
{Anweisungsfolge}
else if (Bedienung)
{Anweisungsfolge}
else
{Anweisungsfolge}
6.Variablen sind wie der Name schon sagt Variabel und dies in Wert und Name wir müssen hierbei nur auf die 4 Grundregeln achten aber das ist euch höchstwahrscheinlich auch selber klar.
Variablen bestimme ich mit dem „var“ Befehl folgender Massen
Code:
var Name = “Wert_von_Name“;
Nun ein kleiner Code indem ich mit if-Anweisung und Variablen Arbeite
Code:
<html><head><title>Test</title>
<script type="text/javascript">
function Geheim () {
var Passwort = "Epvp";
var Eingabe = window.prompt("Bitte geben Sie das Passwort ein", "");
if (Eingabe != Passwort) {
alert("Falsches Passwort!");
} else {
location.href = "http://ww.google.de/";
}
}
</script>
</head><body onload="Geheim()">
<h1>Bitte passwort eingeben</h1>
</body></html>
mit dem Code:
Code:
if (Eingabe != Passwort)
Code:
alert("Falsches Passwort!");
} else {
location.href = "http://ww.google.de/";
und die angewählte URL wird auf
geändert.7.Wie ihr eben schon gemerkt hat gibt es andere Operatoren als nur == Hier sind sie alle:
Operatoren
== gleich
!= nicht gleich
< größer als
> kleiner als
<= kleiner als oder gleich
>= größer als oder gleich
! nicht
|| oder
&& und
+ Addition
- Subtraktion
* Multiplikation
/ Division
++ Inkrement / zuwachs
-- Dekrement / niedergehend
Möchtest du zum Beispiel eine Messaggebox ausgeben wenn der wer größer oder gleich 4 ist schreibst du es folgendermaßen:
Code:
if (a >= 4) {alert(“Richtig“);}
Code:
if (x == 5 && b <= 7)
nun habe ich 2 Bedingungen gestellt:
x ist gleich 5
und
b ist kleiner oder gleich 7
8.Schleifen dienen dazu das sich Anweisungen wiederholen.
Im Javascript haben wir die Möglichkeit von for- und while- schleifen.
Die for- schleife oder auch Zählschleife diese ist folgendermaßen aufgebaut:
Code:
for (Startwert; Bedingung ; Änderung)
{Anweisungsfolge}
Code:
<script type= “text/javascript“>
for (i=1;i<=5;i++)
{document.write (“i hat den Wert“ + i + “<br>“);}
</script>
Code:
while (Bedingung)
{Anweisungsfolge}
Code:
<table border = “1“>
<script type= “text/javascript“>
var i = 0;
var x = 0;
while (i<10)
{x=x+i; document.write (“<tr><td>“+ i +“</td<td>“+ x +“</td></tr>“);i++;}
</script>
</table>
9.Zeichenketten sind wie man hört aneinander gereihte Namen diese sind relativ einfach zu schreiben
+ Verkettung von Zeichenketten
+= Zeichenkette erweitern
So wird eine Zeichenkette gebildet
Code:
<script type= “text/javascript> x = vorname “Ole“; nachname = “Richter“; x = vorname + “ “ + nachname; x += “, das ist mein vollername“ document.write (x) ; </script>
Als erstes die Version Zahlen:
Code:
<script type= “text/javascript“>
a = new Array ();
a[0] = ´x´;
a[1] = ´c´;
a[2] = ´b´;
a[3] = ´a´;
document.write(“Array:<br>);
for (i=0;i<a.length;i++)
{document.write(“a(“ + i + “) hat denn wert:“+a[i] +“<br>“);}
</script>
Die Version die ich nun zeige kann mit ganzen Namen versehen werden was ich persönlich einfach besser Managen kann
Code:
<script type= “text/javascript“>
a = new objekt () ;
a[“Name“] = `Richter`;
a[“Vorname“] = `Ole`;
a[“Ort“] = `Hamburg`;
document.write(“Array:<br>“);
for (var x in a)
{document.write(“a(“ + x + “) hat den Wert: “
a [x] + “<br>“);}
</script>
Code:
<html>
<head>
<title> Grafik auf Hintergrund bewegen </title>
<script language=“javascript1.2“
type= “text/javascript“>
//Anfangsposition festlegen
var xpos=10;
var ypos=10;
document.onekeydown = TasteGedruekt;
function TasteGedrueckt (Ereignis)
{
if (!Ereignis)
Ereignis = window.event;
if (Ereigniss.wich) {
nr = Ereignis.wich;
} else if (Ereignis.keyCode) {
nr = Ereignis.keyCode;
}
if (nr==65) xpos -=5;
if (nr==68) xpos +=5;
if (nr==87) ypos -=5;
if (nr==83) ypos +=5;
document.getElementById(“Grafik“) .style.left
=xpos;
document.getElementById(“Grafik“) .style.top
=ypos;
</script>
</head>
<body bgcolor=´#2222ff´ background=´hintergrund.jpg´>
<font color=´#ff0000´ size´4´><br>
<br>Steuerung mit w,a,s,d <br></font>
<div id=´Grafik´ style=´position:absolute;
z-index:1;left:10;top:10;visibility:visible;´>
<img border=´0´ src=´Grafik.jpg´>
</div>
</body>
</html>
Falls etwas unverständlich ist bitte in denn Kommentaren Eintragen werde es innerhalb einiger tage versuchen besser zu beschreiben.
Für Rechtschreibfehler möchte ich mich entschuldigen.
Ps: Falls Interesse vorhanden ist kann ich ein kompletten Spiele Code erklären hierzu bitte ebenfalls ein Kommentar dalassen
Mit freundlichen Grüßen Kalior
