Informatik-Grundlagen (JS): TH OWL - eCampus PDF

Summary

This document provides lecture material for an introductory computer science course (Informatik-Grundlagen). It covers topics such as algorithm, pseudocode, computer and operating systems, JavaScript fundamentals, information management, boolean operators, data structures, and data processing. The material is intended for use at TH OWL.

Full Transcript

Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 Informatik-Grundlagen (JS) Informatik-Grundlagen (JS) Lehrmaterial der Vorlesungen. Inhalte werden im Laufe des Semesters freigeschaltet Inhalt...

Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 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 https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentati…a3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 1 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 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. Zudem ist es wichtig, wesentliche Zusammenhänge der Datenverarbeitung zu verste- hen. 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 Java- Script 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, feh- lertolerante Codes) Programmier-Umgebung Wir werden in der Programmiersprache JavaScript programmieren. Dafür benötigt man lediglich einen Texteditor und einen Browser. Zum besseren Erstellen und Verwalten von Softwareprojek- ten werden wir jedoch die Software Visual Studio Code von Microsoft einsetzen. In den PC-Räu- men 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 Übungsaufgaben bzw. unterstützt Ihr Selbststudium. Die Installation von Visual Studio Code finden Sie hier. Sämtliche Übungsaufgaben an https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentati…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 2 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 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 beziehen. Die Bearbeitung einer Programmieraufgabe mit JavaScript ist Teil der E-Klausur (Quelltext erstellen 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 si- gnifikant 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 wer- den. 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 https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentati…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 3 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 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. https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentati…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 4 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 PDF-Unterlagen Es werden keine PDF-Dokumente erstellt und verteilt. Sie können die Inhalte die- ses 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 https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentati…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 5 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 diesem Kurs programmiert? C# JavaScript Java C++ Richtig! Auswerten Welche Software wird für die Programmie- rung in diesem Kurs benötigt? Eclipse Excel Visual Studio Visual Studio Code Richtig! Auswerten https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentati…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 6 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 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 auto- nom fahrenden LKW für die Berufskraftfahrer, staatliche Gesichtserkennungsmaßnah- men etc. Dieser Fragestellung widmen wir uns nicht in diesem Lernmodul. Anwendungsbezogene Perspektive: Die Frage »Wie nutze ich Digitalisierung?« adressiert den technisch-versierten und ver- antwortungsvollen Umfang mit IT-Systemen, z.B. wie nutze ich effektiv ein CAD-Sys- tem. Über die Anwendung von Visual Studio hinaus widmen wir uns nicht dieser Fragestel- lung. https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentati…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 7 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 Technologische Perspektive: Die Frage »Wie funktioniert Digitalisierung?« widmet sich dem Inneren von IT-Syste- men: 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 ge- zeigt. Grundlage von Industrie 4.0 ist eine massive Vernetzung von und innerhalb von Pro- duktionsprozessen. https://www.youtube.com/watch?v=kQLbVVPNTMQ Industrie 4.0 grundlegend erklärt Recherchieren Sie den Begriff »Industrie 4.0« und beantworten Sie für sich die Frage, warum Infor- matik-Kenntnisse für Ingenieure und Ingenieurin- https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentati…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 8 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 nen unumgänglich sind. Begriffsdefinition "Informatik" Ursprung Informatik umfasst allgemein die automatisierte Informationsverarbeitung in Natur, 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 Prozesse werden informatisch modelliert, sodass sie automatisch durchgeführt werden (können). Die Systeme, die dazu von der Informatik konstruiert werden, werden als Informatiksysteme bezeichnet. Was Sie auf dem Schreibtisch, in der Tasche, in Ihrem Auto,... haben, sind Informatiksysteme. https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentati…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 9 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 Stellungnahme zur Lehrerversorgung Informatik. FG IBN der GI. http://www.researchgate.net/pu- blication/280920203_Schriftliche_Stellungnahme_zur_quantitativen_Erweiterung_der_Lehrerbildun- g_Informatik_in_NRW 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 Ziehen 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 interes- siert, dem sei das Heinz-Nixdorf- Forum (HNF) in Paderborn emp- fohlen. Viele der hier genannten Aspekte werden dort ausführlich und mit spannenden Exponaten dargestellt. https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentati…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 10 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 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 lesen Sie den Text durch und finden Sie die gesuchte Wortfolge: https://in- f.gi.de/01/wie-liest-man-loecher Beantworten Sie die Frage, was in der Wortfolge ein Widerspruch zu einer Aussage im vorhergehenden Abschnitt ist. Konrad Zuse Erbauer des ersten funktionstüchtigen Computers https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentati…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 11 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 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 ei- ner 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 https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentati…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 12 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 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 Rech- ner https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentati…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 13 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 Moderne Rechner enthalten Mikroprozessoren mit vielen Millionen Transistoren, Ar- beitsspeicher 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 ei- nem Mikroprozessor in etwa alle 18 Monate verdoppelt. Auszug eines Interviews der Süddeutschen Zeitung mit dem Intel-Chef Pat Gelsinger 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 Reden halte, sage ich: Solange das Periodensystem noch nicht ausge- schöpft ist, ist Moore's Law noch nicht erledigt. Erst gestern habe ich mit einem unserer Forscherteams gesprochen. Sie haben mir von ei- nem 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 Jahr- zehnts verzehnfachen können. Die größten Chips enthalten heute etwa 100 Milliarden Transistoren, und wir glauben, wir können bis 2030 eine Billion Transistoren erreichen - bei etwa demselben Stromverbrauch wie bei den heutigen Chips. https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentat…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 14 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 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 wer- den. Theoretische Informatik – Grundlage für die Anderen Automatentheorie und formale Sprachen Berechenbarkeitstheorie Komplexitätstheorie Angewandte Informatik – Der Computer für den Anwender https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentati…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 15 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 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? Konrad Zuse Hermann Hollerith Wilhelm Schickard Richtig! https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentati…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 16 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 Auswerten Wann ungefähr wurde der Abakus zum ersten Mal genutzt? vor ca. 3000 Jahren vor ca. 300 Jahren vor ca. 30 Jahren Richtig! Auswerten Wer gilt als Erfinder der ersten funktionsfähigen Rechenmaschine? Wilhelm Schickard Konrad Zuse John von Neumann Charles Babbage Richtig! Auswerten https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentati…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 17 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 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 Algorith- mus muss die Abfolge der einzelnen Verarbeitungsschritte eindeutig hervorgehen. Legt fest, wie Eingabedaten in einer endlichen Zahl an Schritten in Ausgabedaten umgewandelt werden. https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentat…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 18 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 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 https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentati…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 19 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 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 generie- ren. 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! https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentat…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 20 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 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 https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentati…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 21 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 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 orga- nisierte) textuelle Beschreibung, die bereits wesentliche Merkmale einer echten Programmiersprache 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 wer- den zu können (vergleiche mit den Eigenschaften eines Algorithmus). Besser ist folgende, noch immer 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) https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentat…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 22 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 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 Aufnahme 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 ne- ben 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ögli- che Anweisungen (Zeige Fehlermeldung, Multipliziere zwei Variablen, Warte für 1s usw.) Eine Anweisung endet immer mit einem »Stoppzeichen«, oftmals ist das ein Semikolon. Ein- fache Anweisungen haben keine Bedingungen: Sie werden ausgeführt, sobald der Pro- https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentat…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 23 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 grammablauf diese Anweisung bearbeitet. Sollen Anweisungen nur unter bestimmten Bedin- gungen ausgefü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 Deutschland 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. Optio- nal 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 iden- tisch 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) https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentat…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 24 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 Schleife (Loop) Eine Schleife hat die Aufgabe, bestimmte Anweisungen mehrmals auszuführen. Wie oft dies geschieht, 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 Anweisungen, die zu einem Block gehören, werden durch geschweifte Klam- mern "{ }" 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 dieses Algorithmus? Die Tabelle zeigt die Antwort. Nummer des i zu Beginn des i zum Ende des Wert Durchlaufs Durchlaufs Durchlaufs von a 1 0 1 0 2 1 2 -1 3 2 3 -2 4 3 4 -3 https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentat…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 25 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 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 daher: 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 iden- tisch 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 wer- den 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, wiederkehrende Aufgaben an einer Stelle zu konzentrieren. Im späteren Verlauf des Semesters gehen wir noch intensiv auf Funktionen ein. https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentat…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 26 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 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ückgabean- weisung. Sie liefert den Wert, der in der Variablen merker gespeichert ist, zurück. Wurde der Algorithmus innerhalb einer Sprungstelle, d.h. einer Funktion (unten im Beispiel Funktion_Mi- nimum) ausgeführt, so gibt die Rückgabeanweisung den Wert an die aufrufende Funktion (unten im Beispiel 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() } https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentat…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 27 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 In vielen Programmiersprachen wird das Schlüsselwort return verwendet, um einen Wert zurückzugeben. Folgen (Array, List) Eine Folge ist eine Auflistung von endlich vielen Variablen (beispielsweise Zah- len). 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. Folglich 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 Funktion 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 Algorithmus wieder an die Stelle, an der die Funktion aufgerufen wurde. Das folgende Bild erläutert diese Aussage. Die Reihenfolge der Anweisungen wird durch de- ren Nummerierung angegeben. https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentat…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 28 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 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 werden dürfen." Ein Programm besteht aus vielen Sprachelementen, die dem Programm eine Bedeu- tung geben, die Semantik "Die Semantik ist die Bedeutung des Programms." Übersetzungsvorgang https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentat…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 29 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 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 Aufgabe, 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 Vorge- hen 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 aus- gefü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 genutzte Programmiersprachen: https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentat…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 30 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 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 Netscape für dynamisches HTML in Webbrowsern entwickelt wurde, um Benutzerinteraktionen 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 Servern und in Microcontrollern. https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentati…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 31 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 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 Navigator integriert. Um die Popularität von Java zu nutzen, wurde Live- Script in JavaScript umbenannt, obwohl die beiden Sprachen voneinan- der unabhä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? Funktion Schleife Wirkstelle Variable Bedingte Anweisung Richtig! Auswerten https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentat…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 32 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 Ist ein Algorithmus abhängig von einer Program- miersprache? Kann man nicht so genau sagen Ja Nein Richtig! Auswerten Welche der folgenden Aussagen über Compiler ist richtig? Ein Compiler wandelt...... Maschinencode in Quelltext.... C++ in Java.... Quelltext in Maschinencode. Richtig! Auswerten https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentat…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 33 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 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 ha- ben 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 festge- legt wurde. Es ist allerdings möglich, zwei Variablen gleich zu benennen, sofern sie in einem anderen Geltungsbereich deklariert werden. Wir kommen darauf später zu spre- chen im Abschnitt Funktionen Die erstmalige Einführung einer Variablen im Programm heißt Deklaration https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentat…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 57 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 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 Verwen- dung 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 Java- Script-Code verwendet. Die Schlüsselwörter let und const wurden 2015 zu JavaScript hinzuge- fügt. Das Schlüsselwort var sollte nur in Code verwendet werden, der für äl- tere 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. https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentat…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 58 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 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 einzeiligen Anweisungen in einem Block bestehen. Ein Anweisungsblock ist in geschweifte 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". https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentat…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 59 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 Eine Variable eines Datentyps kann in eine Variable eines anderen Datentyps konver- tiert (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 an- zugeben, z.B. 74 für 1974. Die Gründe dafür lagen hauptsächlich im limitierten Speicherplatz der damaligen Computer. Aber, man konnte sich auch nicht wirk- lich vorstellen, dass diese Programme noch im Jahr 2000 genutzt werden wür- den. Aber, so war es: Es näherte sich das Jahr 2000 und plötzlich realisierte man, dass eine 2-ziffrige Jahresangabe doppeldeutig sein würde. Eine 74 könnte in Zu- kunft also 1974 oder 2074 bedeuten. Es mussten daher große Anstrengungen unternommen werden, 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: https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentat…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 60 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 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 auto- matisch durch den zugewiesenen Wert bestimmt (anders als in stark-typisierten Programmiersprachen). Der Datentyp einer Variable kann sich zur Laufzeit än- dern! 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 im- mer 64bit im Speicher reserviert. Ausnahme ist der Datentyp BigInt, der größere Zahlen speichern kann. Datentypen in C# https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentati…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 61 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 Anders als JavaScript, ist C# eine stark typisierte Programmiersprache. D.h. der Datentyp einer Variable muss explizit bei der Deklaration genannt werden. Eine Umwandlung 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 diesen Begriff nicht, man spricht von einem Array Ein Array (Englisch für Feld) ist ein ein- oder mehrdimensionales Element zum Verwal- ten von Variablen Analogie zur Mathematik ⎛ 1⎞ ⎜ ⎟ ⎜ ⎟ Eindimensionales Array - Vektor 2 ⎝ 3⎠ ( ) https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentat…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 62 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 (5 6) 7 8 Zweidimensionales Array -> Matrix Arrays vereinfachen die Verwaltung zusammenhängender Variablen Dabei können in JavaScript die Variablen unterschiedliche Datentypen haben (zur Vereinfachung, werden wir in diesem Kurs nur mit Array desselben Datentyps arbei- ten. 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 https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentat…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 63 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 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 Mittwoch 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 dar- auf ein. Ein Beispiel: https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentat…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 64 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 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 werden 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 } https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentat…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 65 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 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 Num- ber mit String verglichen wird, true wenn beide die- selbe Zahl enthalten) === ist gleich (Werte und Datentypen werden vergli- chen, nur true wenn z.B. Number mit Number vergli- chen wird und beide dieselbe Zahl enthalten) >= ist größer gleich ist größer Stellen Sie den Wahrheitswert folgender Bedin- gungen fest: 1. 3/2 > 5 2. 5*2 == 30/3 3. (100*10)/1000 != 1 https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentat…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 66 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 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 Pro- gramm durchlaufen kann. Ein Kontrollflussgraph enthält Knoten (engl.: nodes) und gerichtete 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öglich! 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 Kontrollflussgra- phen: Der erste Knoten ist die erste Anweisung in der Funktion, der letzte Knoten das return (sofern gezeigt). Jedes if, else, for... ist ein eigener Knoten Allein stehende Klammern sind keine Anweisungen, daher haben sie keinen Knoten. https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentat…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 67 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 In der Informatik gibt es etliche Alternativen zum Kontrollflussgraphen. Das sind z.B. Struktogramme und Programmablaufpläne. Damit werden wir uns aber da- mit in diesem Kurs nicht beschäftigen. Verzweigung mit if-Anweisung mit Alternativen Bedingte Anweisungen in JavaScript: if-Anweisung mit einer Alter- nativen 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 wer- den. Dafür gibt es syntaktisch mehrere Möglichkeiten. Wir werden in den Übungen folgende Syntax nutzen: https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentat…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 79 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 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 Va- riablen mit demselben Namen in verschiedenen Funktionen verwendet werden. Lokale 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 https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentat…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 80 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 Der Gültigkeitsbereich einer Variablen bezeichnet die Abschnitte 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, so- wie in allen Unterblöcken diese Blocks gültig, d.h. ver- wendbar. Variablen, die außerhalb einer Funktion deklariert werden, nennt man globale Variablen. In Abhängigkeit von der Stelle, an der die globale Va- riablen deklariert werden, kann deren Gültigkeitsbereich mehrere Soft- ware-Module umfassen. Erläuterung Gültigkeitsbereich (Quelle: Wikipedia) Kurze Übung https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentat…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 81 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 Identifizieren Sie die lokalen und globalen Varia- blen 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 be- antworten! Was ist der Unterschied zwischen einer while- Schleife und einer do/while Schleife? Eine do/while Schleife wird mindestens einmal durchlaufen, eine while-Schleife nicht unbedingt. Eine while-Schleife wird mindestens einmal durchlaufen, eine do/while-Schleife nicht unbedingt. Keine der beiden Schleifen wird mindestens einmal durchlaufen. Richtig! https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentat…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 82 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 Auswerten Welche der folgenden Aussagen über Parameter ist richtig? Ein Parameter.... ist ein Eingangswert einer Funktion... ist der Rückgabewert einer Funktion... ist eine lokale Variable in einer Funktion. Richtig! Auswerten Welche der folgenden Aussagen über eine if-Bedin- gung sind richtig? Sie.....beschreibt eine exponentielle Berechnungsformel...ist entweder wahr oder falsch....kann mehrere mathematische und Vergleichsoperationen kombi- nieren. Richtig! https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentat…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 83 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 Auswerten Ordnen Sie die Schleifenarten dem richtigen Schlüsselwort zu, mit dem Schleifen in JavaScript erstellt werden können. Anordnung zurücksetzen while Kopfgesteu- erte Schleife do/while Fußgesteu- erte Schleife for Zählschleife Richtig! Auswerten Welche der folgenden Aussagen über Datentypen sind richtig? Ein Datentyp......ist ein Typ, der mit Daten arbeitet. https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentat…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 84 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39...gibt an, von welcher Art die Daten sind, die mit ihm beschrieben werden....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? Object Float Index Real List https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentat…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 85 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 Number Boolean String 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: 𝑁−1 n= ∑𝑖=0 bj * 2i 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 https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentati…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 91 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 Übung Wandeln Sie folgende Dualzahlen in Dezimal- zahlen 00111100 11111111 10001000 Hexadezimalsystem Neben dem Dualsystem ist in der Informatik noch das Hexadezimalsystem wich- tig, da es ebenfalls in einer engen Beziehung zum Dualsystem steht. Es gilt näm- lich: 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: 𝑁−1 n= ∑𝑖=0 bj * 16i 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 https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentat…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 92 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 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 vorge- stellt. 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 Compu- https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentat…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 93 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 ter 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 embedded Programmierung gebräuchlich. Wir werden dies nicht weiter verwen- den. 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 auf- fä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ß- einheiten den dezimalen Maßeinheiten anzupassen. Für die Maßeinheiten der 2er Potenzen https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentat…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 94 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 wurden 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 nutzen 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 Zahlen 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, bil- det man von rechts beginnend so genannte Dualtetraden (Vierergruppen). Für jede Vierergruppe wird dann genau eine Hexadezimalzahl ermittelt https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentat…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 95 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 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 Vorgehenswei- se 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 geschrie- ben, ergeben die Dualzahl. Die folgende Tabelle zeigt diese Vorgehensweise am Beispiel der Dezimalzahl 30 https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentat…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 96 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 Umwandlung von Dezimal- in Hexadezimalsystem Um eine Dezimalzahl x in eine Hexadezimal umzuwandeln, wendet man folgende Vorge- hensweise 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 https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentat…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 97 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 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 Umwand- lungen erfolgen können. Schreiben Sie jeweils ein Beispiel auf. Erinnern Sie sich, was ein Positions- system ist. Rechnen im Dualsystem Addition von Dualzahlen Duale Zahlen haben lediglich den Wertebereich {0,1}. Wenn man duale Zahlen spaltenweise addiert, 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 be- nö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) https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentat…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 98 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 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äu- tert. 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) https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentat…3a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 99 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 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 logi- schen Verknüpfungen nicht möglich. Es existiert kein digitaler Schaltkreis, der subtrahieren kann. Deshalb 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. Die- ses 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. https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentat…a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 100 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 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 negativen Zahl, und umgekehrt. Das folgende Beispiel zeigt die Vorgehensweise bei der alternativen Faustre- gel. https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentat…a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 101 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 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 ur- sprünglichen 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 explizit 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). https://ecampus.th-owl.de/ilias.php?baseClass=illmpresentat…a18d4366f52c330753d598e4280268667c334cf228c9bb4802cb31ce7a Seite 102 von 193 Informatik-Grundlagen (JS): TH OWL - eCampus 27.01.25, 18:39 Kommazahlen Bisland haben wir nur ganze Zahlen betrachtet. Es stellt sich nun die Frage, wie wer- den 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 sollen lediglich die grundsätzliche Idee verstehen und die sich daraus erge- bende Konsequenz in der Programmierung berücksichtigen. Jede Kommazahl kann in der Form 2.3756·103 angegeben werden. Bei dieser D

Use Quizgecko on...
Browser
Browser