JS仿Base.js实现的继承示例


Posted in Javascript onApril 07, 2017

本文实例讲述了JS仿Base.js实现的继承。分享给大家供大家参考,具体如下:

var Klass = function() {};
Klass.extendClass = (function() {
  var F = function() {};
  return function(C, P) {
    F.prototype = P.prototype;
    C.prototype = new F();
    C.uper = P.prototype;
    C.prototype.constructor = C;
  };
})();
Klass.extend = function(props) {
  var _slice = Array.prototype.slice;
  var Glass = function() {
    /*if (Glass.uper && Glass.uper.hasOwnProperty("init")) {
      Glass.uper.init.apply(this, _slice.call(arguments))
    }*/
    if (Glass.prototype.hasOwnProperty("init")) {
      Glass.prototype.init.apply(this, _slice.call(arguments));
    }
  };
  Klass.extendClass(Glass, this);
  Glass.extend = this.extend;
  for (var key in props) {
    if (props.hasOwnProperty(key)) {
      Glass.prototype[key] = props[key];
    }
  }
  return Glass;
};

example:

var A = Klass.extend({
    init: function(name) {
      this.name = name;
      console.log('A constructor is running!');
    },
    getName: function() {
      return this.name;
    }
});
var B = A.extend({
    init: function(name) {
      this.name = name;
      console.log('B constructor is running!');
    },
    getName: function() {
      return this.name;
    },
    a: 'b'
});
var C = B.extend({
    init: function(name) {
      console.log('C constructor is running!');
    },
    c: 'c',
    getName: function() {
      var name = C.uper.getName.call(this);
      return 'Hi, I\'m' + this.name;
    }
});
var c1 = new C('zlf');
console.log(c1.getName());

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
JQuery 学习笔记 选择器之三
Jul 23 Javascript
JQuery实现倒计时按钮的实现代码
Mar 23 Javascript
JavaScript图片放大技术(放大镜)实现代码分享
Nov 14 Javascript
javascript获取函数名称、函数参数、对象属性名称的代码实例
Apr 12 Javascript
JavaScript简单表格编辑功能实现方法
Apr 16 Javascript
基于jQuery.validate及Bootstrap的tooltip开发气泡样式的表单校验组件思路详解
Jul 18 Javascript
React中使用async validator进行表单验证的实例代码
Aug 17 Javascript
微信小程序实现发送验证码按钮效果
Dec 20 Javascript
Vue监听滚动实现锚点定位(双向)示例
Nov 13 Javascript
Vue切换div显示隐藏,多选,单选代码解析
Jul 14 Javascript
简介JavaScript错误处理机制
Aug 04 Javascript
浅谈Vue开发人员的7个最好的VSCode扩展
Jan 20 Vue.js
vue-hook-form使用详解
Apr 07 #Javascript
ES6实现的遍历目录函数示例
Apr 07 #Javascript
如何使用vuejs实现更好的Form validation?
Apr 07 #Javascript
JS实现css hover操作的方法示例
Apr 07 #Javascript
微信小程序 chooseImage选择图片或者拍照
Apr 07 #Javascript
微信小程序page的生命周期和音频播放及监听实例详解
Apr 07 #Javascript
JavaScript使用链式方法封装jQuery中CSS()方法示例
Apr 07 #jQuery
You might like
PHP实现分页的一个示例
2006/10/09 PHP
Apache, PHP在Windows 9x/NT下的安装与配置 (一)
2006/10/09 PHP
echo(),print(),print_r()之间的区别?
2006/11/19 PHP
php验证是否是md5编码的简单代码
2014/04/01 PHP
PHP的mysqli_query参数MYSQLI_STORE_RESULT和MYSQLI_USE_RESULT的区别
2014/09/29 PHP
thinkphp数据查询和遍历数组实例
2014/11/28 PHP
PHP面向对象五大原则之接口隔离原则(ISP)详解
2018/04/04 PHP
Array 重排序方法和操作方法的简单实例
2014/01/24 Javascript
JS判断移动端访问设备并加载对应CSS样式
2014/06/13 Javascript
Node.js抓取中文网页乱码问题和解决方法
2015/02/10 Javascript
jQuery实现选项联动轮播效果【附实例】
2016/04/19 Javascript
图片懒加载插件实例分享(含解析)
2017/01/09 Javascript
angular6.x中ngTemplateOutlet指令的使用示例
2018/08/09 Javascript
javascript浅层克隆、深度克隆对比及实例解析
2020/02/09 Javascript
[26:24]完美副总裁、DOTA2负责人蔡玮专访:电竞如人生
2014/09/11 DOTA
[01:14:34]DOTA2上海特级锦标赛C组资格赛#2 LGD VS Newbee第一局
2016/02/28 DOTA
python访问系统环境变量的方法
2015/04/29 Python
浅谈Python中用datetime包进行对时间的一些操作
2016/06/23 Python
python顺序执行多个py文件的方法
2019/06/29 Python
使用Python代码实现Linux中的ls遍历目录命令的实例代码
2019/09/07 Python
50行Python代码实现视频中物体颜色识别和跟踪(必须以红色为例)
2019/11/20 Python
Python基于进程池实现多进程过程解析
2020/04/30 Python
Python爬虫之Spider类用法简单介绍
2020/08/04 Python
Django Auth用户认证组件实现代码
2020/10/13 Python
Python3.9最新版下载与安装图文教程详解(Windows系统为例)
2020/11/28 Python
美国最大的万圣节服装网站:HalloweenCostumes.com
2017/10/12 全球购物
Yves Rocher捷克官方网站:植物化妆品的创造者
2019/07/31 全球购物
美容师的职业规划书
2013/12/27 职场文书
质检部职责
2013/12/28 职场文书
秋季婚礼证婚词
2014/01/11 职场文书
班级入场式解说词
2014/02/01 职场文书
酒店保安领班职务说明书
2014/03/04 职场文书
村级环境卫生整治方案
2014/05/04 职场文书
党支部换届选举方案
2014/05/08 职场文书
学校募捐倡议书
2014/05/14 职场文书
2015年个人实习工作总结
2015/05/28 职场文书