javascript 面向对象,实现namespace,class,继承,重载


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 相关文章推荐
服务端 VBScript 与 JScript 几个相同特性的写法 By shawl.qiu
Mar 06 Javascript
js判断背景图片是否加载成功使用img的width实现
May 29 Javascript
js操作IE浏览器弹出浏览文件夹可以返回目录路径
Jul 14 Javascript
javascript实现简易计算器的代码
May 31 Javascript
Vue非父子组件通信详解
Jun 12 Javascript
react实现一个优雅的图片占位模块组件详解
Oct 30 Javascript
基于three.js编写的一个项目类示例代码
Jan 05 Javascript
解决VUE框架 导致绑定事件的阻止冒泡失效问题
Feb 24 Javascript
简单的vuex 的使用案例笔记
Apr 13 Javascript
解决layui中的form表单与button的点击事件冲突问题
Aug 15 Javascript
详解VS Code使用之Vue工程配置format代码格式化
Mar 20 Javascript
微信小程序开发之点击按钮退出小程序的实现方法
Apr 26 Javascript
javascript实现的距离现在多长时间后的一个格式化的日期
Oct 29 #Javascript
jQuery 判断元素上是否绑定了事件
Oct 28 #Javascript
Firebug 字幕文件JSON地址获取代码
Oct 28 #Javascript
jquery 选择器部分整理
Oct 28 #Javascript
JavaScript 全角转半角部分
Oct 28 #Javascript
js apply/call/caller/callee/bind使用方法与区别分析
Oct 28 #Javascript
javascript 时间比较实现代码
Oct 28 #Javascript
You might like
如何对PHP程序中的常见漏洞进行攻击(下)
2006/10/09 PHP
PHP魔术方法使用方法汇总
2016/02/14 PHP
单击浏览器右上角的X关闭窗口弹出提示的小例子
2013/06/12 Javascript
简单常用的幻灯片播放实现代码
2013/09/25 Javascript
使用JS CSS去除IE链接虚线框的三种方法
2013/11/14 Javascript
JQuery与JS里submit()的区别示例介绍
2014/02/17 Javascript
超链接的禁用属性Disabled使用示例
2014/07/31 Javascript
Javascript基础教程之JavaScript语法
2015/01/18 Javascript
webpack+vue.js实现组件化详解
2016/10/12 Javascript
完美解决jQuery fancybox ie 无法显示关闭按钮的问题
2016/11/29 Javascript
Bootstrap按钮组实例详解
2017/07/03 Javascript
VUE实现表单元素双向绑定(总结)
2017/08/08 Javascript
JS实现匀加速与匀减速运动的方法示例
2017/09/04 Javascript
详解HTML5 使用video标签实现选择摄像头功能
2017/10/25 Javascript
关于微信公众号开发无法支付的问题解决
2018/12/28 Javascript
JS脚本实现定时到网站上签到/签退功能
2020/04/22 Javascript
JavaScript中layim之整合右键菜单的示例代码
2021/02/06 Javascript
原生JavaScript实现进度条
2021/02/19 Javascript
Python Socket编程详细介绍
2017/03/23 Python
利用信号如何监控Django模型对象字段值的变化详解
2017/11/27 Python
Python中defaultdict与lambda表达式用法实例小结
2018/04/09 Python
浅谈python 中的 type(), dtype(), astype()的区别
2020/04/09 Python
浅谈Python3中print函数的换行
2020/08/05 Python
HTML5 Canvas+JS控制电脑或手机上的摄像头实例
2014/05/03 HTML / CSS
Nike瑞典官方网站:Nike.com (SE)
2018/11/26 全球购物
会计自荐书
2013/12/02 职场文书
数控技术学生的自我评价
2014/02/15 职场文书
党的群众路线教育实践活动学习心得体会
2014/03/03 职场文书
车间主任岗位职责
2015/02/03 职场文书
锅炉工岗位职责
2015/02/13 职场文书
2015年小学生暑假总结
2015/07/13 职场文书
感恩的心主题班会
2015/08/12 职场文书
2017年寒假社区服务活动总结
2016/04/06 职场文书
2019最新激励员工口号大全!
2019/06/28 职场文书
fastdfs+nginx集群搭建的实现
2021/03/31 Servers
MYSQL如何查看操作日志详解
2022/05/30 MySQL