前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >javascript实现最基本、最简单的继承

javascript实现最基本、最简单的继承

作者头像
web前端教室
发布2018-02-06 11:01:30
5440
发布2018-02-06 11:01:30
举报

js的OO方面的文章,没有八千,也有一万了,多也不多我这一篇,

更何况还是原创。

要说继承,就得有个“根”,就是你从哪、从谁那继续。

就是说,先得有个被继承的函数,“构造函数”:

function rootObj(n){
 this.name = n;
}

然后你可以给它添加方法:

rootObj.prototype.m1 = function(m1){
 console.log( m1 )
}

然后可以这么使用:

var obj1 = new rootObj();
obj1.m1('m1m1');

打印出:m1m1

这是继续么?当然不是,那这是什么呢?

这是原型添加自定义方法。

要想用到继承,还得接着往下写,

定义子类 childrenObj,

function childrenObj(n){
 rootObj.call(this,n);//调用了根类
}
//使用根类rootObj的实例,做为子类的原型,
//修改子类的原型链了
childrenObj.prototype = new rootObj();
//单独给子类添加方法c1
childrenObj.prototype.c1 = function(){
 console.log(c1)
}
//实例化子类,运行看结果
var objc = new childrenObj();
objc.c1('c1'); //输出c1
objc.m1('m1'); //输出m1

会看到子类childrenObj,

即可以调用自身添加的原型方法c1,

也可以调用根类的原型方法m1

而这,就是继承,

javascript的原型继承!

关键的知识点有二个:

(1)、rootObj.call(this,n);

(2)、childrenObj.prototype = new rootObj();

第一个call不多说了,自己百度下有很多资料。

第二个是,是因为JS内部,对象的方法和属性的查找方式,

是通过prototype来实现的。

就是你声明变量后,赋值new了一个函数时,

也会把这个函数的prototype对象一起赋值过去,

这就形成了原型链。

很简单的,自己多练习练习,就秒懂。

本文参与 腾讯云自媒体分享计划,分享自微信公众号。
原始发表:2016-01-16,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 web前端教室 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档