javaScript面向对象继承方法经典实现


Posted in Javascript onAugust 20, 2013

JavaScript的出现已经将近20多年了,但是对这个预言的褒贬还是众说纷纭。很多人都说JavaScript不能算是面向对象的变成语言。但是JavaScript的类型非常松散,也没有编译器。这样一来给了程序员很大的自由,也带来了一些缺陷。

虽然JavaScript不算是一门面向对象的语言。但是我们可以模仿着其他语言实现面向对象的方式来实现JavaScript的面向编程。

下面是JavaScript教程中非常经典的继承方法。

//定义一个Pet对象。通过这一个名称和数量的腿。 
var Pet = function (name,legs) { 
this.name = name; //Save ths name and legs values. 
this.legs = legs; 
}; //创建一个方法,显示了Pet的名字和数量的腿。 
Pet.prototype.getDetails = function () { 
return this.name + " has " + this.legs + " legs "; 
} 
//定义一个Cat对象,继承从Pet。 
var Cat = function (name) { 
Pet.call(this,name,4); //调用这个父对象的构造函数 
}; 
//这条线执行继承从Pet。 
Cat.prototype = new Pet(); 
//增加一个动作方法的猫 
Cat.prototype.action = function () { 
return "Catch a bird"; 
}; 
//创建一个实例petCat的猫。 
var petCat = new Cat("felix"); 
var details = petCat.getDetails(); 
console.log(details) //"felix has 4 legs". 
var action = petCat.action(); 
console.log(action) //"Catch a bird". 
petCat.name = "sylvester"; //改变petCat的名字 
petCat.legs = 7; //改变petCat腿的数量 
details = petCat.getDetails(); 
console.log(details) //"sylvester has 7 legs".

上述方法虽然执行起来没有太大的问题,但是代码整体风格略显臃肿,并不很优雅。在外面还是可以对属性进行修改。这种方法没有对继承的属性进行保护。下面一种方法,省去的new和prototype,利用“函数继承”的特性实现。
//定义一个pet对象。通过这一个名称和数量的腿。 
var pet = function (name,legs) { 
//创建一个对象that,其中名字是可以改的,但是腿数不可以改,实现了变量私有化。 
var that = { 
name : name, 
getDetails : function () { 
return that.name + " has " + legs + " legs "; 
} 
}; return that; 
} 
//定义一个cat对象,继承从pet。 
var cat = function (name) { 
var that = pet(name,4); //从pet中继承属性 
//cat中增加一个action的方法。 
that.action = function () { 
return "Catch a bird"; 
} 
return that; 
} 
//创建一个petCat2; 
var petCat2 = cat("Felix"); 
var details = petCat2.getDetails(); 
console.log(details) //"felix has 4 legs". 
var action = petCat2.action(); 
console.log(action) //"Catch a bird". 
petCat2.name = "sylvester"; //我们可以改变名字。 
petCat2.legs = 7; //但是不可以改变腿的数量 
details = petCat2.getDetails(); 
console.log(details) //"sylvester has 4 legs".

温馨提示:使用原型继承的好处是内存效率高,不管它被继承多少次,对象的原型属性和方法只被保存一次。函数继承的时候,每个新的实例都会创建重复的属性和方法。若创建很多大的对象,内存消耗会很大。解决方法是把较大的属性或方法保存在一个对象中,并将其作为参数传给构造函数。这样所有实例就会使用一个对象资源,而不是创建自己的版本了。

上面两种方法都可以轻松实现JavaScript面向对象的继承,没有哪种方法绝对的好,也没有哪种方法绝对的不好。依个人情况喜好而定。这两种方法也不是唯一的,欢迎大家评论补充哟!~

Javascript 相关文章推荐
javascript深入理解js闭包
Jul 03 Javascript
JS获取后台Cookies值的小例子
Mar 04 Javascript
ui组件之input多选下拉实现方法(带有搜索功能)
Jul 14 Javascript
Javascript中判断一个值是否为undefined的方法详解
Sep 28 Javascript
Bootstrap Table使用方法解析
Oct 19 Javascript
jQuery实现的简单悬浮层功能完整实例
Jan 23 Javascript
JS去除字符串中空格的方法
Feb 14 Javascript
基于vue的fullpage.js单页滚动插件
Mar 20 Javascript
JS实现简单的选择题测评系统代码思路详解(demo)
Sep 03 Javascript
vue.js+elementUI实现点击左右箭头切换头像功能(类似轮播图效果)
Sep 05 Javascript
微信小程序 多行文本显示...+显示更多按钮和收起更多按钮功能
Sep 26 Javascript
js实现查询商品案例
Jul 22 Javascript
Table冻结表头示例代码
Aug 20 #Javascript
JQuery判断子iframe何时加载完成解决方案
Aug 20 #Javascript
jQuery回车实现登录简单实现
Aug 20 #Javascript
jquery 延迟执行实例介绍
Aug 20 #Javascript
多种方式实现JS调用后台方法进行数据交互
Aug 20 #Javascript
js获取指定日期前后的日期代码
Aug 20 #Javascript
js 自定义个性下拉选择框示例
Aug 20 #Javascript
You might like
php下使用curl模拟用户登陆的代码
2010/09/10 PHP
记录mysql性能查询过程的使用方法
2013/05/02 PHP
php过滤所有的空白字符(空格、全角空格、换行等)
2015/10/27 PHP
ThinkPHP使用Ueditor的方法详解
2016/05/20 PHP
PHP工厂模式的日常使用
2019/03/20 PHP
javascript中encodeURI和decodeURI方法使用介绍
2013/05/06 Javascript
调试代码导致IE出错的避免方法
2014/04/04 Javascript
一个简单的jquery进度条示例
2014/04/28 Javascript
js实现星星打分效果的方法
2020/07/05 Javascript
详解nodejs 文本操作模块-fs模块(三)
2016/12/22 NodeJs
Bootstrap table简单使用总结
2017/02/15 Javascript
jQuery validate 验证radio实例
2017/03/01 Javascript
AngularJS中控制器函数的定义与使用方法示例
2017/10/10 Javascript
Vuejs 2.0 子组件访问/调用父组件的方法(示例代码)
2018/02/08 Javascript
[01:38]完美世界高校联赛决赛花絮
2018/12/02 DOTA
[04:09]2018年度DOTA2社区贡献奖-完美盛典
2018/12/16 DOTA
Python函数返回值实例分析
2015/06/08 Python
使用Nginx+uWsgi实现Python的Django框架站点动静分离
2016/03/21 Python
从零开始学Python第八周:详解网络编程基础(socket)
2016/12/14 Python
使用Python中的tkinter模块作图的方法
2017/02/07 Python
python之yield和Generator深入解析
2019/09/18 Python
Python常用模块os.path之文件及路径操作方法
2019/12/03 Python
tensorflow实现残差网络方式(mnist数据集)
2020/05/26 Python
python 利用zmail库发送邮件
2020/09/11 Python
Pycharm Available Package无法显示/安装包的问题Error Loading Package List解决
2020/09/18 Python
Python机器学习工具scikit-learn的使用笔记
2021/01/28 Python
美国购买隐形眼镜网站:Lenses For Less
2020/07/05 全球购物
证婚人搞笑证婚词
2014/01/10 职场文书
微电影大赛策划方案
2014/06/05 职场文书
4s店销售经理岗位职责
2014/07/19 职场文书
单位工作证明
2014/10/07 职场文书
公安个人四风问题对照检查及整改措施
2014/10/28 职场文书
招标保密承诺书
2015/01/20 职场文书
索赔员岗位职责
2015/02/15 职场文书
2015应届毕业生求职信范文
2015/03/20 职场文书
大学生安全教育主题班会
2015/08/12 职场文书