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 相关文章推荐
单击浏览器右上角的X关闭窗口弹出提示的小例子
Jun 12 Javascript
html dom节点操作(获取/修改/添加或删除)
Jan 23 Javascript
改变状态栏文字的js代码
Jun 13 Javascript
js中iframe调用父页面的方法
Oct 30 Javascript
JavaScript中的数学运算介绍
Dec 29 Javascript
jQuery对象初始化的传参方式
Feb 26 Javascript
原生js实现类似弹窗抖动效果
Apr 02 Javascript
BACKBONE.JS 简单入门范例
Oct 17 Javascript
详解VueJs中的V-bind指令
May 03 Javascript
Ajax请求时无法重定向的问题解决代码详解
Jun 21 Javascript
微信小程序实现点击导航标签滚动定位到对应位置
Nov 19 Javascript
详解React路由传参方法汇总记录
Nov 29 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
15个小时----从修改程序到自己些程序
2006/10/09 PHP
说明的比较细的php 正则学习实例
2008/07/30 PHP
网页游戏开发入门教程三(简单程序应用)
2009/11/02 PHP
第二章 PHP入门基础之php代码写法
2011/12/30 PHP
php中动态修改ini配置
2014/10/14 PHP
Javascript 原型和继承(Prototypes and Inheritance)
2009/04/01 Javascript
jQuery的三种$()
2009/12/30 Javascript
jquery 锁定弹出层实现代码
2010/02/23 Javascript
div层的移动及性能优化
2010/11/16 Javascript
js实现点小图看大图效果的思路及示例代码
2013/10/28 Javascript
JavaScript cookie的设置获取删除详解
2014/02/11 Javascript
跟我学Node.js(四)---Node.js的模块载入方式与机制
2014/06/04 Javascript
微信小程序选择图片和放大预览图片功能
2017/11/02 Javascript
浅谈webpack编译vue项目生成的代码探索
2017/12/11 Javascript
JavaScript命名空间模式实例详解
2019/06/20 Javascript
vue 翻页组件vue-flip-page效果
2020/02/05 Javascript
Vuex中的Mutations的具体使用方法
2020/06/01 Javascript
[42:20]Secret vs Liquid 2019国际邀请赛小组赛 BO2 第二场 8.15
2019/08/17 DOTA
Python实现partial改变方法默认参数
2014/08/18 Python
Python实现的微信好友数据分析功能示例
2018/06/21 Python
pyqt5 lineEdit设置密码隐藏,删除lineEdit已输入的内容等属性方法
2019/06/24 Python
Python+AutoIt实现界面工具开发过程详解
2019/08/07 Python
python实现回旋矩阵方式(旋转矩阵)
2019/12/04 Python
CSS3 选择器 基本选择器介绍
2012/01/21 HTML / CSS
英国时尚首饰品牌:Missoma
2020/06/29 全球购物
Internet体系结构
2014/12/21 面试题
XMLHttpRequest对象在IE和Firefox中创建方式有没有不同
2016/03/23 面试题
工程预算与管理应届生求职信
2013/10/06 职场文书
超市营业员岗位职责
2013/12/20 职场文书
会计实训报告范文
2014/11/04 职场文书
生产车间主任岗位职责
2015/04/08 职场文书
迎新生欢迎词2015
2015/07/16 职场文书
2016年校园植树节广播稿
2015/12/17 职场文书
iPhone13 Pro外观确定,升级4800万镜头,4月20日发新品
2021/04/15 数码科技
pytorch 梯度NAN异常值的解决方案
2021/06/05 Python
Vue操作Storage本地化存储
2022/04/29 Vue.js