Informatik-Grundlagen (JS) - TH OWL - eCampus PDF
Document Details
Uploaded by Deleted User
TH OWL
Tags
Related
- Introduction à TypeScript Cours 2 PDF
- Computer Programming 3 - Discussion 2 (1) PDF
- Computer Science - Uncommon Quiz Questions In JavaScript For 2022 PDF
- Javascript Operators & Conditional Statements PDF
- Informatik-Grundlagen (JS): TH OWL - eCampus PDF
- Informatik-Grundlagen (JS) - TH OWL - eCampus PDF
Summary
This document is lecture material for an introductory computer science course. The course covers topics like the structure of a computer, pseudocode, JavaScript programming (variables, branching, loops), HTML programming, information technology basics (number systems, Boolean algebra), algorithm design, and data processing.
Full Transcript
Informatik-Grundlagen (JS) Informatik-Grundlagen (JS) Lehrmaterial der Vorlesungen. Inhalte werden im Laufe des Semesters freigeschaltet Inhalt 1 Aufbau des Kurses 2 Einführung in die Informatik 3 Algorithmus, Pseudocode 4 Computer, Betriebssystem 4.1 Computer 4....
Informatik-Grundlagen (JS) Informatik-Grundlagen (JS) Lehrmaterial der Vorlesungen. Inhalte werden im Laufe des Semesters freigeschaltet Inhalt 1 Aufbau des Kurses 2 Einführung in die Informatik 3 Algorithmus, Pseudocode 4 Computer, Betriebssystem 4.1 Computer 4.2 Betriebssystem 4.3 Scheduling 4.4 Testfragen 5 Grundlagen JavaScript 5.1 Debuggen, Kommentare 5.2 Variablen, Datentypen, Arrays 5.3 Verzweigungen, Schleifen 5.4 Funktionen 5.5 Testfragen 6 Verwalten von Informationen 6.1 Zahlensysteme 6.2 Darstellung von Texten 6.3 Testfragen 7 Boolesche Operatoren 8 Datenstrukturen 9 Suchalgorithmen 10 Daten Senden und Speichern 11 Fehlertolerante Codes 12 Datenkompression 13 Abschluss 14 Testfragen für VL Copyright: Das Lehrmaterial darf nur zu Lernzwecken an der TH OWL verwendet werden. Wenn Sie an einer anderweitigen Nutzung interessiert sind, wenden Sie sich bitte an Prof. Deuter. 1 Aufbau des Kurses Lehrinhalte Als angehende Ingenieurinnen und Ingenieure müssen Sie programmieren können, denn: Programmierung ist das Fundament der Digitalisierung. Sie werden in Ihrem Berufsleben mit kleineren oder größeren Programmieraufgaben zu tun haben, sei es nur die Anpassung eines Programms wie EXCEL durch ein Makro. Zu- dem ist es wichtig, wesentliche Zusammenhänge der Datenverarbeitung zu verstehen. Lernziele Die Studierenden erlangen Grundkenntnisse in der Informatik und der Programmierung. Sie verstehen, wie Informationen digital gespeichert und verarbeitet werden. Sie sind in der Lage, Datenstrukturen und Algorithmen zu entwerfen und selbstständig Programme in JavaScript und HTML zu erstellen. Lehrinhalte Folgende Themen werden im Laufe des Semesters bearbeitet: Aufbau eines Computers Pseudocode Grundlagen der Programmierung in JavaScript (Variable, Verzweigungen, Schleifen) Grafische Programmierung mit HTML Informationstechnische Grundlagen (Zahlensysteme, Boolesche Algebra) Entwurf von Algorithmen, Suchalgorithmen Grundlagen der Datenverarbeitung (Kommunikation, Speicherung, Kompression, fehler- tolerante Codes) Programmier-Umgebung Wir werden in der Programmiersprache JavaScript programmieren. Dafür benötigt man lediglich ei- nen Texteditor und einen Browser. Zum besseren Erstellen und Verwalten von Softwareprojekten werden wir jedoch die Software Visual Studio Code von Microsoft einsetzen. In den PC-Räumen der Hochschule ist diese Software installiert. Es wird allerdings dringend empfohlen, dass Sie sich Visual Studio Code auf Ihrem eigenen PC installieren! Dies ermöglicht die Nachbearbeitung der Übungsauf- gaben bzw. unterstützt Ihr Selbststudium. Die Installation von Visual Studio Code finden Sie hier. Sämtliche Übungsaufgaben an der Hochschule werden mit dem Browser Firefox durchgeführt. Daher empfehlen wir, dass Sie ebenfalls Firefox verwenden. Hinweise zur Prüfung Die Prüfung ist eine E-Klausur mit Fragen, die sich sowohl auf die Theorie als auch auf die Praxis be- ziehen. Die Bearbeitung einer Programmieraufgabe mit JavaScript ist Teil der E-Klausur (Quelltext er- stellen und digital einreichen). Die E-Klausur wird sowohl zum Ende des Wintersemesters (Ende Januar) als auch des Sommerse- mesters (Anfang Juli) angeboten. Bitte bearbeiten Sie kontinuierlich den praktischen Teil dieses Kurses. Dies wird signifi- kant die Chancen für eine gute Note verbessern. Literatur / PDF-Unterlagen Literatur Die Lehrinhalte wurden auf Basis mehrerer Literaturquellen entwickelt und mit den persönlichen Erfahrungen aus der Industrie ergänzt. Die Literatur ist unten genannt und sollte zusätzlich zum Kursmaterial im Selbststudium genutzt werden. Darüber hinaus gibt es zahlreiche weitere Literatur (Bücher, Artikel, Internet etc.) Wenn Sie Lernmaterial finden, mit dem Sie gut zurechtkommen, dann melden Sie sich bitte beim Lehrpersonal. Wir nehmen diese Information gern in die Liste auf. Bewersdorff, J. (2018): Objektorientierte Programmierung mit JavaScript: Direktstart für Einsteiger, Springer Interactive Tutorials, https://www.learn-js.org/ W3Schools Online Web Tutorials: https://www.w3schools.com/ Herold, H.; Lurz, B.; Wohlrab, J. Grundlagen der Informatik, 3. Aufl. Pearson, 2017. Eher was für die ambitionierten "Informatiker". Hier geht es richtig zur Sache. PDF-Unterlagen Es werden keine PDF-Dokumente erstellt und verteilt. Sie können die Inhalte dieses Lernmoduls jedoch jederzeit als PDF speichern. Wählen Sie dazu oben die Option Druckansicht und anschließend einen PDF-Drucker aus. Hinweis: Im PDF wird keine Navigation erstellt. Wir empfehlen Ihnen daher, die Kapitel des Lernmoduls als einzelne PDF-Dateien auszudrucken und auf Ihrem PC zu strukturieren (z.B. 01- Aufbau des Kurses.pdf, 02-Einführung in die Informatik.pdf etc.) Testfragen Prima! Sie haben das Kapitel durchgearbeitet. Überprüfen Sie nun für sich selbst, wie viel Sie verstanden haben und beantworten Sie die folgenden Fragen. Versuchen Sie, die Fragen ohne Nachschlagen zu beantworten! Mit welcher Programmiersprache wird in die- sem Kurs programmiert? C# JavaScript Java C++ Richtig! Auswerten Welche Software wird für die Programmierung in diesem Kurs benötigt? Visual Studio Visual Studio Code Eclipse Excel Richtig! Auswerten 2 Einführung in die Informatik Perspektiven der digitalen Bildung Perspektiven in der digitalen Bildung Digitale Bildung Man kann die digitale Bildung aus drei Perspektiven betrachten: Gesellschaftlich-kulturelle Perspektive: Die Frage »Wie wirkt Digitalisierung auf die Gesellschaft?« adressiert die Auswirkungen der Digitalisierung auf die Gesellschaft. Themen sind z.B. die Auswirkungen von autonom fahrenden LKW für die Berufskraftfahrer, staatliche Gesichtserkennungsmaßnahmen etc. Dieser Fragestellung widmen wir uns nicht in diesem Lernmodul. Anwendungsbezogene Perspektive: Die Frage »Wie nutze ich Digitalisierung?« adressiert den technisch-versierten und verant- wortungsvollen Umfang mit IT-Systemen, z.B. wie nutze ich effektiv ein CAD-System. Über die Anwendung von Visual Studio hinaus widmen wir uns nicht dieser Fragestellung. Technologische Perspektive: Die Frage »Wie funktioniert Digitalisierung?« widmet sich dem Inneren von IT-Systemen: Wie werden sie programmiert? Wie sind sie aufgebaut? etc. Dieser Fragestellung widmet sich das Fach »Informatik Programmierung«. https://dagstuhl.gi.de/dagstuhl-erklaerung/ Industrie 4.0 Industrie 4.0 steht für die Digitalisierung der Industrie. Es wird auch als 4. Industrielle Revolu- tion bezeichnet. Die ersten 3 »Revolutionen« sind schematisch in dem folgenden Bild gezeigt. Grundlage von Industrie 4.0 ist eine massive Vernetzung von und innerhalb von Produktionsprozessen. https://www.youtube.com/watch?v=kQLbVVPNTMQ Industrie 4.0 grundlegend erklärt Recherchieren Sie den Begriff »Industrie 4.0« und be- antworten Sie für sich die Frage, warum Informatik- Kenntnisse für Ingenieure und Ingenieurinnen un- umgänglich sind. Begriffsdefinition "Informatik" Ursprung Informatik umfasst allgemein die automatisierte Informationsverarbeitung in Na- tur, Technik und Gesellschaft. Anfangs waren hauptsächlich Rechenmaschinen zur Zahlenverarbeitung gefragt, heutige Maschinen verarbeiten beliebige Informationen (Texte, Bilder...) Informatik ist Wortbildung aus "Information" und "Automatik" (Eingeführt von Karl Steinbuch Ende der 1950er Jahre) Im Englischen spricht man von Computer Science (nicht von Informatics) Definition Die Wissenschaft der Informatik beschäftigt sich mit Strukturen und Prozessen, die in Form von Daten und Algorithmen repräsentiert werden (können). Diese Pro- zesse werden informatisch modelliert, sodass sie automatisch durchgeführt wer- den (können). Die Systeme, die dazu von der Informatik konstruiert werden, wer- den als Informatiksysteme bezeichnet. Was Sie auf dem Schreibtisch, in der Ta- sche, in Ihrem Auto,... haben, sind Informatiksysteme. Stellungnahme zur Lehrerversorgung Informatik. FG IBN der GI. http://www.researchgate.net/publication/280920203_Schriftliche_Stellungnahme_zur_quantitativen_Erweite Historie der Informatik Abakus Rechenbrett mit Kugeln, meist Holz- oder Glasperlen Nutzung bereits vor mehr als 3000 Jahren in China Durchführbar sind Addition, Subtraktion, Multiplikation und Division, aber auch das Zie- hen von Quadrat- und Kubikwurzeln Historische Meilensteine der Informatik Adam Riese (1492-1559): Rechengesetze zum Dezimalsystem Wilhelm Schickard (1592-1635): Erste Rechenmaschine Blaise Pascal (1623-1662): Rechenmaschine mit 6 Stellen Gottfried W. Leibniz (1646-1716): Maschine für vier Grundrechenarten Philipp M. Hahn (1739-1790): 1. mechanische Rechenmaschine Charles Babbage (1792-1871) – Prinzip der ”Analytical Engine“, 19m lang 3m hochAda Lovelace, erstes Programm Wer sich für Geschichte interessiert, dem sei das Heinz-Nixdorf-Forum (HNF) in Paderborn empfohlen. Viele der hier genannten Aspekte werden dort ausführ- lich und mit spannenden Exponaten dargestellt. Lochkarte Hermann Hollerith (1860-1929) gilt als Erfinder der Lochkarte Maschine zum Auswerten von amerikanischen Volkszählungsstatistiken Abtasten der Lochkarte mit Metallstiften In einem Loch wird Kontakt geschlossen, elektrischer Zähler wird um eins erhöht In 1960er bis 1970er Jahre. Programmspeicherung mit Lochkarten. Im Netz gibt es ein kleines Beispiel zur Funktionsweise von Lochkarten. Bitte le- sen Sie den Text durch und finden Sie die gesuchte Wortfolge: https://inf.gi.de/01/wie-liest-man-loecher Beantworten Sie die Frage, was in der Wortfolge ein Widerspruch zu einer Aus- sage im vorhergehenden Abschnitt ist. Konrad Zuse Erbauer des ersten funktionstüchtigen Computers Verwendung von elektromechanischen Bauteilen (Relais) Z3 (1941): Ca. 2600 Relais und 64 Speicherplätze mit jeweils 22 Bits. Multiplikation in etwa 3 Sekunden. von Neumann Architektur Mitte der 1940er Jahre entwickelte John von Neumann die Fundamentalprinzipien einer Rechenanlage. Rechenwerk, Steuerwerk, E/A, Verbindungen Programm und Daten im Speicher Schritt für Schritt Bearbeitung von Befehlen Bedingte Sprünge und Verzweigungen Basis bis zum heutigen Zeitpunkt Generationen der elektronischen Datenverarbeitung 1. Generation Relais und Röhren, ab 1946, sehr unzuverlässig Gewicht in Tonnen, Energiebedarf in Hunderten von KW, 1000 Rechenoperationen / Sek. 2. Generation Transistoren, ab 1955, zuverlässiger, billiger als Röhren 10.000 Rechenoperationen/Sek. Platz- und Energie-Bedarf auf einen Bruchteil reduziert (einige 100W) 3. und 4. Generation Mikrochips (Transistoren in einem Chip), ab ca. 1962 1971 Intel 4004 Mikroprozessor: alle Transistoren eines Rechners auf einem Chip erst Tischrechner, später CPU: programmierbarer 5. Generation: Parallelverarbeitung und Vernetzung Heutige Rechner Moderne Rechner enthalten Mikroprozessoren mit vielen Millionen Transistoren, Arbeits- speicher mit Millionen von Speicherplätzen (GigaBytes) und bewältigen Millionen von Operationen pro Sekunde. Das Moore’sche Gesetz besagt, dass sich die Packungsdichte der Transistoren auf einem Mikroprozessor in etwa alle 18 Monate verdoppelt. Auszug eines Interviews der Süddeutschen Zeitung mit dem Intel-Chef Pat Gel- singer vom 08. Oktober 2023 Intel-Mitgründer Gordon Moore hat in den 1960er-Jahren vorherge- sagt, dass sich die Zahl von Transistoren auf Chips etwa alle zwei Jahre verdoppeln werde. Das hatte überraschend lange Bestand - aber wie sieht es heute aus, gilt Moore's Law noch? Ich sehe mein Amt bei Intel als Bewahrer von Moore's Law. Wenn ich Re- den halte, sage ich: Solange das Periodensystem noch nicht ausgeschöpft ist, ist Moore's Law noch nicht erledigt. Erst gestern habe ich mit einem un- serer Forscherteams gesprochen. Sie haben mir von einem neuen Material berichtet, das sie mit Silizium zusammenbringen wollen, und ich war begeistert. Was versprechen Sie sich von der neuen Technologie? Wir glauben, dass wir die Leistung von Chips bis zum Ende des Jahrzehnts verzehnfachen können. Die größten Chips enthalten heute etwa 100 Milli- arden Transistoren, und wir glauben, wir können bis 2030 eine Billion Tran- sistoren erreichen - bei etwa demselben Stromverbrauch wie bei den heu- tigen Chips. Teilgebiete der Informatik Gebiete der Informatik Technische Informatik - Grundlagen der Hardware: Mikroprozessortechnik Rechnerarchitektur Rechnerkommunikation Praktische Informatik - Grundlagen der Systemsoftware Programmiersprachen, Compiler und Interpreter Algorithmen und Datenstrukturen Betriebssysteme und Netzwerke Datenbanken Die Inhalte dieses Kurses können der praktischen Informatik zugeordnet werden. Theoretische Informatik – Grundlage für die Anderen Automatentheorie und formale Sprachen Berechenbarkeitstheorie Komplexitätstheorie Angewandte Informatik – Der Computer für den Anwender Wirtschaftliche, kommerzielle Anwendungen Technisch-wissenschaftliche Anwendungen Testfragen Prima! Sie haben das Kapitel durchgearbeitet. Überprüfen Sie nun für sich selbst, wie viel Sie verstanden haben und beantworten Sie die folgenden Fragen. Versuchen Sie, die Fragen ohne Nachschlagen zu beantworten! Welche Aussage beschreibt das Moor'sche Gesetz am besten? Die Anzahl neuer Apps wächst jedes Jahr exponentiell. Alles, was schiefgehen kann, wird auch schiefgehen. Die Packungsdichte der Transistoren auf einem Mikroprozessor wird etwa alle 18 Monate verdoppelt. Richtig! Auswerten Wer gilt als Erfinder der Lochkarte? Hermann Hollerith Konrad Zuse Wilhelm Schickard Richtig! Auswerten Wann ungefähr wurde der Abakus zum ersten Mal genutzt? vor ca. 300 Jahren vor ca. 30 Jahren vor ca. 3000 Jahren Richtig! Auswerten Wer gilt als Erfinder der ersten funktionsfähigen Rechenmaschine? Wilhelm Schickard Konrad Zuse Charles Babbage John von Neumann Richtig! Auswerten 3 Algorithmus, Pseudocode Lösen von Programmierproblemen Grundsätzliche Vorgehensweise Algorithmus Begriff und Eigenschaften Begriff Geht auf den persischen Mathematiker und Astronom Ibn Musa Al-Chwarismi im 9. Jahrhundert zurück. Ist eine Verarbeitungsvorschrift, die von einer Maschine (oder auch von einem Menschen) durchgeführt werden kann. Aus der Präzision der sprachlichen Darstellung des Algorithmus muss die Abfolge der einzelnen Verarbeitungsschritte eindeutig hervorgehen. Legt fest, wie Eingabedaten in einer endlichen Zahl an Schritten in Ausgabedaten umgewandelt werden. Beispiel Backrezept Zum Herleiten der Eigenschaften von Algorithmen soll ein Backrezept dienen. Zutaten: 300g Mehl, 1 TL Backpulver, 300g Butter, 5 Eier, 259g Zucker, 1 Prise Salz, 3 EL Kakaopulver, 1 EL Schokocreme Zubereitung: Butter mit Zucker und Salz schaumig rühren Eier zugeben Backpulver zum Mehl geben und über Eier-Buttermasse sieben... Im Backofen bei 180 Grad 50-60 Minuten backen Kuchen 10min auskühlen lassen Eigenschaften Ein Backrezept hat alle Eigenschaften eines Algorithmus. Die Eingabedaten sind die Zutaten, die Ausgabedaten sind der Kuchen. Die Eigenschaften der schrittweisen Abarbeitung sind: Endlichkeit: Die Beschreibung ist endlich lang Terminierung: Nach Durchführung endlich vieler Anweisungen kommt das Verfahren zum Stillstand. Eindeutige Reihenfolge: Die Reihenfolge der Anweisungen ist festgelegt. Eindeutige Wirkung: Die Wirkung jeder Anweisung und damit der gesamten Folge ist eindeutig festgelegt. Algorithmen sind unabhängig davon, wie sie technisch realisiert werden Algorithmen werden textuell oder grafisch dargestellt werden Ein Beispiel für die textuelle Beschreibung ist das Backrezept. Für die grafischen Beschreibung werden Diagramme genutzt. Beispiele sind: Kontrollflussgrafen, Programmablaufplan Im weiteren Verlauf des Moduls werden wir dies vertiefen Vorgehen beim Entwurf Es gibt grundsätzlich zwei Strategien für den Entwurf von Algorithmen: 1. Top-down Strategie 2. Bottom-up Strategie Top-Down Strategie: Das gegebene Gesamtproblem wird in möglichst einfache Teilprobleme zerlegt, die dann einzeln gelöst werden. Aus den Lösungen dieser Teilprobleme wird dann die Lösung des Gesamtproblems abgeleitet. Diese Strategie wird auch „Divide and Conquer“ genannt. Bottom-Up Strategie: Hierbei besteht das Gesamtproblem aus mehreren Teilproblemen. Diese Teilprobleme werden geeignet zusammengefügt, um eine Lösung des Gesamtproblems zu generieren. Für unsere Übungen ist diese Strategie geeignet. Beispiele Euklidscher Algorithmus Von Euklid ca. 300 v.Chr. gefundene Euklid’sche Algorithmus dient der Bestimmung des größten gemeinsamen Teilers (ggT) zweier natürlicher Zahlen a und b Anmerkung: Euklid kannte noch gar keinen Computer! Der Algorithmus ist: Eingabe Zwei ganze positive Zahlen a und b Ausgabe ggT von a und b Algorithmus Wiederhole folgende Schritte r = Rest der ganzzahligen Division von a:b a=b b=r bis r = 0 ist Gib a aus, da sich nun in a der ggT befindet Beispiel für zwei konkrete Zahlen: Eingabe a = 14, b = 6 Ausgabe ? Algorithmus r = Rest der ganzzahligen Division von 14:6 = 2 a=6 b=2 r = 0? Nein: Wiederholen der Schritte r = Rest der ganzzahligen Division 6:2 = 0 a=2 b=0 r = 0? Ja: Beenden ggT = a = 2 GUI-Algorithmus 1. Bei Klick auf Button „+“ 1. Lies die Zahlen aus den Textboxen ein 2. Addiere die beiden Zahlen 3. Speichere das Ergebnis in einer weiteren Zahl 4. Zeige das Ergebnis an 2. Bei Klick auf Button „-“ 1. … Pseudocode Einführung Wir haben gelernt, dass ein Algorithmus als Text beschrieben werden kann. Die beim Backre- zept gezeigte Möglichkeit ist allerdings nicht geeignet, um von einem Computer abgearbeitet zu werden. Dafür braucht man eine Programmiersprache. Darauf gehen wir gleich ein. Um ein Verständnis von Programmiersprachen aufzubauen, beschäftigen wir uns zunächst mit dem sogenannten Pseudocode. Ein Pseudocode ist eine leicht formalisierte (also nach bestimmten Regeln organi- sierte) textuelle Beschreibung, die bereits wesentliche Merkmale einer echten Pro- grammiersprache enthält. Dies soll an einem Beispiel erläutert werden. Das zu lösende Problem ist "Finde das Minimum einer Zahlenreihe". Gegeben ist: Eine Folge a0, a1,...an-1 von n positiven ganzen Zahlen, (also n > 0) Gesucht: Der kleinste Wert a der gegebenen Zahlen, d.h. a = min(a0,....an-1) Zur Lösung des Problems wird folgende Strategie verwendet: Durchlaufe die Elemente der Folge und merke den bisher kleinsten Wert Diese Form des Algorithmus ist aber zu ungenau, um von einem Computer ausgeführt werden zu können (vergleiche mit den Eigenschaften eines Algorithmus). Besser ist folgende, noch im- mer für einen Menschen gut verständliche Darstellung. Setze merker auf a0; Setze i auf 0; Solange i < n ist, fuehre aus: Wenn ai < merker, dann Setze merker auf ai; Erhoehe i um 1; Gib merker zurueck; Pseydocode.mp4 Video zur Erläuterung des Algorithmus Achtung: Das erste Element in einer Folge hat den Index "0", daher setzen wir i = 0 am Anfang des Algorithmus Grundelemente der Programmierung (Erläuterung als Pseudocode) Variable Die im oben gezeigten Algorithmus gemerkte Zahl wir durch merker präsentiert. merker ist eine sogenannte Variable. Eine Variable ist ein "Behälter" bzw. eine "Speicherzelle", die zur Auf- nahme eines Wertes dient. Setze merker auf a0; Setze i auf 0; Bzw. die Kurzschreibweise, die wir ab jetzt verwenden werden merker = a0; i = 0; Wichtig: Die Wertzuweisung erfolgt immer von rechts nach links, d.h. nur die Variable, die links neben dem Gleichheitszeichen steht, ändert sich, nicht die Variable, die rechts daneben steht. Beispiel: a = 0; b = 1; a = b; Welchen Wert haben a und b am Ende dieses kurzen Algorithmus? Die Antwort ist: a ist 1, b bleibt 1. Es ändert sich also a, und nicht b. Die klingt trivial, dies zu verinnerlichen ist aber wichtig. Dies ist ein Grundprinzip der Programmierung! Anweisung (Statement) Zeilen wie i = 0; nennt man Anweisungen. Eine Anweisung ist eine Aufforderung an den Computer: Bitte mach das (in dem Fall weise der Variablen i den Wert Null zu). Es gibt unendliche viele mögliche An- weisungen (Zeige Fehlermeldung, Multipliziere zwei Variablen, Warte für 1s usw.) Eine Anweisung endet immer mit einem »Stoppzeichen«, oftmals ist das ein Semikolon. Einfa- che Anweisungen haben keine Bedingungen: Sie werden ausgeführt, sobald der Programmab- lauf diese Anweisung bearbeitet. Sollen Anweisungen nur unter bestimmten Bedingungen aus- geführt werden, spricht man von bedingten Anweisungen. Bedingte Anweisung Wenn/Dann (Conditional Statement if/else) Bedingte Anweisungen werden im Pseudocode durch wenn und eine Bedingung eingeleitet. Eine Bedingung ist im Prinzip eine Abfrage (z.B. Hat ein Anwender die Hauptstadt von Deutsch- land richtig benannt?). Eine Bedingung hat zwei Werte: Erfüllt oder nicht erfüllt bzw. in der Programmierung spricht man von wahr (true) und falsch (false) Falls die Bedingung erfüllt ist, wird die hinter dann stehende Anweisung ausgeführt. Optional kann eine alternative Anweisung ausgeführt werden, die hinter sonst steht. Schreibweise: 1 Wenn Bedingung, dann 2 Anweisung1; 3 Sonst 4 Anweisung2; Das folgende Beispiel sieht schon mehr nach Programmierung aus, ist aber inhaltlich identisch zum obigen Beispiel 1 if (Bedingung) 2 { 3 true-Anweisungen 4 } 5 else 6 { 7 false-Anweisungen 8 } 9 10 //Einfachauswahl: Wenn die Bedingung wahr ist (z.B. Hauptstadt von Deutschland ist Berlin), dann bearbeite Anw 11 //in der ersten Klammer(true-Anweisungen). 12 13 //Wenn nein, (jemand hat eine andere Stadt angegeben) 14 //dann bearbeite Anweisungen in der zweiten Klammer (false-Anweisungen) Schleife (Loop) Eine Schleife hat die Aufgabe, bestimmte Anweisungen mehrmals auszuführen. Wie oft dies ge- schieht, hängt von der sogenannten Abbruchbedingung ab, die hinter dem Wort solange steht. Welche Anweisungen innerhalb der Schleife ausgeführt werden sollen, wird hinter dem Schlüsselwort fuehre aus angegeben. Handelt es sich um mehrere Anweisungen, spricht man von einem Block. Die An- weisungen, die zu einem Block gehören, werden durch geschweifte Klammern "{ }" eingefasst. 1 Solange Bedingung, führe aus 2 Anweisung1 3 4 //Beispiel 5 a = 1; 6 i = 0; 7 8 Solange i < 5, führe aus 9 { 10 a = a - 1; 11 i = i + 1; 12 } Übung für das Verständnis einer Schleife Beantworten Sie die Frage: Welche Werte haben die Variablen a und i am Ende die- ses Algorithmus? Die Tabelle zeigt die Antwort. Nummer des i zu Beginn des i zum Ende des Wert von Durchlaufs Durchlaufs Durchlaufs a 1 0 1 0 2 1 2 -1 3 2 3 -2 4 3 4 -3 5 4 5 -4 Zum Beantworten der Frage zeigt die Tabelle die Änderungen der Werte von a und i für jeden einzelnen Durchlauf. Die Schleife wird 5-mal durchlaufen. Die Antwort ist da- her: i = 5 und a = -4 PseydocodeSchleife.mp4 Video zur Erläuterung (Durchlauf bis i < 3) Das folgende Beispiel sieht schon mehr nach Programmierung aus, ist aber inhaltlich identisch zum obigen Beispiel 1 for(begin, condition, step) 2 { 3 Anweisung 1; 4 Anweisung 2; 5 } 6 7 //Setze einen Zählwert auf begin. 8 //Führe die Anweisungen in der Klammer so lange aus, 9 //wie die condition wahr ist. Ändere den Zählwert gemäß 10 //Anweisung in step mit jedem Durchlauf 11 12 Beispiel 13 for{counter=1, counter < 10, counter++} 14 { 15 Anweisung 1; 16 Anweisung 2; 17 } Funktion (Function) Eine Funktion ist eine Stelle im Programm, auf die gezielt hingesprungen werden kann. In der GUI-Programmierung ist dies zum Beispiel die Stelle, auf die bei einem Klick auf einen Button gesprungen wird. Funktionen haben den Zweck, wiederkeh- rende Aufgaben an einer Stelle zu konzentrieren. Im späteren Verlauf des Semes- ters gehen wir noch intensiv auf Funktionen ein. 1 Funktion_PlusButtonClicked 2 { 3 zahl1 = Inhalt von Textbox1; 4 zahl2 = Inhalt von Textbox1; 5 Ergebnis = zahl1 + zahl2; 6 } 7 8 Funktion_MinusButtonClicked 9 { 10 zahl1 = Inhalt von Textbox1; 11 zahl2 = Inhalt von Textbox1; 12 Ergebnis = zahl1 - zahl2; 13 } Rückgabewert (Return) Die letzte Anweisung des Algorithmus, die mit gib beginnt, ist die sogenannte Rückgabeanwei- sung. Sie liefert den Wert, der in der Variablen merker gespeichert ist, zurück. Wurde der Algo- rithmus innerhalb einer Sprungstelle, d.h. einer Funktion (unten im Beispiel Funktion_Minimum) ausgeführt, so gibt die Rückgabeanweisung den Wert an die aufrufende Funktion (unten im Bei- spiel Funktion_Aufrufstelle) zurück. Funktion_Minimum() { merker = a0; i = 0; Solange i < n ist, fuehre aus: { Wenn ai < merker, dann { merker = ai; } i = i + 1; } Gib merker zurueck; } Funktion_Aufrufstelle { minimum = 0; minimum = Funktion_Minimum() } In vielen Programmiersprachen wird das Schlüsselwort return verwendet, um ei- nen Wert zurückzugeben. Folgen (Array, List) Eine Folge ist eine Auflistung von endlich vielen Variablen (beispielsweise Zahlen). Ist n die Anzahl der Glieder einer endlichen Folge, so spricht man von einer Folge der Länge n. Die Variable mit der Nummer i, man sagt hier auch: mit dem Index i, wird i-tes Element der Folge genannt. In der Programmierung hat das erste Element eine Folge immer den Index 0. Folg- lich hat das letzte Element immer den Index n-1. Beispiel: Eine Folge a natürlicher Zahlen mit der Länge n = 6: a = {11, 7, 8, 3, 15, 13} Die einzelnen Elemente dieser Folge sind: a0 = 11 a1 = 7... an-1 = 13 Sequentielle Abarbeitung Die Abarbeitung von Code erfolgt schrittweise nacheinander (sequentiell). Innerhalb einer Funk- tion ist dies also "von oben nach unten". Wenn der Algorithmus auf eine Funktion springt, wird die Abarbeitung in dieser Funktion fortgesetzt. Nach der Rückgabeanweisung springt der Algo- rithmus wieder an die Stelle, an der die Funktion aufgerufen wurde. Das folgende Bild erläutert diese Aussage. Die Reihenfolge der Anweisungen wird durch deren Nummerierung angegeben. Programmiersprachen Einführung Texte (Briefe, E-Mail) werden in einer Sprache geschrieben (Deutsch, Englisch,...) Möglichkeiten der Sprache werden durch ihre Grammatik bestimmt Computerprogramme werden in einer Programmiersprache geschrieben Ihre Grammatik wird Syntax genannt "Die Syntax definiert, wie Sprachelemente zusammenhängen und verwendet wer- den dürfen." Ein Programm besteht aus vielen Sprachelementen, die dem Programm eine Bedeutung geben, die Semantik "Die Semantik ist die Bedeutung des Programms." Übersetzungsvorgang Programmiersprachen werden nicht direkt durch einen Computer verstanden. Daher ist eine Übersetzung des Programmcodes in sogenannten Maschinencode notwendig. Danach ist ein ausführbares Programm verfügbar (z.B. EXE auf Windows Betriebssystemen). Wenn es sich um eigenständige ausführbare Programme handelt, wird der Programmcode in Maschinencode mithilfe eines sogenannten Compiler übersetzt. Der Compiler hat auch die Auf- gabe, die Syntax des Programmcodes auf Richtigkeit zu überprüfen. Anmerkung: Der Pro- grammcode wird auch "Quelltext", "Source Code" auch nur "Code" genannt. Der schematische Ablauf des Übersetzungsvorgangs zeigt das folgende Bild. Dieses Vorgehen gilt z.B. für die Programmiersprache C# Das folgende Video zeigt bildhaft die Funktionsweise eines Compilers. Das Video wurde im HNF Paderborn aufgenommen. Funktionsweise eines Compilers JavaScript (wie wir es in diesem Kurs verwenden werden) wird nicht direkt ausge- führt, sondern vom Browser on-the-fly gelesen und interpretiert. Es erfolgt also keine Übersetzung in Maschinencode. Beispiele Es gibt hunderte Programmiersprachen! Hier ein paar wichtige bzw. in der Industrie häufig ge- nutzte Programmiersprachen: Auswahlkriterien Bestehende Programmier- und Nutzungsgewohnheiten Vorgaben der Zielumgebung (z.B. bei SAP gilt die Programmiersprache ABAP) Unabhängigkeit vom Betriebssystem Vorgeschriebene Standards in den Unternehmen JavaScript Wikipedia schreibt JavaScript (kurz JS) ist eine Skriptsprache, die ursprünglich 1995 von Net- scape für dynamisches HTML in Webbrowsern entwickelt wurde, um Be- nutzerinteraktionen auszuwerten, Inhalte zu verändern, nachzuladen oder zu generieren und so die Möglichkeiten von HTML zu erweitern. Heute wird JavaScript auch außerhalb von Browsern angewendet, etwa auf Ser- vern und in Microcontrollern. Der heutige Name der ursprünglich LiveScript genannten Sprache ent- stand 1996 aus einer Kooperation von Netscape mit Sun Microsystems. Deren Java-Applets, erstellt mit der gleichfalls 1995 veröffentlichten Pro- grammiersprache Java, wurden mithilfe von LiveScript in den Netscape Na- vigator integriert. Um die Popularität von Java zu nutzen, wurde LiveScript in JavaScript umbenannt, obwohl die beiden Sprachen voneinander unab- hängig entwickelt wurden und völlig unterschiedliche Grundkonzepte aufweisen. Testfragen Prima! Sie haben das Kapitel durchgearbeitet. Überprüfen Sie nun für sich selbst, wie viel Sie verstanden haben und beantworten Sie die folgenden Fragen. Versuchen Sie, die Fragen ohne Nachschlagen zu beantworten! Welches der folgenden Elemente ist kein Grundele- ment des Pseudocodes? Schleife Variable Bedingte Anweisung Funktion Wirkstelle Richtig! Auswerten Ist ein Algorithmus abhängig von einer Programmiersprache? Ja Nein Kann man nicht so genau sagen Richtig! Auswerten Welche der folgenden Aussagen über Compiler ist richtig? Ein Compiler wandelt...... Maschinencode in Quelltext.... C++ in Java.... Quelltext in Maschinencode. Richtig! Auswerten 1 b = 0; 2 i = 0; 3 4 Solange i 2 3 5.2 Variablen, Datentypen, Arrays Variable Begriff Die Variable ist eines der wichtigsten Elemente in der Programmierung. Eine Variable besteht aus einem Namen und einem Wert. Darüber hinaus haben Variablen auch einen Datentyp (Erläuterung im nächsten Abschnitt) Der Wert kann sich ändern, daher der Begriff "Variable". Der Name der Variable kann nicht geändert werden, sobald der einmal festgelegt wurde. Es ist allerdings möglich, zwei Variablen gleich zu benennen, sofern sie in einem an- deren Geltungsbereich deklariert werden. Wir kommen darauf später zu sprechen im Abschnitt Funktionen Die erstmalige Einführung einer Variablen im Programm heißt Deklaration Deklaration von Variablen 1 //assign the value 1 to variable x 2 let x = 1; 3 4 //assign the value x + 1 to variable x 5 let y = x + 1; 6 7 //add the variables x and y and assign the result to variable z 8 let z = x + y; Variablen müssen immer vor der Verwendung deklariert werden. Die Verwendung von unbekannten Variablen führt zu einem Programmfehler. Neben dem Schlüsselwort let gibt es weitere Möglichkeiten, Variablen zu deklarieren und zwar: Automatisch (ohne Schlüsselwort) Schlüsselwort var Schlüsselwort const Das Schlüsselwort var wurde von 1995 bis 2015 im gesamten JavaScript- Code verwendet. Die Schlüsselwörter let und const wurden 2015 zu JavaScript hinzugefügt. Das Schlüsselwort var sollte nur in Code verwendet werden, der für ältere Browser geschrieben wurde. Auf die automatische Deklaration (ohne Schlüsselwort) sollte ganz ver- zichtet werden. Verwenden Sie const, wenn der Wert nicht geändert werden soll. Wir verwenden in den Übungen das Schlüsselwort let (ggf. auch mal const). Die Verwendung ohne Schlüsselwort ist mittlerweile unüblich, die Verwendung von var ist veraltet. Block Eine Zeile im Programm wird auch Anweisung genannt. Eine Anweisung kann aus einer einzigen Codezeile mit Semikolon am Ende oder einer Folge von ein- zeiligen Anweisungen in einem Block bestehen. Ein Anweisungsblock ist in ge- schweifte Klammern {} eingeschlossen und kann geschachtelte Blöcke enthalten (siehe Beispiel unten). Am Ende eines Anweisungsblocks steht kein Semikolon. Tipp: Sie können sich wie folgt merken, wann ein Semikolon verwendet wird und wann nicht: Immer wenn eine geschweifte Klammer { folgt, dann wird kein Semikolon gesetzt Beispiele: for() { } if() { } Datentypen Begriff Ein Datentyp bestimmt, was in einer Variablen gespeichert werden kann, also ob eine Zahl, ein Text, ein Datum etc. Der Datentyp definiert den möglichen Wertebereich [von]..[bis] einer Variablen Bei Festlegung des Datentyps ist der mögliche Wertebereich "zu erahnen", um spätere Probleme zu vermeiden. Siehe Beispiel "Jahr 2000 Problem". Eine Variable eines Datentyps kann in eine Variable eines anderen Datentyps konvertiert (umgewandelt) werden. Beispiel "Jahr 2000 Problem" Als die ersten Programme in den 1960er/1970er entstanden (Banken-Software, Flugbuchungssysteme etc.) nutzte man nur zwei Ziffern, um eine Jahreszahl anzu- geben, z.B. 74 für 1974. Die Gründe dafür lagen hauptsächlich im limitierten Spei- cherplatz der damaligen Computer. Aber, man konnte sich auch nicht wirklich vor- stellen, dass diese Programme noch im Jahr 2000 genutzt werden würden. Aber, so war es: Es näherte sich das Jahr 2000 und plötzlich realisierte man, dass eine 2-ziff- rige Jahresangabe doppeldeutig sein würde. Eine 74 könnte in Zukunft also 1974 oder 2074 bedeuten. Es mussten daher große Anstrengungen unternommen wer- den, um die existierenden Programme anzupassen. Siehe auch Wikidepia. Datentypen in JavaScript JavaScript hat 8 Datentypen: String Number BigInt Boolean Undefined Null Symbol Object The object data type kann enthalten: 1. Ein object 2. Ein array 3. Ein date Beispiele: 1 // Numbers: 2 let length = 16; 3 let weight = 7.5; 4 5 // Strings: 6 let color = "Gelb"; 7 let lastName = "Schmidt"; 8 9 // Booleans 10 let x = true; 11 let y = false; Eine JavaScript-Variable kann jeden Datentyp enthalten. Der Datentyp wird automa- tisch durch den zugewiesenen Wert bestimmt (anders als in stark-typisierten Pro- grammiersprachen). Der Datentyp einer Variable kann sich zur Laufzeit ändern! Au- ßerdem kann sowohl der Datentyp als auch der Wert zurückgesetzt werden. Beispiel 1 let x; // Now x is undefined 2 x = 5; // Now x is a Number 3 x = "John"; // Now x is a String 4 5 x = undefined; // Value is undefined, type is undefined JavaScript Zahlen sind immer ein Typ, und zwar: double (64-bit floating point). Das heißt, für jede Zahl (egal ob ganzzahlig, boolean, Kommazahl, werden immer 64bit im Speicher reserviert. Ausnahme ist der Datentyp BigInt, der größere Zahlen speichern kann. Datentypen in C# Anders als JavaScript, ist C# eine stark typisierte Programmiersprache. D.h. der Da- tentyp einer Variable muss explizit bei der Deklaration genannt werden. Eine Um- wandlung zwischen Variablen mit unterschiedlichen Datentypen ist oftmals nur durch eine sogenannte Konvertierung möglich. Arrays Begriff Im Pseudocode haben wir bereits Folgen kennengelernt. In JavaScript benutzt man die- sen Begriff nicht, man spricht von einem Array Ein Array (Englisch für Feld) ist ein ein- oder mehrdimensionales Element zum Verwalten von Variablen Analogie zur Mathematik 1 ⎛ ⎞ Eindimensionales Array - Vektor ⎜ 2 ⎟ ⎝ ⎠ 3 7 8 Zweidimensionales Array -> Matrix ( ) 5 6 Arrays vereinfachen die Verwaltung zusammenhängender Variablen Dabei können in JavaScript die Variablen unterschiedliche Datentypen haben (zur Ver- einfachung, werden wir in diesem Kurs nur mit Array desselben Datentyps arbeiten. Vielleicht hilft Ihnen dieses Bild, um besser zu verstehen, was ein Array ist. In der analogen Welt werden CD in einer CD-Box gut strukturiert aufbewahrt. Dies ist viel besser, als die CD lose ungeordnet abzulegen. Außerdem kann die CD-Box nur CD enthalten (nur einen Datentyp), also keine Schallplatten oder Musikkassetten. Arrays in JavaScript 1 //One variable per weekday, which is not optimal 2 let monday = "Monday"; 3 let tuesday = "Tuesday"; 4 let wednesday = "Wednesday"; 5 let thursday = "Thursday"; 6 let friday = "Friday"; 7 let saturday = "Saturday"; 8 let sunday = "Sunday"; 9 10 //Better to declare an array, which holds all weekdays 11 //Use following syntax 12 const weekdays = ["Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday", "Sunday"]; 13 14 //Assign the "Wednesday" to a new variable 15 let day = weekdays; Wichtiges über Arrays: Variablen werden in einem Array mit einem Index adressiert (z.B. für Mitt- woch ist der Index = 2) let wednesday = weekdays; Arrays sind nullbasiert, d.h. die erste Variable wird über den Index = 0 adressiert (vgl. Folgen in Pseudocode). let monday = weekdays; Die Länge von Arrays kann wie folgt ermittelt werden: let numOfWeekday = weekdays.length; Das letzte Element wird mithilfe der Länge adressiert let sunday = weekdays[weekdays.length - 1]; Größe der Arrays kann dynamisch sein, man kann weitere Elemente hinzufügen. weekdays = "Another Day"; Mehrdimensionale Arrays Es gibt auch mehrdimensionale Arrays. In diesem Kurs gehen wir allerdings nicht näher darauf ein. Ein Beispiel: 1 //Create a two dimension 2 let myArray = [ [1, 2, 3], 3 [4, 5, 6], 4 [7, 8, 9] 5 ]; 6 7 let element = myArray; // gets the value in the second row, third column (6) 5.3 Verzweigungen, Schleifen if-Anweisung/Kontrollflussgraph Verzweigung mit einfacher if-Anweisung Bedingte Anweisungen: Verzweigung mit if-Anweisung Bei einer bedingten Anweisung wird prüft, ob ein bestimmter Code ausgeführt wer- den soll oder nicht bzw. ob einer optionaler Code ausgeführt werden soll Wenn (if)... dann (then)... sonst (else)... optional if-Anweisung ist eine häufig verwendete bedingte Anweisung. In einer if-Anweisung wird ein boolescher Ausdruck (wahr/falsch) geprüft. Wenn heute Montag ist, dann... Bedingte Anweisungen in JavaScript: Einfache if-Anweisung 1 let x = 4; //Assign a value to x 2 let y = 0; //Declare another variable 3 4 if(x < 4) //Check a certain condition, which is either true or false 5 { 6 y = 8; 7 } Boolescher Ausdruck für Bedingungen Die Bedingung einer Verzweigung ist ein boolescher Ausdruck. Ein boolescher Ausdruck ist eine Formel, in den Operanden durch Operatoren (z.B. Vergleichsoperatoren) verknüpft sind. Ein boolescher Ausdruck ist entweder wahr (true) oder falsch (false). Beispiele: 3 == 7 //hat den Wert false 3 != 7 //hat den Wert true i < n //true, wenn Wert von i kleiner als Wert von n, sonst false Wichtige Vergleichsoperatoren in JavaScript sind: == ist gleich (Werte werden verglichen, wenn Number mit String verglichen wird, true wenn beide dieselbe Zahl enthalten) === ist gleich (Werte und Datentypen werden verglichen, nur true wenn z.B. Number mit Number verglichen wird und beide dieselbe Zahl enthalten) >= ist größer gleich ist größer Stellen Sie den Wahrheitswert folgender Bedingun- gen fest: 1. 3/2 > 5 2. 5*2 == 30/3 3. (100*10)/1000 != 1 Kontrollflussgraph Ein Kontrollflussgraph zeigt den sogenannten Kontrollfluss eines Programms, der theoretisch möglich ist. D.h. er zeigt alle möglichen Wege auf, die ein Programm durchlaufen kann. Ein Kontrollflussgraph enthält Knoten (engl.: nodes) und gerich- tete Kanten (engl.: edges). Das Beispiel zeigt den Kontrollflussgraphen einer if-Anweisung. Sie enthält 4 Knoten und 4 Kanten. Der Knoten n4 steht exemplarisch für die Anweisung, die nach der if-Anweisung folgen würde. In einem konkreten Programmablauf ist aber immer nur ein Kontrollfluss mög- lich! In dem Beispiel der if-Anweisung folgt also dem Knoten n2 entweder n3 oder n4, beides gleichzeitig geht nicht. Für diese Lehrveranstaltung gelten folgende Regeln beim Zeichnen von Kontrollflussgraphen: Der erste Knoten ist die erste Anweisung in der Funktion, der letzte Knoten das return (so- fern gezeigt). Jedes if, else, for... ist ein eigener Knoten Allein stehende Klammern sind keine Anweisungen, daher haben sie keinen Knoten. In der Informatik gibt es etliche Alternativen zum Kontrollflussgraphen. Das sind z.B. Struktogramme und Programmablaufpläne. Damit werden wir uns aber damit in diesem Kurs nicht beschäftigen. Verzweigung mit if-Anweisung mit Alternativen Bedingte Anweisungen in JavaScript: if-Anweisung mit einer Alternativen 1 let x = n; 2 3 if(x das Attribut onclick ergänzt. Die Syntax ist wie folgt: 1 2 3 Text auf dem Button 1 function printResult(){ 2 //tue etwas 3 } Der Funktion, die bei onclick aufgerufen werden, kann auch ein Parameter übergeben werden. Dafür gibt es syntaktisch mehrere Möglichkeiten. Wir werden in den Übungen folgende Syntax nutzen: 1 2 4 Text auf dem Button 1 function printResult(param1){ 2 //der interne Name des Parameters ist param1 3 // er kann wie eine Variable genutzt werden, z.B. 4 let x = 0; 5 let y = x + param1, 6 } Lokale und globale Variablen Variablen, die innerhalb einer JavaScript-Funktion deklariert werden, sind für die Nutzung innerhalb der Funktion begrenzt und werden lokale Variable genannt. Auf lokale Variablen kann also nur innerhalb der Funktion zugegriffen werden. Da lokale Variablen nur innerhalb ihrer Funktionen erkannt werden, können Varia- blen mit demselben Namen in verschiedenen Funktionen verwendet werden. Lo- kale Variablen werden beim Start einer Funktion erstellt und nach Beendigung der Funktion wieder gelöscht. 1 // code here can NOT use carName 2 3 function myFunction() 4 { 5 let carName = "Volvo"; 6 // code here can use carName 7 } 8 9 // code here can NOT use carName Der Gültigkeitsbereich einer Variablen bezeichnet die Ab- schnitte eines Programms, in dem die Variable genutzt werden kann, bzw. in der sie für den Compiler sichtbar ist. Man spricht daher auch vom Sichtbarkeitsbereich. Eine Variable ist in dem Block, in dem sie deklariert ist, sowie in allen Unterblöcken diese Blocks gültig, d.h. verwendbar. Variablen, die außerhalb einer Funktion deklariert werden, nennt man globale Variablen. In Abhängigkeit von der Stelle, an der die globale Varia- blen deklariert werden, kann deren Gültigkeitsbereich mehrere Software- Module umfassen. Erläuterung Gültigkeitsbereich (Quelle: Wikipedia) Kurze Übung Identifizieren Sie die lokalen und globalen Variablen in dem gezeigten Beispiel. 1 let x = 0; 2 3 function myFunction() 4 { 5 let y = 0; 6 7 while (y < 10) 8 { 9 let z = 1; 10 x++; 11 y = x + z; 12 } 13 } 5.5 Testfragen Prima! Sie haben das Kapitel bearbeitet. Prüfen Sie nun für sich selbst, wieviel Sie vom Inhalt verstanden haben. Versuchen Sie die Fragen ohne Nachschlagen zu beantworten! Was ist der Unterschied zwischen einer while-Schleife und einer do/while Schleife? Eine while-Schleife wird mindestens einmal durchlaufen, eine do/while-Schleife nicht unbedingt. Eine do/while Schleife wird mindestens einmal durchlaufen, eine while-Schleife nicht unbedingt. Keine der beiden Schleifen wird mindestens einmal durchlaufen. Richtig! Auswerten Welche der folgenden Aussagen über Parameter ist richtig? Ein Parameter.... ist eine lokale Variable in einer Funktion... ist der Rückgabewert einer Funktion... ist ein Eingangswert einer Funktion. Richtig! Auswerten Welche der folgenden Aussagen über eine if-Bedin- gung sind richtig? Sie.....ist entweder wahr oder falsch....kann mehrere mathematische und Vergleichsoperationen kombinieren...beschreibt eine exponentielle Berechnungsformel. Richtig! Auswerten Ordnen Sie die Schleifenarten dem richtigen Schlüs- selwort zu, mit dem Schleifen in JavaScript erstellt werden können. Anordnung zurücksetzen do/while for while Kopfgesteuerte Schleife Zählschleife Fußgesteuerte Schleife Richtig! Auswerten Welche der folgenden Aussagen über Datentypen sind richtig? Ein Datentyp......gibt an, von welcher Art die Daten sind, die mit ihm beschrieben werden....ist ein Typ, der mit Daten arbeitet....zeigt an, dass eine bedingte Anweisung folgt....beschreibt den Wertebereich von Variablen. Richtig! Auswerten Mit welchem Index greifen Sie in JavaScript auf das erste Element in einem Array zu? Mit Index 0 Richtig! Auswerten Welche der unten genannten Begriffe sind gültige Datentypen in JavaScript? Boolean Real Object String Number Index List Float Richtig! Auswerten 1 function GefuehlteTemperatur(temperatur) 2 { 3 let gefuehlt = ""; 4 5 if(temperatur 10 && temperatur S S -> N Die Beschreibung als Positionssystem Die Basiszahl ist 2. Eine natürliche Zahl n wird durch folgende Summe dargestellt: n= ∑ bj * 2i N −1 i=0 b = Ziffern (bj ∊ ℕ0, 0 ≤ bj < 1) N = Anzahl der Stellen Beispiel: 12 = 1*23+ 1*22 + 0*21 + 0*20 Darstellung als Dualzahl: 1100 Übung Wandeln Sie folgende Dualzahlen in Dezimalzahlen 00111100 11111111 10001000 Hexadezimalsystem Neben dem Dualsystem ist in der Informatik noch das Hexadezimalsystem wichtig, da es ebenfalls in einer engen Beziehung zum Dualsystem steht. Es gilt nämlich: 24 = 16. Die Beschreibung als Positionssystem Die Basiszahl ist 16. Ziffernvorrat: 0,1,2,3,4,5,6,7,8,9,A,B,C,D,E,F Eine natürliche Zahl n wird durch folgende Summe dargestellt: n= ∑ bj * 16i N −1 i=0 b = Ziffern (bj ∊ ℕ0, 0 ≤ bj < F) N = Anzahl der Stellen Beispiel: 28 = 1*161+ C*160 Darstellung als Hexaldezimalzahl: 1C(16) Hexadezimalzahlen können wie Dezimalzahlen aussehen! Beispiel: 11 11(16) = 17(10) Die 11 im Hexadezimalsystem ist eine 17 im Dezimalsystem! Achten Sie also immer darauf, um welches Positionssystem es sich bei der Darstellung einer Zahl handelt. Zahlensysteme in JavaScript Wenn in JavaScript eine ganze Zahl nicht gesondert gekennzeichnet ist, dann han- delt es sich um eine Dezimalzahl. Um anzuzeigen, dass es sich um eine Hexadezimalzahl handelt, wird ein 0x vorgestellt. Um anzuzeigen, dass es sich um eine Dualzahl handelt, wird ein 0b vorgestellt. Maßeinheiten in der Informatik Zahlensysteme: Duale Größenangaben (gebräuchlich!) Basierend auf dem Dualsystem haben sich die allgemein bekannten Größenangaben wie Bit, Byte etc. etabliert. Doch was sagen diese Größenangaben genau aus? Ein Bit ist eine einzelne Binärstelle (0 oder 1), die ein Rechner speichert. Abkürzung für "BInary digiT". Kleinste Informationseinheit, die ein Computer verarbeiten kann. Ein Byte sind 8 Bit. Zum Beispiel: 10011001 Ein WORD sind 16 Bit bzw. 2 Byte. Diese Größenangabe ist in der sogenannten em- bedded Programmierung gebräuchlich. Wir werden dies nicht weiter verwenden. Die Definitionen der weiteren, uns bekannten Maßeinheiten zeigt die folgende Tabelle. Quelle: Herold, H.; Lurz, Wohlrab, J.: Grundlagen der Informatik, Pearson, 2. Aufl., 2012. Die Maßeinheiten sind also immer Potenzen der Zahl 2. Wie Ihnen vielleicht auffällt, weicht die Definition von Kilo (=1024) von der sonst üblichen Definition (=1000) ab. Duale Größenangaben (normiert) Um diese "Unregelmäßigkeit" zu korrigieren, wurde der Versuch gestartet, die binären Maßein- heiten den dezimalen Maßeinheiten anzupassen. Für die Maßeinheiten der 2er Potenzen wur- den die Präfixe "Kibi", "Mebi" etc. eingeführt. Siehe dazu folgende Tabelle. Quelle (2024): https://www.pcgameshardware.de/Neue-Technologien-Thema- 71240/Specials/PCGH-Basiswissen-im-Video-Was-unterscheidet-Gigabyte-und-Gibi- byte-605340/GByte-605340/ Diese Standardisierung konnte sich bislang nicht durchsetzen! In diesem Kurs nut- zen wir die in der Informatik üblichen Maßeinheiten (1 KByte = 1024 Bytes etc.) Umwandlung zwischen Zahlensystemen Es besteht in der Informatik immer wieder die Notwendigkeit, die Darstellung von Zah- len von einem Zahlensystem in ein anderes Zahlensystem umzuwandeln. Die nächsten Abschnitte erläutern, wie dabei vorzugehen ist. Umwandlung von Dual- in Hexadezimalsystem Um eine im Dualsystem dargestellte Zahl ins Hexadezimalsystem zu konvertieren, bildet man von rechts beginnend so genannte Dualtetraden (Vierergruppen). Für jede Vierergruppe wird dann genau eine Hexadezimalzahl ermittelt Beispiel 1100100110001111(2) C98F(16) Vierergruppen 1100 1001 1000 1111 Hexadezimalsystem C 9 8 F Kurze Übung Wandeln Sie folgende Dualzahlen in Hexadezimal- zahlen. Nutzen Sie jeweils Vierergruppen 00111100 11111111 10001000 Umwandlung von Dezimal- in Dualsystem Um eine Dezimalzahl x in eine Dualzahl umzuwandeln, wendet man folgende Vorgehensweise an: 1. x : 2 = y Rest z 2. Mache y zum neuen x. Merke dir den Rest. 3. Wiederhole Schritt 1 und 2 fort, solange wie das neue x ungleich 0 ist. Ergebnis: Die ermittelten Reste z von unten nach oben und dann nebeneinander geschrieben, ergeben die Dualzahl. Die folgende Tabelle zeigt diese Vorgehensweise am Beispiel der Dezimalzahl 30 Umwandlung von Dezimal- in Hexadezimalsystem Um eine Dezimalzahl x in eine Hexadezimal umzuwandeln, wendet man folgende Vorgehens- weise an: 1. x : 16 = y Rest z 2. Mache y zum neuen x. Merke dir den Rest. 3. Wiederhole Schritt 1 und 2 fort, solange wie das neue x ungleich 0 ist. Ergebnis: Die ermittelten Reste z von unten nach oben nebeneinander geschrieben ergeben die Hexadezimalzahl. Die folgende Tabelle zeigt diese Vorgehensweise am Beispiel der Dezimalzahl 30 Weitere Umwandlungen Natürlich sind auch weitere Umwandlungen möglich wie: Dualzahl nach Dezimalzahl (haben wir schon geübt) Hexadezimalzahl nach Dezimalzahl Hexadezimalzahl nach Dualzal Da diese Umwandlungen sehr einfach sind, gehen wir nicht weiter darauf ein. Ermitteln Sie für sich selbst, wie diese Umwandlun- gen erfolgen können. Schreiben Sie jeweils ein Bei- spiel auf. Erinnern Sie sich, was ein Positionssystem ist. Rechnen im Dualsystem Addition von Dualzahlen Duale Zahlen haben lediglich den Wertebereich {0,1}. Wenn man duale Zahlen spaltenweise ad- diert, kann durch Addition der Wertebereich überschritten werden. In dem Fall wird der aus der Grundmathematik bekannte Übertrag genutzt, der den Wert 1 annehmen kann und jeweils eine Spalte links versetzt notiert wird. Wann ein Übertrag in der dualen Addition benötigt wird, zeigt die folgende Tabelle. Addition Ergebnis 0+0 0 0+1 1 1+0 1 1+1 0 (Übertrag 1) 1+1+1 1 (Übertrag 1) 1+1+1+1 0 (Übertrag 10, also zwei Stellen links) Im Folgenden sind zwei Beispiele gezeigt, die dies erläutern. Der Übertrag wird jeweils links neben der Spalte eingetragen, die den Übertrag erzeugt hat. In dem Video wird das schrittweise Vorgehen bei einer dualen Addition erläutert. DualeAddition.mp4 Subtraktion von Dualzahlen Ähnlich verhält es sich mit der Subtraktion von dualen Zahlen. Auch hier wird das Hilfsmittel Übertrag genutzt. Die Tabelle zeigt die jeweiligen Ergebnisse einer dualen Subtraktion. Subtraktion Ergebnis 0-0 0 0-1 1 (Übertrag 1) 1-0 1 1-1 0 0-1-1 0 (Übertrag 1) 1-1-1 1 (Übertrag 1) Im Folgenden ist ein Beispiel gezeigt. Der Übertrag wird wiederum jeweils links neben der Spalte eingetragen, die den Übertrag erzeugt hat. Subtraktion durch 2-er Komplement Die Subtraktion von Dualzahlen gilt als umständlich und ist in der Digitaltechnik mit logischen Verknüpfungen nicht möglich. Es existiert kein digitaler Schaltkreis, der subtrahieren kann. Des- halb behilft man sich mit dem sogenannten Komplement. Zur Erläuterung des Komplement, müssen wir zunächst verstehen, wie negative Zahlen im Computer verwaltet werden, da es ja nur den Wertebereich {0,1} gibt. Negative Zahlen werden im sogenannten höchstwertigsten Bit angezeigt (das Bit ganz links in der Dualzahl). Wenn dieses Bit gesetzt ist, dann handelt es sich um eine negative Zahl. Dieses Bit wird auch Most-Significant Bit (MSB) genannt. MSB = 0: positive Zahl MSB = 1: negative Zahl Aber, es reicht nicht aus, nur das MSB = 1zu setzen: Falsch ist: 1 = 0001 und -1 = 1001! Negative Zahlen sind das sogenannte 2er Komplement einer positive Zahl. Der Zahlenring unten zeigt jeweils vier Bits einer positiven Zahl und das dazugehörende 2er Komplement. Doch wie genau wird das 2er Komplement gebildet? Dafür gibt es die folgende Regel: 1. Fange bei der rechten Stelle (niedrigstwertiges Bit) an. 2. 1. Wenn diese Stelle eine 0 ist, schreibe eine 0 und gehe zu Punkt 3; 2. Wenn diese Stelle eine 1 ist, schreibe eine 1 und gehe zu Punkt 4. 3. Gehe ein Zeichen nach links und wiederhole Punkt 2. 4. Invertiere alle restlichen Stellen bis zum höchstwertigen Bit. Alternative Faustregel: 1. Invertiere alle Stellen 2. Addiere 1 Diese Regeln sind jeweils in beide Richtungen gültig: Von der positiven Zahl zur ne- gativen Zahl, und umgekehrt. Das folgende Beispiel zeigt die Vorgehensweise bei der alternativen Faustregel. Nach dem man das 2er Komplement gebildet hat, addiert man nun das 2er Komplement mit dem Minuend der Subtraktion. Das Ergebnis dieser Addition entspricht dem Ergebnis ursprüng- lichen Subtraktion. Folgende Beispiele zeigen die Subtraktionen 2 – 4 [Addition: 2 + (-4)] und 6-2 [Addition 6 + (-2)] Vorzeichenlose / Vorzeichenbehaftete Zahlen Im Computer werden also Zahlen immer als Dualzahlen gespeichert Aber wie weiß man, ob das MSB als Kennzeichnung für eine negative Zahl dient, oder ob damit nicht doch eine positive Zahl gemeint ist? Beispiel: 1111 kann sowohl die 15 sein, oder aber auch die -1 (siehe Zahlenring oben) Für diese Unterscheidung kommt wieder der Datentyp ins Spiel. Sprachen wie C#, die ex- plizit Datentypen nutzen, haben einen Datentyp, der anzeigt, ob eine Zahl mit oder ohne Vorzeichen interpretiert soll. Beispiel: int und uint u- steht für unsigned (vorzeichenlos) In JavaScript wird jede Zahl (Datentyp: number) als vorzeichenbehaftete Zahl interpretiert (also kann sowohl positiv als auch negativ sein). Kommazahlen Bisland haben wir nur ganze Zahlen betrachtet. Es stellt sich nun die Frage, wie werden Kommazahlen abgebildet, wenn man weiß, dass nur der duale Wertebereich {0,1} im Computer möglich ist. Sie müssen diese Abbildung nicht auswendig lernen, sondern sol- len lediglich die grundsätzliche Idee verstehen und die sich daraus ergebende Konse- quenz in der Programmierung berücksichtigen. Jede Kommazahl kann in der Form 2.3756·103 angegeben werden. Bei dieser Darstellungsform setzt sich die Zahl aus zwei Bestandteilen zusammen: Mantisse (2.3756) und Exponent (3), der ganzzahlig ist. Diese Form wird auch meist in Rechnern verwendet, außer dass dort nicht mit Basis 10, son- dern mit Basis 2 gearbeitet wird. Die für die Darstellung einer Gleitpunktzahl verwendete Anzahl von Bytes legt fest, ob man mit einfacher (Datentyp: float) oder mit doppelter Genauigkeit (Datentyp: double) arbeitet. Es wird dabei das nachfolgend gezeigte standardisierte IEEE-Format verwendet, wobei vier Bytes für float und acht Bytes für double definiert sind. Die Anzahl der Nachkommastellen ist immer begrenzt. Daher besteht das Risiko von Un- genauigkeiten durch Rundung. Beispiel: Darstellung der Zahl 17,625 als float-Wert 17,625 0 10000011 00011010000000000000000 Konsequenz in der Programmierung: Kommazahlen können im Dualsystem nie ganz genau dargestellt werden. Dies führt zu kleinen, aber in gewissen Situationen zu berücksichtigenden Ungenauigkeiten. So sollte man grundsätzlich Kommazahlen nicht auf Gleichheit prüfen (wie im Beispiel gezeigt) if (x/y == 0.001) { } 6.2 Darstellung von Texten ASCII-Code und Unicode Nachdem Sie nun wissen, wie Zahlen im Computer verwaltet werden, bleibt noch zu klä- ren, wie ein Text gespeichert, wenn nur der Wertebereich {0,1} zur Verfügung steht. Da- für hat die Welt der Informatik sogenannte Codes entwickelt. Zwei werden kurz erläutert. ASCII-Code Der ASCII-Code (American Standard for Coded Information Interchange) ist eine festge- legte Abbildungsvorschrift (Norm) zur binären Kodierung von Zeichen. Der ASCII-Code umfasst Klein-/Großbuchstaben des lateinischen Alphabets, (arabische) Ziffern und viele Sonderzeichen. Die Kodierung erfolgt in einem Byte (8 Bits), so dass mit dem ASCII-Code 256 verschie- dene Zeichen dargestellt werden können. Da das erste Bit nicht vom Standard-ASCII-Code genutzt wird, können im Standard-ASCII- Code nur 128 Zeichen dargestellt werden. Unterschiedliche, speziell normierte, ASCII- Code-Erweiterungen nutzen das erste Bit, um weitere 128 Zeichen darstellen zu können. Ein Code ist also ein Regelwerk das definiert, wie eine bestimmte Bitfolge zu inter- pretieren ist. Zur Speicherung von Texten werden einzelne Bytes, die jeweils immer ein Zeichen kodie- ren, einfach hintereinander abgespeichert, so dass eine Zeichenkette gebildet wird. Der Datentyp einer Zeichenkette ist string String ASCII-Code (Hexadezimal) HALLO 48 41 4C 4C 4F Hallo 48 61 6C 6C 6F Unicode ASCII Code hat nur einen begrenzten Zeichenvorrat (128). Nur wenige Sprachen können damit unterstützt werden. Daher wurde ein neuer Ansatz benötigt. Mit dem Unicode können Zeichen oder Elemente praktisch aller bekannten Schriftkulturen und Zeichensysteme dargestellt werden. Unicode nutzt 2 Byte, bis zu 65.536 verschiedene Zeichen in dem System unter- bringen (2 Byte = 16 Bit = 216 Kombinationsmöglichkeiten). In Version 3.1 wurden 94.140 Zeichen aufgenommen, wobei die Zwei-Byte- Grenze durchbrochen wurde. Das Zwei-Byte-Schema, im Unicode-System als Ba- sic Multilingual Plane (BMP) bezeichnet, wurde deshalb von einem Vier-Byte- Schema abgelöst. Codes und Datentypen Beispiel zur Problemerläuterung Die Zahl 11 wird als Number wie folgt im Speicher abgelegt: 1011 Die Zahl 11 ist als String ein ASCII-Code (siehe Tabelle) Beide werden also völlig unterschiedlich im Speicher abgelegt! Mathematische Rechnungen kann der Computer aber nur mit Number (bzw. Datentypen für Zahlen), nur damit kann er z.B. eine duale Addition durchführen. Also muss eine Zahl, die als String gespeichert wurde, zunächst konvertiert werden, um damit rechnen zu können. In stark-typisierten Programmiersprachen muss explizit zwischen den Datentypen String und Number (bzw. den dort definierten Datentypen) konvertiert werden. Java- Script macht dies automatisch. 6.3 Testfragen Prima! Sie haben das Kapitel bearbeitet. Prüfen Sie nun für sich selbst, wieviel Sie vom Inhalt verstanden haben. Versuchen Sie die Fragen ohne Nachschlagen zu beantworten! Welche der folgenden Aussagen ist richtig? Eine vorzeichenlose Variable ist immer... positiv (einschließlich 0) positiv oder negativ negativ (einschließlich 0) Richtig! Auswerten Was ist das Ergebnis der dualen Addition 1+1? 1 (mit Übertrag) 2 1 0 (mit Übertrag) Richtig! Auswerten Wie viel Bytes sind 2 MByte? 1.048.576 2.097.152 2.000.000 Richtig! Auswerten Wandeln Sie folgende Dezimalzahlen in Dualzahlen um. Begrenzen Sie die Anzahl an Stellen derart, dass das höchstwertige Bit eine 1 ist (z.B. für eine 2 wür- den Sie 10 eingeben). Leerzeichen zwischen den Stel- len sind nicht erlaubt. 10 1010 254 11111110 26 11010 Richtig! Ihre Antwort ist richtig! Auswerten Wandeln Sie folgende Dualzahlen in Hexadezimal- zahlen um. Nutzen Sie Großbuchstaben (z.B. B2, EE). Verwenden Sie zwingend die JavaScript-Syntax zur Kennzeichnung von Hexadezimalzahlen. 1111 1111 0xFF 1010 0010 0xA2 0010 1101 0x2D Richtig! Ihre Antwort ist richtig! Auswerten Addieren Sie die beiden folgenden Dualzahlen. Tra- gen Sie jeweils die passende Dezimalzahl ein. Tragen Sie den Übertrag ein (insgesamt 7 Ziffern, wenn in ei- ner Spalte kein Übertrag gebildet wird, dann tragen Sie dort eine 0 ein). Zahl 1 (dual): 0101101 Dezimal: 45 Zahl 2 (dual): 0110110 Dezimal: 54 Übertrag (dual): 1111000 Ergebnis (dual): 1100011 Dezimal: 99 Richtig! Ihre Antwort ist richtig! Auswerten 7 Boolesche Operatoren Grundoperatoren Zum Einstieg in dieses Thema schauen Sie sich bitte zunächst das folgende Google Doodle an und versuchen Sie es zu verstehen. https://www.google.com/doodles/george-booles-200th-birthday? doodle=18610284&domain_name=google.de&hl=de Aussagenlogik George Boole war ein englischer Mathematiker, der sich Mitte des 19. Jahrhunderts mit der formalen Darstellung von Zahlenstrukturen beschäftigte. Dabei entwickelte er die nach ihm benannte Boolesche Algebra. In der Booleschen Algebra existieren nur zwei Werte: 0 (falsch bzw. false) und 1 (wahr bzw. true).Das Verständnis der Booleschen Algebra ist wichtig für den Entwurf und die Konstruktion effizienter Strukturen und Schaltungen zur Verarbeitung binärer Größen und bildet damit die Grundlage der heutigen Computerhardware. Grundlage der Booleschen Algebra ist die sogenannte Aussagenlogik. Die Aussagenlogik ist ein Teilgebiet der Logik, die sich mit Aussagen und deren Verknüpfung durch Operatoren befasst, ausgehend von elementaren Aussagen, denen ein Wahrheitswert zugeordnet ist. Jeder Aussage ist genau einer der beiden Wahrheitswerte wahr oder falsch zugeordnet. Der Wahrheitswert einer zusammengesetzten Aussage ergibt sich aus den Wahrheitswerten ihrer Teilaussagen. Beispiele (achten Sie auf die fett markierten Wörter): Aussage: Es ist Weihnachten oder Silvester Dieses Aussage ist wahr, wenn entweder Weihnachten oder Silves- ter ist. Es ist Weihnachten und es liegt Schnee Diese Aussage wahr, wenn sowohl Weihnachten ist als auch Schnee liegt. Der Wahrheitswert einer logischen Aussage wird häufig in Form einer Tabelle dargestellt. Diese Tabelle wird Wahrheitstabelle genannt. Wahrheitstabellen werden u.a. genutzt, um soge- nannte Boolesche Operatoren und Boolesche Funktionen zu beschreiben. Boolesche Grundoperatoren Die boolesche Algebra verwendet drei Grundoperatoren: OR AND NOT Die Grundoperatoren können in Booleschen Funktionen verwendet werden. Einige dieser Funktionen werden vereinfacht wiederum in weitere Operatoren (NAND, NOR etc.) zusammengefasst. AND Der AND-Operator verbindet zwei Ausdrücke. Das Ergebnis der daraus resul- tierenden Booleschen Funktion ist wahr, wenn beide Ausdrücke wahr sind. Schreibweise ∧ (auch ∗) In JavaScript: && a und b seien zwei Boolesche Ausdrücke. Das Ergebnis der Booleschen AND- Funktion ist in der rechten Spalte gezeigt. a b a∧b 0 0 0 0 1 0 1 0 0 1 1 1 Das folgende Beispiel zeigt die Nutzung des AND-Operators (&&) in JavaScript 1 function IstSchaltjahr(Monat, Tag) 2 { 3 let ergebnis = "Es ist kein Schaltjahr"; 4 5 if( (Monat == 2) && (Tag == 29) ) 6 { 7 ergebnis = "Es ist ein Schaltjahr"; 8 } 9 10 return ergebnis; 11 } OR Der OR-Operator verbindet zwei Boolesche Ausdrücke. Das Ergebnis der dar- aus resultierenden Boolesche Funktion ist wahr, wenn eine der beiden Aus- drücke wahr ist. Schreibweise ∨ (auch +) In JavaScript: || a und b seien zwei Boolesche Ausdrücke. Das Ergebnis der Booleschen OR-Funk- tion ist in der rechten Spalte gezeigt. a b a∨b 0 0 0 0 1 1 1 0 1 1 1 1 Betrachtet man eine einfache elektrische Schaltung, dann wird die Logik dieser beiden Operatoren sofort verständlich. NOT Der NOT-Operator negiert einen Booleschen Ausdruck. Das Ergebnis der Ne- gierung ist wahr, wenn der Ausdruck falsch ist bzw. ist falsch, wenn der Aus- druck wahr ist. Schreibweise a (auch ¬ a) ¯ ¯¯ In JavaScript: ! a ¯¯ ā 0 1 1 0 Bedingungen mit Booleschen Operatoren Boolesche Ausdrücke können aus mehreren Booleschen (Teil-)Ausdrücken zusammengesetzt sein, auch Vergleichsoperationen enthalten können. Dabei gelten folgende Regeln: Ausdrücke in Klammern werden zuerst gewertet Unter Beachtung der ersten Regel erfolgt die Auswertung durch einen Compiler von Ausdrücken von links nach rechts. Denken Sie nach, warum das so ist. Beispiel: ((10 + 2) > 6) && ( 5 == 5) …true Ermitteln Sie den Wahrheitswert folgender Boole- scher Ausdrücke: ((8 - 2) < 6) && (7 != 3) (8 > 2) || (7 3 ) XOR, NAND, NOR Unter Nutzung der Grundoperatoren können nun etliche Boolesche Funktionen gebildet werden. Zur Vereinfachung, hat man für die folgenden Booleschen Funktionen eigene Operatoren definiert. Die Logik dieser Operatoren wird in den jeweiligen Wahrheitsta- bellen gezeigt und sollte für Sie einfach nachvollziehbar sein. XOR-Operator Ergebnis ist wahr, wenn nur eine der beiden Bedingungen wahr ist Boolesche Funktion der Grundoperatoren: ( ā ∧ b) v ( a ∧ ¯b ) Schreibweise v (auch ⊕ ) In JavaScript kein eigenes Symbol vorhanden. Daher wird folgende Boolesche Operation genutzt: ( a && !b ) || ( !a && b ) a b avb 0 0 0 0 1 1 1 0 1 1 1 0 NAND-Operator Negierung von AND Boolesche Funktion der Grundoperatoren: ¯¯¯¯¯¯¯¯¯ ¯ a ∧ b Schreibweise ∧ ¯¯ ¯¯ In JavaScript kein eigenes Symbol vorhanden. Daher wird folgende Boolesche Operation genutzt: !(a && b) bzw. (!a || !b) a b a∧b ¯¯ ¯¯ 0 0 1 0 1 1 1 0 1 1 1 0 NOR-Operator Negierung von OR Boolesche Funktion der Grundoperatoren: ¯¯¯¯¯¯¯¯¯ ¯ a ∨ b Schreibweise ∨ ¯¯ ¯¯ In JavaScript kein eigenes Symbol vorhanden. Daher wird folgende Boolesche Operation genutzt: !(a || b) bzw. (!a && !b) a b a∨b ¯¯ ¯¯ 0 0 1 0 1 0 1 0 0 1 1 0 Operatoren in JavaScript Erläuterung/Ziel von Operatoren Neben den booleschen Operatoren kennen Programmiersprachen weitere Opera- toren. Diese Operatoren helfen, Software-Programme effizient zu erstellen. Die Nutzung eines Operators ist einfacher als die dazugehörende Funktion zu programmieren. Lassen Sie uns die wichtigsten Operatoren anschauen, die in vielen Programmiersprachen ver- wendet werden, so auch in JavaScript. In den Übungen werden wir nur mit den mathematischen, Zuweisungs- und Restwert-Operato- ren programmieren. Für die aktive Nutzung der anderen Operatoren muss man etwas tiefer in die Programmierung eintauchen. Daher stehen die hier ertsmal nur zur Information für Sie. Mathematische Operatoren Operatoren Beschreibung + Addition - Subtraktion * Multiplikation / Division ** Potenzierung % Restwert-Bildung ++ Inkrementieren -- Dekrementieren Inkrementieren/Dekrementieren/Zuweisungsoperatoren In Programmen werden sehr oft Zählvariablen benötigt, auf die 1 addiert (Inkrementieren) oder von denen 1 subtrahiert (Dekrementieren) werden muss. JavaScript bietet für diese beiden Operationen den Inkrementoperator ++ und den Dekrement- operator −− an. Diese Operatoren können vor (Präfix) oder nach (Postfix) einer Variable stehen. Beispiele Inkrementie- Dekrementie- ren (Identi- ren (Identi- sche Wirkung) sche Wirkung) a = a + 1; b = b - 1; a += 1; b -= 1; a++: b--; ++a; --b; Vorsicht: a =+ 1; b =- 1; a und b wird hier ein Wert zugewiesen. Die beiden Operatoren ++ und −− können bei Variablen auf der rechten Seite einer Zuwei- sung verwendet werden. In diesem Fall spricht man von Zuweisungsoperatoren. Zuweisungsoperatoren gibt es auch für weitere mathematische Operationen. Dabei ist jedoch zu beachten, dass abhängig von der Position des Operators (vor/nach der Variable) die Wertzuweisung unterschiedlich ist. Schauen Sie sich die beiden Varian- ten an: a = 4; b = ++a; //erst wird a um 1 hochgezählt, dann wird der Wert b zugewiesen. Also ist b in dem Fall gleich 5, a ist gleich 5 a = 4; b = a++; //Erst wird der Wert b zugewiesen, dann wird a um 1 hochgezählt. Also ist b in dem Fall gleich 4, a ist gleich 5 Restwert-Bildung Der Restwert-Operator (Modulo) liefert den Rest der Division zweier Zahlen zurück. Operator Beispiel % a = 5; b = 3; c = a % b; //c hat nach dieser Anweisung den Wert 2 Shift-Operatoren Mit den beiden Shift-Operatoren ist es möglich, die Bits eines einer Zahl nach links () zu schieben. Um wie viele Stellen die Bits des linken Operanden zu verschieben sind, gibt dabei der rechte Operand an. Dual Dezimal a = 5; 0000 0101 5 a = a 1; 0000 0110 6 Bit-Operatoren Bitweise AND Zwei Zahlen werden bitweise AND verknüpft Operator Beispiel Dual & a = 0x5; 00000101 b = 0xc; & 00001100 _____________ c = a & b; 00000100 (c = 0x4;) Bitweise OR Zwei Zahlen werden bitweise OR verknüpft Operator Beispiel Dual | a = 0x5; 00000101 b = 0xc; | 00001100 _____________ c = a | b; 00001101 (c = 0xD;) Bitweise Invertierung Eine Zahl wird bitweise invertiert Operator Beispiel Dual ~ a = 0x5; 00000101 ~ c = ~a; _____________ 11111010 (c = 0xFA;) Bitweise XOR Zwei Zahlen werden bitweise XOR verknüpft Operator in C# Beispiel Dual ^ a = 0x5; 00000101 b = 0xc; ^ 00001100 _____________ c = a ^ b; 00001001 (c = 0x9;) Bedingter (Conditional) Operator Wenn eine Bedingung wahr ist, wird 'x' zurückgegeben, ansonsten wird 'y'. Alternative für if-else-Anweisung Operator Beispiel (Bedingung) ? x : y a = 5; b = 3; c = 4; d = (a==5) ? b : c; // d ist dann gleich 3 Vollständige Liste Es gibt noch weitere Operatoren, es werden immer wieder auch neue definiert (vgl. ** seit 2016). Die aktuellen Informationen müssen daher recherchiert werden. https://www.w3schools.com/js/js_operators.asp Testfragen Prima! Sie haben das Kapitel bearbeitet. Prüfen Sie nun für sich selbst, wieviel Sie vom Inhalt verstanden haben. Versuchen Sie die Fragen ohne Nachschlagen zu beantworten! Welche Werte haben a und b am Ende dieser Anwei- sungen? let a=1; let b; b= a++; a=1 b=2 a=1 b=1 a=2 b=2 a=2 b=1 Richtig! Auswerten Welchen Wert hat die Variable 'x' nach der folgenden Anweisung? let x = 16 % 7; 9 2,28 2 Richtig! Auswerten Welcher der folgenden Operatoren ist kein Grund- operator der Booleschen Algebra? AND NOT OR NOR Richtig! Auswerten Ermitteln Sie den Wahrheitswert folgender Boole- scher Ausdrücke: Wenn ein Ausdruck wahr ist, markieren Sie ihn. Wenn ein Ausdruck falsch ist, markieren Sie ihn nicht. ((8 – 2) < 6) && (7 != 3) (8 > 2) || (7 3 ) Richtig! Ihre Antwort ist richtig! Auswerten Welche der rechts gezeigten Anweisungen haben die gleiche Wirkung wie die Anweisung x = x + 1;? Ziehen Sie die passenden Blöcke in den linken Block hinein. Anordnung zurücksetzen x = x + 1; 1x+; x=+1; x++; x1+; ++x; x+=1; Richtig! Auswerten 8 Datenstrukturen Enumerationen Benutzerdefinierte Datentypen Wir haben verschiedene Datentypen wie String, Number, Boolean etc. kennenge- lernt. Dies sind Standard-Datentypen, die es prinzipiell in jeder Programmierspra- che gibt. Nun gibt es aber immer wieder die Notwendigkeit, mit spezifischen zu- sammengehörenden Daten wie z.B. den Farben einer Ampel oder der Adresse ei- ner Person in einem Softwareprogramm zu arbeiten. Auch solche Daten können zu Datentypen zusammengefasst werden. Da keine Programmiersprache der Welt vorhersehen kann, welche zusammengehörenden Da- ten Programmierende für ein bestimmtes Programm brauchen, schaffen Programmiersprachen Möglichkeiten, mit denen eigene (benutzerdefinierte) Datentypen erstellt werden können. Wir schauen uns im folgenden die JavaScript Möglichkeiten einer sogenannte Enumeration und einer Klasse an. Enumerationen Schauen wir uns folgende Funktion an. Sie hat folgende Merkmale: Die Funktion "steuert" ein Auto. Bei Grün soll das Auto fahren, bei Gelb Startklar werden, bei Rot anhalten Die Steuerung, was getan werden soll, erfolgt über den Parameter color (Datentyp: Number) Die Werte des Parameters bekommen eine "willkürliche" Bedeutung (in dem Beispiel: 0=grün, 1= gelb, 2=rot) Es könnten aber auch beliebig andere Werte gewählt werden. Diese Bedeutung ist aber nicht gut zu erkennen! Daher ist das Programm schwierig zu lesen. Insbesondere, wenn zwei Personen involviert sind (eine Person, die die Funktion programmiert hat und die andere Person diese Funk- tion verwendet. 1 function ControlCar(color) 2 { 3 switch(color) 4 { 5 case 0: 6 DriveCar(); 7 break; 8 case 1: 9 PrepareCarToDrive(); 10 break; 11 case 2: 12 StopCar(); 13 break; 14 } 15 } Besser wäre es, wenn die möglichen Ampelfarben lesbar im Quelltext sichtbar sind. Um dies zu ermöglichen, kann die Idee einer sogenannten Enumeration verwendet werden: Eine Enumeration bildet eine Klammer um zusammengehörenden Werte. Eine Enumeration bildet somit einen neuen benutzerdefinierten Datentyp Die Syntax und Anwendung zeigt der folgende Quelltext. ACHTUNG: JavaScript hat kein eigenes Schlüsselwort für eine Enumeration, wie dies in anderen Programmiersprachen üblich ist (häufig: enum). Daher gibt es verschie- dene Möglichkeiten, die Idee einer Enumeration über andere Wege (im Beispiel un- ten über ein Array) zu lösen. Probieren Sie dieses (oder ein ähnliches) Beispiel aus! 1 const colors = 2 { 3 green: 0, 4 yellow: 1, 5 red: 2, 6 }; 7 8 let c1 = colors.red; 9 10 switch (c1) 11 { 12 case colors.green: 13 //DriveCar(); 14 break; 15 case colors.yellow: 16 //PrepareCarToDrive(); 17 break; 18 case colors.red: 19 //StopCar(); 20 break; 21 } Klassen Programmierparadigma Ein Programmierparadigma ist ein fundamentaler Programmierstil. Prozedurales Programmierparadigma: Historisch zuerst Orient sich an der Arbeitsweise von Rechnern Zerlegung der Programme in Funktionen Programmiersprachen: Basic, C Objektorientiertes Programmierparadigma (OOP): Orientiert sich an Objekten aus der Realität (z.B. ein Apfel) Ausgangspunkt war der Wunsch, reale "Objekte" möglichst 1:1 in Programmierspra- chen zu beschreiben Gemeinsame Eigenschaften der Objekte werden in Klassen definiert (z.B. Apfelsorte) Konkrete Werte der Eigenschaften werden in Objekten ausgeprägt (z.B. Apfelsorte = „Elstar“ Auch Funktionen werden sind Teil einer Klasse (z.B. Apfelpflücken() ) In OOP spricht man hier von Methoden Vererbung, Eigenschaften der Mutterklasse werden übernommen Programmiersprachen: z.B. C++, C#, JavaScript Dem Thema OOP widmet sich intensiv das Fach Objektorientierte Modellie- rung (2. Semester, Digitalisierunsgingenieurwesen). Klassen (Allgemein) Eine Klasse sollte also (muss aber nicht) ein Objekt aus der realen Welt darstellen (z.B. einen Regalschrank). Mit einer Klasse kann man einen neuen benutzerdefinierter Datentyp aus be- stehenden Datentypen konstruieren. Dabei können beliebige Datentypen verwendet werden, also Standard-Datentypen wie number, string, boolean etc. aber auch andere Klassen. Lassen Sie uns das Prinzip am Beispiel aus der "analogen" Welt erklären: Sie können viele einzelne Elemente wie Schrauben, Stifte, Bretter etc. geschickt zu- sammenbringen und daraus ein Regal bauen. Das Regal ist der benutzerdefi- nierte Datentyp, Schrauben, Stifte etc. sind Standard-Datentypen. Um eine Klasse verwenden zu können, muss sie zunächst definiert werden. Man geht wie im Folgenden beschrieben vor und man kann sich das am Beispiel eine Schablone veranschaulichen: Schritt 1: Eine Klasse muss zunächst definiert werden. Beispiel: Es wird eine Schablone für ein Wappen aus Kunststoff er- zeugt. Das ist die Klassen-Definition. Schritt 2: Es wird ein neues (new) Objekt (auch Instanz genannt) erzeugt. Dies kann beliebig oft wiederholt werden. Dieses Objekt wird im Code wie eine Variable deklariert. Beispiel: Kunststoffschablone auf einen Karton auflegen, umranden und ausschneiden. Die Kartonwappen sind die Objekte. Klassen sind also Grundelemente in der objektorientierten Programmierung Sie kennen bereits den Begriff Funktion Klassen können Funktionen enthalten. In der objektorientierten Welt spricht man dann von einer Methode. Beispiele haben wir schon kennengelernt console.log(helloName); log ist eine Funktion (Methode) der Klasse console Die Basistyp-Elemente einer Klasse (also die Element vom Datentyp int, string usw. nennt mann Eigenschaften oder Attribute Klassen werden definiert und instanziiert. Eine Instanz einer Klasse wird auch Objekt genannt. Klassen (JavaScript) Das folgende Beispiel zeigt die Definition der Klasse Person und die Nutzung dieser Klasse, in dem ein Objekt thePerson instanziiert wird. 1 //Definition der Klasse 2 class Person 3 { 4 constructor(firstName, lastName) 5 { 6 this.firstName = firstName; //Attribut der Klasse 7 this.lastName = lastName; //Attribut der Klasse 8 } 9 10 //Methode der Klasse 11 fullName() 12 { 13 return this.firstName + " " + this.lastName; 14 } 15 } 16 17 //Beispiel zur Nutzung der Klasse 18 let vorname = "Hans"; 19 let nachname = "Meier"; 20 21 //Instanziiere ein Objekt der Klasse Person. Das Objekt hat in dem Beispiel den Namen p 22 let p = new Person(vorname, nachname); 23 24 //Gibt den Namen dieses Objekt unter Verwendung der Methode fullName aus 25 console.log( p.fullName() ); Die Bedeutung von Klassen in JavaScript wird teilweise kontrovers diskutiert. Für eine ausführliche Darstellung dieser Diskussion wird auf das Kapitel 13 des Buches "Objektorientierte Programmierung mit JavaScript" (siehe Literatur) verwiesen. Da Klassen in anderen objektorientierten Programmiersprachen eine wesentliche Rolle spielen, wird auf ihre Bedeutung für das OO-Programmierparadigma explizit hingewiesen. Eigenschaften von Klassen Weiteres Wissenswertes zu Klassen: Eine Klasse ist ein Datentyp, der festlegt, wie alle Objekte dieser Klasse aufgebaut sind Die Klasse legt fest, aus welchen Datenkomponenten, die sogenannten Attribute bestehen Die Klasse legt fest, welche Operationen zur Manipulation der Datenkom- ponenten, sogenannte Methoden, zur Verfügung stehen Die Operation zur Erzeugung von Objekten wird Konstruktor genannt, in dem die Objekte initialisiert werden können. Die folgenden Hinweise beziehen sich auf die Programmiersprache C#. Ähnliche Möglichkeiten gibt es auch in JavaScript, auf die wir allerdings in diesem Kurs nicht eingehen. Der Zugriff auf Attribute und Funktionen einer Klasse wird über Zugriffs- rechte gesteuert. public: Kann von eigener Klasse, von allen anderen Klassen und von allen Prog