return{dd:dd}

[Netzwerkidi]

Hallo in die Runde,

als ewig Suchender, Findender und Lernender bin auf eine elegante Menülösung bei

http://sandbox.scriptiny.com/dropdown-menu/

gestoßen. Da ich immer wissen will, wie was funktioniert, habe ich mir den Javascriptcode mal näher angesehen.

Und ich verstehe einfach nicht, was der Meister mit dem folgenden Statement bewirkt, also was da zurückgeben wird.

return{dd:dd}

alert({dd:dd}) zeigt mir an [object Object]. Ja klasse!
alert(dd) zeigt den Funktionscode.

Warum macht er das und was soll das bewirken?

Vielleicht kann mir jemand auf die Sprünge helfen.

Dank im voraus!

Grüße
Idi


PS: Nachfolgend der gesamte JS-Code.

Aufruf:

	var menu=new menu.dd("menu");
	menu.init("menu","menuhover");

und Funktion selbst

var menu=function(){
	var t=15,z=50,s=6,a;
	function dd(n){this.n=n; this.h=[]; this.c=[];}
	dd.prototype.init=function(p,c){
		a=c; var w=document.getElementById(p), s=w.getElementsByTagName('ul'), l=s.length, i=0;
		for(i;i<l;i++){
			var h=s[i].parentNode; this.h[i]=h; this.c[i]=s[i];
			h.onmouseover=new Function(this.n+'.st('+i+',true)');
			h.onmouseout=new Function(this.n+'.st('+i+')');
		}
	}
	dd.prototype.st=function(x,f){
		var c=this.c[x], h=this.h[x], p=h.getElementsByTagName('a')[0];
		clearInterval(c.t); c.style.overflow='hidden';
		if(f){
			p.className+=' '+a;
			if(!c.mh){c.style.display='block'; c.style.height=''; c.mh=c.offsetHeight; c.style.height=0}
			if(c.mh==c.offsetHeight){c.style.overflow='visible'}
			else{c.style.zIndex=z; z++; c.t=setInterval(function(){sl(c,1)},t)}
		}else{p.className=p.className.replace(a,''); c.t=setInterval(function(){sl(c,-1)},t)}
	}
	function sl(c,f){
		var h=c.offsetHeight;
		if((h<=0&&f!=1)||(h>=c.mh&&f==1)){
			if(f==1){c.style.filter=''; c.style.opacity=1; c.style.overflow='visible'}
			clearInterval(c.t); return
		}
		var d=(f==1)?Math.ceil((c.mh-h)/s):Math.ceil(h/s), o=h/c.mh;
		c.style.opacity=o; c.style.filter='alpha(opacity='+(o*100)+')';
		c.style.height=h+(d*f)+'px'
	}
	return{dd:dd}
}();

Wie gesagt bei: http://sandbox.scriptiny.com/dropdown-menu/

 

[CPoly]

Also erst mal Grundlage:

Das ist ein Objekt mit der Eigenschaft "dd", welche als Wert die Klasse "dd" hat. Das die beide gleich heißen, ist völlig irrelevant.


Wieso?
In Java gibt es packages, in C# namespaces und in JavaScript muss man es eben so lösen. Du hast jetzt Praktisch die Klasse "dd" im Namensraum "menu". Deshalb auch die Instanzierung via "new menu.dd()" und nicht nur "new menu()". Man kann das auch auf andere Weisen lösen. In der Form ist mir das bisher auch nicht untergekommen.