retschgi

Da ich mich gerade auf eine Wepprogramming-Prüfung vorbereiten muss, hatte ich das Vergnügen mich mit JSON herumzuschlagen. Was ist JSON? JSON steht für JavaScript Object Notation und setzt JavaScript Konzepte für OO-Programmierer um. JSON lässt seinen Benutzern sehr viel Freiheit und ist durchaus eine gelungene Sache. Hier ein kleiner Überblick was JSON so alles zu Bieten hat.Hinweis: Hier gehts um eine Erweiterung von JavaScript, also muss man es auch wie JavaScript programmieren!

Erstes Beispiel:

1
2
3
4
5
6
7
8

Object myObject = new Object();
 
var firstBook = new Object();
firstBook.title = "Mein testtitel";
firstBook.author = "Dave Davenport";
 
myObject.books = new Array();
myObject.books[0] = firstBook;

so definiert man einfache Objekte mit JSON. Der Zugriff geht auch sehr einfach. Will man z.B. auf den Author von firstBook zugreifen, so macht man dies wie folgt: myObject.books[0].title

Komplexers Gebilde

1
2
3
4
5

var country  = {
   location: "Sidney",
   inhabitant: 34,
   populars: [ {name: "Hans Muster"}, {name: "Caroline Beispiel" }],
}

Mit diesem Gebilde wird die Komplexität und die Verschachtelungsmöglichkeiten von JSON schon etwas deutlicher. Will ich nun z.B. auf den Eintrag “Caroline Beispiel” zugreiffen, so kann ich dies wie folgt tun: country.populars[0].name

Funktionen

Wo Objekte im Spiel sind, braucht es natürlich auch Funktionen. JSON kennt hier zwei Möglichkeiten um Funktionen zu definieren.

Direkter Weg

1
2
3
4
5
6

var myObject = new Object();
 
myObject.testFunction=function()
{
   alert("Schuhgrösse");
}

Bei dieser Möglichkeit deklariert man die Funktion direkt für dieses Objekt.

Indirekter Weg

1
2
3
4
5
6
7
8
9

var myObject = new Object();
 
function meineTestFunction(name)
{
   alert(name + " stinkt!");
}
 
// ACHTUNG: Hier keine () !!!!!
myObject.meineTestFunction=meineTestFunction;

Macht man es so hat man den Vorteil, dass die einmal deklarierte Funktion noch weiteren Objekten übergeben werden kann.
Um eine Funktion aufzurufen verwendet man wie gewohnt myObject.meineTestFunction(„Reto“);

Konstruktor

Was wäre ein Objekt ohne Konstruktor?Genau, und darum gibt es auch bei JSON eine Art Konstruktor

1
2
3
4
5
6
7
8
9
10
11
12
13
14

function Employee(name, salary)
{
     this.name = name;
     this.salary = salary;
 
    // Man kann her sogar Funktionen definieren
    this.printSalary=function()
    {
         alert(this.name + " : " + this.salary);
    }
}
 
var HansKnopf = new Employee("Hans", 12);
HansKnopf.printSalary();

Macht man es so, hat es jedoch einen erheblichen Nachteil. Erstellen wir viele Objekte vom Typ Employee, so wird die Funktion printSalary() für jedes Objekt neu erstellt. Daher sollte man besser auf einen Prototyp ausweichen.

Mit dem Prototyp ist sichergestellt, dass die Funktion nur einmal deklariert wird:

1
2
3
4
5
6
7
8
9
10
11
12
13

function Employee(name, salary)
{
	this.name = name;
	this.salary = salary;
}
 
Employee.prototype.printSalary=function()
{
	alert(this.name + " : " + this.salary);
}
 
var HansKnopf = new Employee("Hans", 12);
HansKnopf.printSalary();

Eine Funktion von einem anderen Objekt aufrufen

Ganz interessant ist auch die folgende Möglichkeit:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

function Cat(name)
{
	this.name = name;
 
	this.getName= function()
	{
		alert(this.name);
	}
}
 
function Dog(name)
{
	this.name = name;
}
 
myCat = new Cat("Bruno");
myDog = new Dog("Nino");
 
// Lade die Funktion von myCat temporär in eine Variable
var tmpFunc = myCat.getName;
 
// Übergib myDog der Funktion
tmpFunc.call(myDog);

Schlussendlich wird so “Nino” ausgeprintet und nicht etwa “Bruno”.

So ich hoffe, dass dieser kurzer Überblick etwas Aufschlussreich war. JSON ein Thema das sich durchaus lohnt! Auch im Zusammenhang mit AJAX. Viel Spass damit.

Tags: Ajax, JavaScript, JSON, Programming