lehrkraefte:blc:informatik:ffprg1-2023:programming-basics-variables

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Next revision		 Previous revision
lehrkraefte:blc:informatik:ffprg1-2023:programming-basics-variables [2023/02/11 07:06] – created Ivo Blöchligerlehrkraefte:blc:informatik:ffprg1-2023:programming-basics-variables [2023/02/27 09:47] (current) – [Gültigkeitsbereich] Ivo Blöchliger
Line 1: Line 1:
 +===== Variablen =====
 +VariablenNamen bestehen aus Buchstaben, Zahlen und ''$'' und ''_'' und dürfen nicht mit einer Zahl beginnen. Klein/Grossschreibung wird unterschieden.
 +
 +==== Weitere Resourcen ====
 +Basics:
 +  * https://www.w3schools.com/js/js_variables.asp
 +  * https://www.w3schools.com/js/js_datatypes.asp
 +In depth:
 +  * https://developer.mozilla.org/en-US/docs/Learn/Getting_started_with_the_web/JavaScript_basics#variables
 +  * https://developer.mozilla.org/en-US/docs/Glossary/Hoisting
 +
 +==== Datentypen ====
 +
 +Variablen in JavaScript können folgende Dinge speichern:
 +  * Zahlen (nur Dezimalbrüche)
 +  * Strings (Zeichenketten, in Unicode, intern in UTF-16 kodiert).
 +  * Array (Listen)
 +  * Funktionen
 +  * Objects (können als Dictionaries gebraucht werden)
 +JavaScript ist nicht typisiert und der Variablentyp wird je nach Operation automatisch konvertiert.
 +
 +<WRAP todo>
 +Öffnen Sie die Entwickler-Tools im Browser und probieren dort auf der Konsole aus, was folgende Operationen ergeben:
 +  * 6*7
 +  * 6+7
 +  * "6"+7
 +Hintergrund: Ein Operation mit ''+'', in der eine Zeichenkette vorkommt, wandelt den anderen Operanden in eine Zeichenkette um und hängt dann beide aneinander.
 +  * "7"-3
 +Hintergrund: Eine Operation mit ''-'' versucht beide Operanden als Zahlen zu interpretieren und dann als Resultat eine Zahl zu liefern.
 +  * 0.1+0.1+0.1
 +Hintergrund: Dezimalzahlen sind ungenau, weil z.B. $\frac{1}{10}$ nicht als Binärbruch dargestellt werden kann, so wie $\frac{1}{3}$ nicht als Dezimalbruch geschrieben werden kann. Die Anzahl Stellen sind auf 53 binäre Nachkommastellen (ca. 17 dezimale Nachkommastellen) beschränkt. Rechenfehler sind darum unvermeidlich. Darum wenn immer möglich mit ganzen Zahlen arbeiten und sonst nie auf Gleichheit sondern nur ''>'' oder ''<'' prüfen (im ungünstigsten Fall den Betrag der Differenz mit einer Zahl nahe Null vergleichen).
 +  * 0.1+0.1+0.1+0.1+0.1+0.1+0.1+0.1+0.1+0.1
 +  * [1,2]+[2]
 +Quirk von JavaScript
 +  * a=[1,22,333,4444]
 +a ist ein Array (Liste). Die Einträge sind von 0 bis $n-1$ indiziert.
 +  * a[0]
 +  * a[3]
 +  * a[4]
 +  * a[4]=55555
 +  * a[4]
 +  * b={'x':3, 'y':4, 'blabla':5}
 +b ist ein ''object'', vereinfacht gesagt ein Dictionary, mit Einträgen die durch einen String indiziert werden.
 +  * b['x']
 +  * b['hoehe']=42
 +  * b
 +</WRAP>
 +
 +==== Gültigkeitsbereich ====
 +Wird eine Variable einfach so verwendet, ist sie immer **global**, d.h. im gesamten Code sichtbar und auch veränderbar. Vor allem letzteres kann zu unerwünschten Effekten führen. Globale Variablen sind deshalb so weit sinnvoll zu vermeiden.
 +
 +Im Zweifelsfall sind alle Variablen innerhalb einer Funktion mit **let** zu deklarieren. Diese sind dann nur im Block gültig, indem sie deklariert wurden.
 +
 +Konstanten (Variablen, die sich nie ändern) sollten mit **const** deklariert werden. Wird versucht, diese zu verändern, wird ein Fehler produziert.
 +
 +<code javascript>
 +x = 42;      // Globale Variable
 +let y = 23;  // Auch global, weil ausserhalb einer Funktion
 +
 +function hello() {      // hello ist jetzt auch eine globale Variable und könnte verändert werden...
 +  console.log(`Am Anfang der Funktion kann nicht auf x zugegriffen werden, weil x später mit let definiert wird. (ReferenceError: Cannot access 'x' before initialization).  window.x=${window.x}`);
 +  z = 72;       // Globale Variable
 +  let x = 12;   // Lokale Variable (die globale Variable x ist nicht mehr direkt les- und schreibbar, ausser via window.x).
 +  console.log(`Nach Deklaration mit let : x = ${x}, window.x=${window.x}`);
 +  const pi = 3; // Lokale Konstante, kann (und darf) nicht verändert werden.
 +  if (y==23) {
 +     let x = 123;   // Dieses x lebt nur in diesem if-block und hat nichts mit den anderen Variablen x zu tun.
 +     console.log(`im if drin: x = ${x}, window.x=${window.x}`);
 +  }
 +  console.log(`Nach dem if-Block : x = ${x}, window.x=${window.x}`);
 +}
 +console.log(`Vor dem Funtionsaufruf : x = ${x}, window.x=${window.x}`);
 +hello();
 +console.log(`Nach dem Funktionsaufruf : x = ${x}, window.x=${window.x}`);
 +</code>