taralino

Datentyp Objekt

Abschließend stellen wir den Datentyp Objekt vor. Genauer handelt es sich dabei um einen Datentyp, welcher als eine Art Container für weitere Variablen angesehen werden kann.

Das Konstrukt ist dabei etwas komplexer als bei den Datentypen zuvor: Objekte werden unter Verwendung geschweifter Klammern definiert. Enthalten sind darin die Variablennamen sowie die Werte der Variablen nach einem Doppelpunkt:

{Variablenname:Wert, Variablenname:Wert, Variablenname:Wert}

Um auf die einzelnen Variablen eines Objekts zuzugreifen, kann der Variablenname des Objekts gefolgt von einem Punkt gefolgt vom Variablenname des Objekts verwendet werden:

Variablenname_Objekt.Variablenname

Beispiel

Beispiel zur Definition und Verwendung einer Variablen vom Datentyp Objekt.

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <script src="taralino.js"></script>
</head>
<body>
<script>

var A = {name:"Hans", geburt:1998, ort:"Berlin"};

Console.print(A.name);
Console.print(A.geburt);

</script>
</body>
</html>

Vorschau Download Kopie speichern

Beispiel

Es wird eine Liste von Objekten definiert und anschließend ausgelesen.

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <script src="taralino.js"></script>
</head>
<body>
<script>

var data = [];

for (var k = 0; k < 50; k++) {
  var c = (random(0,2) < 1 ? "red" : "green");
  var h = {x:random(2,18), y:random(2,10), fill:c};
  data.push(h);
};

Canvas.init([0,20], [0,12], {width:480, background:"lightgrey"});

for (var k = 0; k < data.length; k++) {
  Canvas.circle(data[k].x, data[k].y, 0.6, {fill:data[k].fill});
};

</script>
</body>
</html>

Vorschau Download Kopie speichern

Hinweis

Anstelle von Objekten lassen sich grundsätzlich auch Datenfelder verwenden, beispielsweise ein zweidimensionales Datenfeld im Beispiel zuvor.

Der Vorteil von Objekten besteht aber darin, dass die einzelnen Inhalte des Objekts einen Variablennamen haben und damit eine gewisse Bedeutung mitliefern (z.B. x für eine x-Koordinate). Würde man Datenfelder verwenden, dann muss man sich merken, welcher Index welche Bedeutung besitzt.

Alternative Schreibweise

Um die einzelnen Variablen eines Objekts auszulesen, gibt es eine weitere Möglichkeit: Statt Punkt wie im Beispiel zuvor kann der Variablennamen auch als Zeichenkette in eckigen Klammern verwendet werden:

Variablenname_Objekt["Variablenname"]

Beispiel

Zwei unterschiedliche Möglichkeiten, um auf die Variablen eines Objekts zuzugreifen. Welche Variante gewählt wird, ist im Wesentlichen Geschmackssache.

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <script src="taralino.js"></script>
</head>
<body>
<script>

var A = {name:"Hans", geburt:1998, ort:"Berlin"};

Console.print(A.name);
Console.print(A["name"]);

Console.print(A.geburt);
Console.print(A["geburt"]);

</script>
</body>
</html>

Vorschau Download Kopie speichern

Zusatzinformation

Sämtliche Optionen der taralino-Umfänge sind auch nichts anderes als Objekte. Entsprechend können optionale Parameter auch als Objekt definiert werden, um diese wiederholt zu verwenden.

Beispiel

Optionen eines Canvas-Befehls werden als Objekt definiert.

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <script src="taralino.js"></script>
</head>
<body>
<script>

Canvas.init([0,20], [0,12], {width:480, background:"lightgrey"});

var T = {fill:"yellow", stroke:"red"};

Canvas.circle( 4.0, 6.0, 2.0, T);
Canvas.circle(10.0, 6.0, 2.0, T);
Canvas.circle(16.0, 6.0, 2.0, T);

</script>
</body>
</html>

Vorschau Download Kopie speichern