Weblabor

Nemrég tett közzé Farkas Máté (fmate14) blogbejegyzést tömb bejárási problémákról, amelyhez kapcsolódóan Galiba Péter (Poetro) szóba hozta, hogy létezik egy hasOwnProperty() nevű Object metódus. Kicsit jobban utánajártam, és kiderült, hogy MSIE nem támogatja, a többi nagyobb böngésző viselkedése pedig néhány esetben eltérő, ezért úgy döntöttem, hogy egy az egyben felülírom ezt a metódust.

Object.hasOwnProperty

A bevezetőben isKey() lokális függvény volt, amiből most Object.hasOwnProperty() lesz. Igazából ez Object.prototype.hasOwnProperty(), de a prototype-ot nem teszem ki, mert statikus metódusokat (osztályfüggvényeket) sem most, sem a későbbiekben nem fogok használni. Ennek az az oka, hogy a statikus metódusok ugyanott kapnának helyett, mint az osztályokra jellemző metódusok. Például: a statikus Array.append() felülírná a ClassBuilder.classMethods.append()-et az Array osztályban. Persze az Array még nem igazi – csak natív – osztály, de a fejezet végére már az lesz.

Object.prototype.hasOwnProperty=function (k)
{
	var p=this.constructor.prototype;
	return (k in this) && (!(k in p) || p[k]!==this[k]);
};
Object.prototype.getClass=function ()
{
	return this.constructor;
};

Mint látható, bekerült még az Object.getClass(), ami a konstruktort adja vissza. Ez azért volt szükséges, mert már osztályokról és nem konstruktorokról beszélünk. Az isKey(o,i) helyett pedig mindenhol áttértünk a o.hasOwnProperty(i)-re. Ha összehasonlítjuk a két függvényt, akkor látható, hogy nem teljesen ugyanazt csinálják. Az isKey() csak az Object.prototype tulajdonságait szűri az objektumokból, a hasOwnProperty() pedig az aktuális osztály prototípusának a tulajdonságait is. Ez utóbbiba beletartoznak az Object.prototype tulajdonságai is, hiszen a prototípusok is objektumok, tehát megkapják ezeket. Ennek a viselkedésnek az a következménye, hogy a ClassBuilder.clearFunctionMethods() egyszerűsödik:

clearFunctionMethods: function ()
{
	for (var j in Function.prototype)
	{
		if (Function.prototype.hasOwnProperty(j))
		{
			this.current[j]=undefined;
		}
	}
},

Mindent a maga idejében

A megvalósításnál elkövettem egy lényeges hibát.

Mivel egy bonyolult dolgot építünk fel, ezért a builder pattern a célravezető. A buildert indokolja az is, hogy vannak natív osztályok, melyekhez később szintén hozzá kell adni az osztályokra jellemző viselkedést.

Itt a hiba nem feltétlen a builder pattern használata volt, hanem amivel megindokoltam. Az indoklásnál arról beszéltem, hogy a későbbiekben valamikor natív osztályokhoz is hozzáadjuk a Class viselkedést. Ez rendben is van, viszont még egyáltalán nem volt szó arról, hogy ezt hogyan oldjuk meg. Szóval egy olyan dologgal indokoltam a mintát, ami valamikor a jövőben esedékes csak, és ki tudja mikor… Ilyen esetben általában igaz, hogy úgy kell megvalósítani a dolgokat, ahogy a mostani helyzet indokolja, ha pedig majd a jövőbeni dolgokat hozzá kell adni a rendszerhez, akkor ott és akkor refaktorálni kell. Így egy csomó felesleges kódot és agyalást megspórolhatunk.

Úgy döntöttem, hogy a director kódot (ez vezérli a buildert) a Class() függvényből átteszem a ClassBuilderbe, így gyakorlatilag egy factory jön létre.

var ClassFactory=
{
	classMethods:
	{
		append: function (o){/* ... */}
	},
	createClass: function ()
	{
		this.newClass();
		this.clearFunctionMethods();
		this.addClassMethods();
		return this.getResult();
	},
	newClass: function (){/* ... */},
	clearFunctionMethods: function (){/* ... */},
	addClassMethods: function (){/* ... */},
	getResult: function (){/* ... */}
};

var Class=function (o)
{
	if (this.constructor!==arguments.callee)
	{
		throw new SyntaxError("class=new Class(...) is the right syntax");
	}
	return ClassFactory.createClass().append(o);
};

Majd ha később tényleg kiválik a director, akkor visszanevezem ClassBuilderre.

Osztály leválasztása a függvényekről

Az osztályok még nem teljesen különültek el a függvényektől, szóval fejezzük be ezt a folyamatot. Az append()-nél egyelőre megengedjük, hogy osztály is bekerüljön a tulajdonságok közé. Ezen változtatni kell. Először írjuk át az osztályok constructor tulajdonságát. Lehet gondolkodni azon, hogy ezt hol tegyük meg a ClassFactoryben. Én úgy gondoltam, hogy az addClassMethods() elejére nyugodtan be lehet tenni ezt is. Viszont így már az addClassMethods() elnevezés nem teljesen fedi a valóságot, hiszen nem csak metódusokat adunk az osztályhoz. Szóval átírtam implementClassInterface()-re, és új nevet kapott a clearFunctionMethods() is, hogy az előbbivel összecsengjen.

createClass: function ()
{
	this.newClass();
	this.removeFunctionInterface();
	this.implementClassInterface();
	return this.getResult();
},

/* ... */

removeFunctionInterface: function ()
{
	for (var j in Function.prototype)
	{
		if (Function.prototype.hasOwnProperty(j))
		{
			this.current[j]=undefined;
		}
	}
},
implementClassInterface: function ()
{
	this.current.constructor=Class;
	for (var j in this.classMethods)
	{
		if (this.classMethods.hasOwnProperty(j))
		{
			this.current[j]=this.classMethods[j];
		}
	}
},

Ezek után az append()-et bővítettem ki az osztályokat ellenőrző kóddal.

append: function (o)
{
	if (!o)
	{
		return this;
	}
	for (var j in o)
	{
		if (!o.hasOwnProperty(j))
		{
			continue;
		}
		var v=o[j];
		if ((v instanceof Function) && v.constructor===Class)
		{
			throw new TypeError("Class property cannot be a Class.");
		}
		this.prototype[j]=v;
	}
	return this;
}

Natív osztályok

Most már nekiállhatunk a natív osztályoknak. Mit is kell velük csinálni? Mivel a natív kódba nem nyúlhatunk bele, annyit tehetünk, hogy töröljük a függvényekre jellemző felületet, és hozzáadjuk az osztályokra jellemzőt. Durvább beavatkozást nem érdemes csinálni.

Elsőnek bővítsük a bevezetőben létrehozott tesztünket:

test("native classes",function ()
{
	ok(Array.getClass()===Class,"Constructor ok.");
	ok(Array.call===undefined,"Function interface removed.");
	ok(!!Array.append,"Class interface implemented.");
});

Mivel a ClassFactoryben a dolgok nagy része már megvan, ezért nyilvánvaló, hogy a natív osztályra vonatkozó kód is ide fog kerülni. Csak módot kell adni a this.current natív osztályra való átállítására, a többi már megvan. Erre a célra hozzuk létre a ClassFactory.setClass() metódust.

setClass: function (current)
{
	this.current=current;
},

Ezután már csak le kell vezérelni a létrehozási (módosítási) folyamatot.

nativeClass: function (nativeClass)
{
	this.setClass(nativeClass);
	this.removeFunctionInterface();
	this.implementClassInterface();
	return this.getResult();
}

Factory szétbontása

Most van az a rész, ahol el kell gondolkodni, hogy szétbontsam-e újra a ClassFactoryt. Végül úgy döntöttem, hogy az átláthatóság kedvéért megteszem, így kiemeltem a nativeClass() és createClass() metódusokat, ezek lettek a ClassFactory, a maradék pedig a ClassBuilder. A ClassFactory most így néz ki:

var ClassFactory=
{
	createClass: function ()
	{
		ClassBuilder.newClass();
		ClassBuilder.removeFunctionInterface();
		ClassBuilder.implementClassInterface();
		return ClassBuilder.getResult();
	},
	nativeClass: function (nativeClass)
	{
		ClassBuilder.setClass(nativeClass);
		ClassBuilder.removeFunctionInterface();
		ClassBuilder.implementClassInterface();
		return ClassBuilder.getResult();
	}
};

Látható, hogy elég sok az ismétlődés, amit emeljünk ki külön metódusba.

var ClassFactory=
{
	createClass: function ()
	{
		ClassBuilder.newClass();
		return this.getResult();
	},
	nativeClass: function (nativeClass)
	{
		ClassBuilder.setClass(nativeClass);
		return this.getResult();
	},
	getResult: function ()
	{
		ClassBuilder.removeFunctionInterface();
		ClassBuilder.implementClassInterface();
		return ClassBuilder.getResult();
	}
};

Kész is. Így már átlátható, hogy mi vezérli a létrehozást (ClassFactory) és foglalkozik annak részfolyamataival (ClassBuilder).

Natív osztályok átformálása

Most szedjük össze a natív osztályokat, és végezzük el mindre a módosításokat. Nincs mi alapján kiválasztani a globális névtérből, hogy mi natív osztály, és mi nem, szóval jobb, ha csinálunk egy listát róluk.

var nativeClasses=
[
	Boolean,
	Number,
	String,
	Array,
	RegExp,
	Date,
	Error,
	TypeError,
	ReferenceError,
	RangeError,
	SyntaxError,
	EvalError,
	URIError,
	Object,
	Function,
	Class
];
for (var j=0,l=nativeClasses.length; j<l; ++j)
{
	var nativeClass=nativeClasses[j];
	ClassFactory.nativeClass(nativeClass);
}

Igen, a Class is közéjük került. Esetleg el lehet gondolkozni azon, hogy a ClassFactory.classMethods-ból áttegyük a dolgokat a Class.prototype-ba, így az osztályok tulajdonságai is bővíthetőek lennének az append() használatával.

Egyelőre futtassuk a tesztet. Hoppá, jelez, hogy gond van: SyntaxError (Function interface removed.). Ha alaposabban megnézzük a removeFunctionInterface()-t, akkor hamar kiderül, hogy a for-in nem megy végig a natív metódusokon, így kénytelenek vagyunk kézzel felülírni őket. Szimplán a delete() nem lenne elég, mert a Function.prototype-ból jönnek ezek a dolgok.

removeFunctionInterface: function ()
{
	this.current.apply=undefined;
	this.current.call=undefined;
	this.current.toString=undefined;
	this.current.toSource=undefined;
	this.current.valueOf=undefined;

	for (var j in Function.prototype)
	{
		if (Function.prototype.hasOwnProperty(j))
		{
			this.current[j]=undefined;
		}
	}
},

Csinálhatnánk tömböt is ezeknek a tulajdonságoknak, de én úgy gondoltam, hogy annyira azért nincs sok belőlük.

Futtassuk a tesztet ismét. Minden okés.

Class.prototype

Na, most fontoljuk meg a classMethods áthelyezését. Ehhez módosítani kell az implementClassInterface()-t,

implementClassInterface: function ()
{
	this.current.constructor=Class;
	for (var j in Class.prototype)
	{
		if (Class.prototype.hasOwnProperty(i))
		{
			this.current[j]=Class.prototype[j];
		}
	}
},

és áttenni az append()-et.

Class.prototype=
{
	append: function (o){/* ... */}
};

Futtassuk a tesztet. Hamar kiderül, hogy itt is gond van: SyntaxError (class=new Class(...) is the right syntax). Ez azért van, mert a Class.prototype.constructor most az Object, mert egy objektumot adtunk meg prototípusnak. A Class példányok pedig ezt a viselkedést öröklik, és ezért elhasal a szintaxis ellenőrzőnk.

var Class=function (o)
{
	if (this.constructor!==arguments.callee)
	{
		throw new SyntaxError("class=new Class(...) is the right syntax");
	}
	return ClassFactory.createClass().append(o);
};

Ugye ilyenkor az arguments.callee a Class, a this.constructor pedig az Object. Ha átállítjuk a konstruktort Classra, akkor pedig a implementClassInterface()-ben a hasOwnProperty() nem fog átengedni egyetlen tulajdonságot sem, hiszen a Class.prototype-ot hasonlítja majd össze saját magával.

Én úgy döntöttem, hogy a gordiuszi csomó kibogozása helyett inkább átvágom azt. Szerintem a new Class(/* ... */) szintaxis megőrzése nem annyira fontos, szóval nem kezdtem áthidaló megoldás gyártásába, hanem inkább töröltem a szintaxist ellenőrző kódot. Veszteni nem vesztettem vele semmit, hiszen az osztályok építését a ClassFactory vezérli, a Class() függvényben pedig sehol máshol nem kerül elő a this kulcsszó.

var Class=function (o)
{
	return ClassFactory.createClass().append(o);
};

Így most már meg lehet hívni függvényként is a Classt, kinek ahogy tetszik.