js类式继承与原型式继承详解


Posted in Javascript onApril 07, 2016

本文实例为大家分享了js类式继承与原型式继承相关代码,供大家参考,具体内容如下

1.js类式继承

/* -- 类式继承 -- */
//先声明一个超类

function Person(name) {
this.name = name;
}
//给这个超类的原型对象上添加方法 getName 
Person.prototype.getName = function() {
return this.name;
}
//实例化这个超
var a = new Person('Darren1')
console.log(a.getName());//Darren1

//再声明类

function Programmer(name, sex) {
//这个类中要调用超类Person的构造函数,并将参数name传给它
Person.call(this, name);
this.sex = sex;
}
//这个子类的原型对象等于超类的实例
Programmer.prototype = new Person();
//因为子类的原型对象等于超类的实例,所以prototype.constructor这个方法也等于超类构造函数,你可以自己测试一下,如果没这一步,console.log(Programmer.prototype.constructor这个是Person超类的引用,所以要从新赋值为自己本身

console.log(Programmer.prototype.constructor);
/*function Person(name) {
this.name = name;
} */

Programmer.prototype.constructor = Programmer;
console.log(Programmer.prototype.constructor);

/*function Programmer(name, sex) {
Person.call(this, name);
this.sex = sex;
} 
*/
//子类本身添加了getSex 方法
Programmer.prototype.getSex = function() {
return this.sex;
}
//实例化这个子类
var _m = new Programmer('Darren2', 'male');
//自身的方法
console.log(_m.getSex());//male
//继承超类的方法
console.log(_m.getName());//Darren2

2.js原型式继承

/* -- 原型式继承 -- */
//clone()函数用来创建新的类Person对象
var clone = function(obj) {
4
var _f = function() {};
//这句是原型式继承最核心的地方,函数的原型对象为对象字面量
_f.prototype = obj;
return new _f;
}
//先声明一个对象字面量
var Person = {
name: 'Darren',
getName: function() {
return this.name;
}
}
//不需要定义一个Person的子类,只要执行一次克隆即可
var Programmer = clone(Person);
//可以直接获得Person提供的默认值,也可以添加或者修改属性和方法
alert(Programmer.getName())
Programmer.name = 'Darren2'
alert(Programmer.getName())

//声明子类,执行一次克隆即可
var Someone = clone(Programmer);

以上就是本文的全部内容,希望对大家学习javascript程序设计有所帮助。

Javascript 相关文章推荐
24款非常有用的 jQuery 插件分享
Apr 06 Javascript
简单的js图片轮换代码(js图片轮播)
May 06 Javascript
jQuery带箭头提示框tooltips插件集锦
Nov 17 Javascript
JavaScript实现iframe自动高度调整和不同主域名跨域
Feb 27 Javascript
JS正则RegExp.test()使用注意事项(不具有重复性)
Dec 28 Javascript
node.js 抓取代理ip实例代码
Apr 30 Javascript
理解 javascript 中的函数表达式与函数声明
Jul 07 Javascript
通过vue-cli3构建一个SSR应用程序的方法
Sep 13 Javascript
微信小程序开发之tabbar图标和颜色的实现
Oct 17 Javascript
trackingjs+websocket+百度人脸识别API实现人脸签到
Nov 26 Javascript
vue实现todolist功能、todolist组件拆分及todolist的删除功能
Apr 11 Javascript
小程序开发之模态框组件封装
Apr 23 Javascript
javascript原型继承工作原理和实例详解
Apr 07 #Javascript
浅析JS原型继承与类的继承
Apr 07 #Javascript
AngularJs 弹出模态框(model)
Apr 07 #Javascript
详解AngularJS 模态对话框
Apr 07 #Javascript
分离与继承的思想实现图片上传后的预览功能:ImageUploadView
Apr 07 #Javascript
jQuery动态添加
Apr 07 #Javascript
javascript模块化简单解析
Apr 07 #Javascript
You might like
PHP调用接口用post方法传送json数据的实例
2018/05/31 PHP
javascript oop开发滑动(slide)菜单控件
2010/08/25 Javascript
myeclipse安装jQuery插件的方法
2011/03/29 Javascript
javascript实现div的显示和隐藏的小例子
2013/06/25 Javascript
jquery ajax jsonp跨域调用实例代码
2013/12/11 Javascript
jQuery on()方法使用技巧详解
2015/04/16 Javascript
jquery小火箭返回顶部代码分享
2015/08/19 Javascript
js实现继承的5种方式
2015/12/01 Javascript
学习javascript面向对象 javascript实现继承的方式
2016/01/04 Javascript
微信小程序 使用腾讯地图SDK详解及实现步骤
2017/02/28 Javascript
关于bootstrap日期转化,bootstrap-editable的简单使用,bootstrap-fileinput的使用详解
2017/05/12 Javascript
微信小程序城市定位的实现实例(获取当前所在国家城市信息)
2017/05/17 Javascript
angular-ngSanitize模块-$sanitize服务详解
2017/06/13 Javascript
Angularjs上传图片实例详解
2017/08/06 Javascript
使用jquery的jsonp如何发起跨域请求及其原理详解
2017/08/17 jQuery
js 概率计算(简单版)
2017/09/12 Javascript
利用JS实现scroll自定义滚动效果详解
2017/10/17 Javascript
js判断节假日实例代码
2017/12/27 Javascript
一个基于react的图片裁剪组件示例
2018/04/18 Javascript
vue-cli3配置与跨域处理方法
2019/08/17 Javascript
vue项目中使用vue-layer弹框插件的方法
2020/03/11 Javascript
利用Python爬取可用的代理IP
2016/08/18 Python
python音频处理用到的操作的示例代码
2017/10/27 Python
python合并同类型excel表格的方法
2018/04/01 Python
Python中使用双下划线防止类属性被覆盖问题
2019/06/27 Python
Python Pandas 如何shuffle(打乱)数据
2019/07/30 Python
python批量解压zip文件的方法
2019/08/20 Python
python求绝对值的三种方法小结
2019/12/04 Python
pycharm2020.1.2永久破解激活教程,实测有效
2020/10/29 Python
Anaconda详细安装步骤图文教程
2020/11/12 Python
python函数超时自动退出的实操方法
2020/12/28 Python
详解HTML5中CSS外观属性
2020/09/10 HTML / CSS
美国相机和电子产品零售商:Beach Camera
2020/11/26 全球购物
2014年小学重阳节活动策划方案
2014/09/16 职场文书
学生会感恩节活动方案
2014/10/11 职场文书
分享几个JavaScript运算符的使用技巧
2021/04/24 Javascript