241 lines
6.8 KiB
Plaintext
241 lines
6.8 KiB
Plaintext
{
|
|
"cells": [
|
|
{
|
|
"cell_type": "markdown",
|
|
"id": "a8050b44-a23c-4dfa-b1fc-06c0f89a9814",
|
|
"metadata": {
|
|
"editable": false,
|
|
"slideshow": {
|
|
"slide_type": ""
|
|
},
|
|
"tags": []
|
|
},
|
|
"source": [
|
|
"# Arrays\n",
|
|
"Hat man eine Vielzahl an (gleichen) Daten, so fällt es schwer, für alle Daten einzelne Variablen anzulegen. Hierzu kann man ein sogenanntes \"Array\" benutzen.\n",
|
|
"\n",
|
|
"Ein Array ist ein Objekt, in dem mehrere Werte gespeichert werden können. Man kann es z.B. als \"Liste\" auffassen.\n",
|
|
"\n",
|
|
"## Achtung: Unterschiede JavaScript <> TypeScript <> andere Programmiersprachen\n",
|
|
"### Unterschied 1: Typisierung\n",
|
|
"\"Klassische\" Programmiersprachen wie Java, C++, C# lassen es nicht zu, dass man in einem Array unterschiedliche Daten speichert und verlangen, dass alle Elemente des Arrays vom gleichen Datentyp sind.\n",
|
|
"\n",
|
|
"Da JavaScript nicht streng typisiert ist, fällt diese Einschränkung weg. Nutzt man hingegen die Typisierung mittels TypeScript, so gibt es auch hier diese Einschränkung!\n",
|
|
"\n",
|
|
"**Wir werden deshalb vorrangig in einem Array die selben Datentypen speichern, also entweder nur Zahlen oder nur Texte oder nur...**\n",
|
|
"\n",
|
|
"### Unterschied 2: Erweiterbarkeit\n",
|
|
"\"Klassische\" Programmiersprachen haben außerdem die Einschränkung, dass einmal angelegte Arrays weder vergrößert noch verkleinert werden können, also immer gleich viele Speicherplätze enthält. JavaScript/TypeScript/Python lassen dies zu. Wo hierbei die Vor- und Nachteile liegen werden wir im Rahmen des späteren Themas \"Abstrakte Datentypen\" uns näher anschauen"
|
|
]
|
|
},
|
|
{
|
|
"cell_type": "markdown",
|
|
"id": "5c142d44-d44f-4d17-a370-a26c3729988a",
|
|
"metadata": {
|
|
"editable": false,
|
|
"slideshow": {
|
|
"slide_type": ""
|
|
},
|
|
"tags": []
|
|
},
|
|
"source": [
|
|
"## Aufbau eines Arrays\n",
|
|
"Ein Array kann auch als \"Schubladenschrank\" gesehen werden, bei dem in jeder Schublade eine Variable liegt:\n",
|
|
"\n",
|
|
"| Index | Wert |\n",
|
|
"| :---: | :---: |\n",
|
|
"| [0] | 5 |\n",
|
|
"| [1] | 9 |\n",
|
|
"| [2] | 14 |\n",
|
|
"| [3] | -7 |\n",
|
|
"| ... | ... |\n",
|
|
"\n",
|
|
"Zu beachten ist dabei dass die Zählung (der sogenannte \"Index\") der Schubladen/Felder/Einträge bei 0 beginnt."
|
|
]
|
|
},
|
|
{
|
|
"cell_type": "markdown",
|
|
"id": "de4692c5-76fd-4559-84a8-5037c5ef8243",
|
|
"metadata": {
|
|
"editable": false,
|
|
"slideshow": {
|
|
"slide_type": ""
|
|
},
|
|
"tags": []
|
|
},
|
|
"source": [
|
|
"# Arbeiten mit einem Array\n",
|
|
"Ein Array wird wie eine normale Variable angelegt, jedoch kommen die Werte in eckige Klammern. Hier wird z.B. das Array mit dem Namen `arr` angelegt mit den 4 Einträgen `5,9,14,-7`:\n",
|
|
"```\n",
|
|
"let arr = [5,9,14,-7]\n",
|
|
"```\n",
|
|
"\n",
|
|
"*Anmerkung: am Mac werden eckige Klammern mit der Tastenkombination **[option]+[5]** bzw. **[option]+[6]** eingegeben.*\n",
|
|
"\n",
|
|
"Wollen wir auf einen einzelnen Eintrag zugreifen, so können wir an den Namen in eckigen Klammern den Index anhängen:\n",
|
|
"```\n",
|
|
"console.log( arr[2] ) // gibt \"14\" auf der Konsole aus\n",
|
|
"arr[1] = 0 // ändert den zweiten Eintrag (mit Index 1) auf den Wert \"0\"\n",
|
|
"```\n",
|
|
"\n",
|
|
"Praktischer als in anderen Programmiersprachen ist, dass Arrays im Gesamten auf der Konsole ausgegeben werden können:\n",
|
|
"```\n",
|
|
"console.log( arr ) // gibt alle Inhalte des Arrays aus\n",
|
|
"```\n",
|
|
"\n",
|
|
"Wie oben schon angemerkt, können wir bei JavaScript/TypeScript auch einfach Elemente an ein Array anhängen. Dazu verwenden wir den Befehl `push`:\n",
|
|
"```\n",
|
|
"arr.push(42) // fügt an das Array \"arr\" ein neues Element mit dem Wert \"42\" an\n",
|
|
"```\n",
|
|
"*(Vor dem Punkt steht natürlich der jeweilige Name unseres Arrays)*"
|
|
]
|
|
},
|
|
{
|
|
"cell_type": "code",
|
|
"execution_count": 13,
|
|
"id": "a06dacf8-084f-472a-9983-25403008c7ea",
|
|
"metadata": {
|
|
"editable": false,
|
|
"slideshow": {
|
|
"slide_type": ""
|
|
},
|
|
"tags": []
|
|
},
|
|
"outputs": [
|
|
{
|
|
"name": "stdout",
|
|
"output_type": "stream",
|
|
"text": [
|
|
"[ 5, 9, 14, -7 ]\n",
|
|
"14\n",
|
|
"[ 5, 0, 14, -7 ]\n",
|
|
"[ 5, 0, 14, -7, 42 ]\n"
|
|
]
|
|
}
|
|
],
|
|
"source": [
|
|
"let arr = [5,9,14,-7]\n",
|
|
"console.log( arr )\n",
|
|
"console.log( arr[2] )\n",
|
|
"arr[1] = 0\n",
|
|
"console.log( arr )\n",
|
|
"arr.push(42)\n",
|
|
"console.log( arr )"
|
|
]
|
|
},
|
|
{
|
|
"cell_type": "markdown",
|
|
"id": "4ac76977-797e-4ba4-ab32-dcb3d503a519",
|
|
"metadata": {
|
|
"slideshow": {
|
|
"slide_type": ""
|
|
},
|
|
"tags": []
|
|
},
|
|
"source": [
|
|
"## Rückgabe eines Arrays aus einer Funktion\n",
|
|
"Natürlich können wir so auch ein Array aus einer Funktion zurückgeben:\n",
|
|
"```\n",
|
|
"function toArray(a, b) {\n",
|
|
" return [a, b]\n",
|
|
"}\n",
|
|
"```\n",
|
|
"Die Funktion übernimmt 2 Parameter und gibt diese als Array wieder zurück."
|
|
]
|
|
},
|
|
{
|
|
"cell_type": "code",
|
|
"execution_count": 15,
|
|
"id": "857fdf86-6321-4cb0-a0d7-c625e291239f",
|
|
"metadata": {
|
|
"editable": false,
|
|
"slideshow": {
|
|
"slide_type": ""
|
|
},
|
|
"tags": []
|
|
},
|
|
"outputs": [
|
|
{
|
|
"data": {
|
|
"text/plain": [
|
|
"[ \u001b[33m6\u001b[39m, \u001b[33m17\u001b[39m ]"
|
|
]
|
|
},
|
|
"execution_count": 15,
|
|
"metadata": {},
|
|
"output_type": "execute_result"
|
|
}
|
|
],
|
|
"source": [
|
|
"function toArray(a, b) {\n",
|
|
" return [a, b]\n",
|
|
"}\n",
|
|
"toArray(6, 17)"
|
|
]
|
|
},
|
|
{
|
|
"cell_type": "markdown",
|
|
"id": "7daedfbf-a309-4307-954e-c1102662b643",
|
|
"metadata": {
|
|
"editable": false,
|
|
"slideshow": {
|
|
"slide_type": ""
|
|
},
|
|
"tags": []
|
|
},
|
|
"source": [
|
|
"## Länge eines Arrays\n",
|
|
"Mit `length` kann man auf die Länge eines Arrays zugreifen:\n",
|
|
"```\n",
|
|
"console.log( arr.length ) // schreibt die Länge des Arrays \"arr\" auf die Konsole\n",
|
|
"```\n",
|
|
"*(Vor dem Punkt steht natürlich auch hier wieder der jeweilige Name unseres Arrays)*"
|
|
]
|
|
},
|
|
{
|
|
"cell_type": "code",
|
|
"execution_count": 17,
|
|
"id": "7c9daad5-3c31-4716-8aa5-5ef080b28df8",
|
|
"metadata": {
|
|
"editable": false,
|
|
"slideshow": {
|
|
"slide_type": ""
|
|
},
|
|
"tags": []
|
|
},
|
|
"outputs": [
|
|
{
|
|
"name": "stdout",
|
|
"output_type": "stream",
|
|
"text": [
|
|
"[ 5, 0, 14, -7, 42 ]\n",
|
|
"5\n"
|
|
]
|
|
}
|
|
],
|
|
"source": [
|
|
"console.log( arr )\n",
|
|
"console.log( arr.length )"
|
|
]
|
|
}
|
|
],
|
|
"metadata": {
|
|
"kernelspec": {
|
|
"display_name": "Deno",
|
|
"language": "typescript",
|
|
"name": "deno"
|
|
},
|
|
"language_info": {
|
|
"codemirror_mode": "typescript",
|
|
"file_extension": ".ts",
|
|
"mimetype": "text/x.typescript",
|
|
"name": "typescript",
|
|
"nbconvert_exporter": "script",
|
|
"pygments_lexer": "typescript",
|
|
"version": "5.8.3"
|
|
}
|
|
},
|
|
"nbformat": 4,
|
|
"nbformat_minor": 5
|
|
}
|