Posted in Javascript onOctober 29, 2009
由于组里项目大多的javascript,css等客户端工作是另一同事在负责,该同事又特忙无法重构,老大也就只是提建议并未立即实施重构。但是我前些日子也改过些许客户端的小bug,确实那代码看得让人有些云里雾里,不知身在哪山,轻易不敢动代码,于是就自己动手鼓捣起我曾又爱又恨的javascript来,自己写一个简单的js实现namespace,继承,重载等面向对象的特性.欢迎拍砖灌水
.定义namespace
Namesapce.js
Namespace = new Object(); Namespace.register = function(fullname){ try { var nsArray = fullname.split("."); var strNS = ""; var strEval = ""; for(var i=0;i<nsArray.length;i++){ if(strNS.length >0) strNS += "."; strNS += nsArray[i]; strEval += " if(typeof("+ strNS +") =='undefined') " + strNS + " = new Object(); "; } if(strEval != "") eval(strEval); }catch(e){alert(e.message);} }
.Employee.js
Employee.js
//注册命名空间 Namespace.register("MyCompany"); //1.类:雇员 MyCompany.Employee = function(empName){ this.Name = empName; this.Salary = 1000; this.Position = "cleaner"; } MyCompany.Employee.prototype.ShowName = function(){ return "I'm "+this.Name+",my salary is $" + this.Salary; } MyCompany.Employee.prototype.Work = function(){ return "I'm a "+ this.Position +",I'm cleaning all day!" } //2.类:程序员 MyCompany.Developer = function(empName){ //继承父类属性 MyCompany.Employee.call(this,empName); //覆盖父类属性 this.Position = "developer"; //扩展属性 this.Technology = "C#"; } //继承父类原型方法 MyCompany.Developer.prototype = new MyCompany.Employee(); //覆盖父类方法 MyCompany.Developer.prototype.Work = function(){ return "I'm a "+ this.Position +",i'm good at "+ this.Technology +",i'm coding all day!" }
测试代码
<html> <title>javascript 面向对象的实现 namespace,class,继承,重载</title> <head> <script language="javascript" src="namespace.js" type="text/javascript"></script> <script language="javascript" src="employee.js" type="text/javascript"></script> <script language="javascript" type="text/javascript"> function showEmployee(){ var emp = new MyCompany.Employee("xiaoming"); showInfo(emp); } function showDeveloper(){ var emp = new MyCompany.Developer("Gates"); showInfo(emp); } function showInfo(emp){ alert(emp.ShowName()); alert(emp.Work()); } </script> </head> <body> <input type="button" value="show employee info" onclick="showEmployee();"/><br/><br/> <input type="button" value="show developer info" onclick="showDeveloper();"/> </body> </html>
源代码打包下载
javascript 面向对象,实现namespace,class,继承,重载
声明:登载此文出于传递更多信息之目的,并不意味着赞同其观点或证实其描述。
Reply on: @reply_date@
@reply_contents@