A javascript class for retrieving query string
In the previous article, "Add property to Javascript Object in 'jQuery' style", I have mentioned the technique of how to add a property to a Javascript Object. With the predefined rules set to the properties, we can create pretty good Javascript Objects with encapsulation, and furthermore, we can prevent the misuse of the Javascript Object by other user who can access the object.
Object Oriented programmers are not satisfied with "Encapsulated Javascript Object". It's better if we can extend the "Encapsulated Javascript Object" to "Encapsulated Javascript Class". The basic for creating encapsulated javascript class requires javascript function enclosures. If you are not familar with javascript enclosures, you can see the article:"Javascript function closures and design of encapsulated javascript object and class". The following code is an updated version of "encapsulated javascript class"
<script type="text/javascript">
if(typeof Function.property=="undefined")(function($){
function property(obj,name,e,predicate,converter){
var value;
obj[name]=function(e){
if(typeof e=="undefined") return value;
if(converter)e=converter(e);
if(predicate && predicate(e))value=e;
return obj
};
if (typeof e!="undefined") obj[name](e);
return obj
}
$.property=function(name,predicate,converter){
this.prototype[name]=function(value){
property(this,name,value,predicate,converter);
return this;
};
return this
};
$.sharedProperty=function(name, predicate){
var value;
this.prototype[name]=function(e){
if(typeof e=="undefined") return value;
if(predicate && predicate(e)) value=e;
return this
};
return this
};
})(Function.prototype); //Function prototype
CheckRules={
STRING:function(x){return typeof x=="string"},
NUMBER:function(x){return typeof x=="number"},
BOOLEAN:function(x){return typeof x=="boolean"},
IP:function(x){return typeof x=="string" && /^((25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$/.test(x)}
};
Converter={
toString:function(x){return ""+x},
toLowerCase:function(x){return (""+x).toLowerCase()}
};
$.createObject=function(e){
if(CheckRules.STRING(e)) return new $[e.toLowerCase()]
};
</script>
Yes, you should observed that I have added share property prototype as well. Now you can modify any class using one-line javascript just like the following:
<script type="text/javascript">
function Person(){};
Person.property("age",CheckRules.NUMBER).property("name",CheckRules.STRING).sharedProperty("familyName",CheckRules.STRING);
var a=new Person();
var b=new Person();
a.name("C. F.").age(20).familyName("Wong");
b.name("Cloudgen").age(23);
document.write("My name is "+a.name()+", my age is "+a.age()+". I come from "+ a.familyName()+"'s family<"+"br/>");
document.write("My name is "+b.name()+", my age is "+b.age()+". I come from "+ b.familyName()+"'s family<"+"br/>");
</script>
view examplet - the online example from Cloudgen's Examplet Store(ces)
Cheers,
Previous in This Category: Load a cross-server javascript dynamically Next in This Category: One line properties setter and getter for Javascript class
