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 相关文章推荐
javascript 自动填写表单的实现方法
Apr 09 Javascript
IE6下CSS图片缓存问题解决方法
Dec 09 Javascript
JQuery动态给table添加、删除行 改进版
Jan 19 Javascript
javascript之querySelector和querySelectorAll使用介绍
Dec 20 Javascript
瀑布流布局并自动加载实现代码
Mar 12 Javascript
js数组与字符串的相互转换方法
Jul 09 Javascript
详解javascript事件冒泡
Jan 09 Javascript
JavaScript基于DOM操作实现简单的数学运算功能示例
Jan 16 Javascript
Js利用Canvas实现图片压缩功能
Sep 13 Javascript
vue中el-upload上传图片到七牛的示例代码
Oct 19 Javascript
vue实现axios图片上传功能
Aug 20 Javascript
Swiper实现导航栏滚动效果
Oct 16 Javascript
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
全国FM电台频率大全 - 10 江苏省
2020/03/11 无线电
在字符串中把网址改成超级链接
2006/10/09 PHP
用PHP读取flv文件的播放时间长度
2009/09/03 PHP
关于zend studio 出现乱码问题的总结
2013/06/23 PHP
Linux系统下使用XHProf和XHGui分析PHP运行性能
2015/12/08 PHP
Laravel框架实现利用监听器进行sql语句记录功能
2018/06/06 PHP
JavaScript 字符编码规则
2009/05/04 Javascript
jQuery的实现原理的模拟代码 -4 重要的扩展函数 extend
2010/08/03 Javascript
JQuery中$之选择器用法介绍
2011/04/05 Javascript
用JS提交参数创建form表单在FireFox中遇到的问题
2013/01/16 Javascript
javascript实现checkBox的全选,反选与赋值
2015/03/12 Javascript
js HTML5 Ajax实现文件上传进度条功能
2016/02/13 Javascript
jQuery+php实时获取及响应文本框输入内容的方法
2016/05/24 Javascript
windows下vue-cli导入bootstrap样式
2017/04/25 Javascript
集合Bootstrap自定义confirm提示效果
2017/09/19 Javascript
基于VuePress 轻量级静态网站生成器的实现方法
2018/04/17 Javascript
小程序云开发如何实现图片上传及发表文字
2019/05/17 Javascript
vue使用nprogress加载路由进度条的方法
2020/06/04 Javascript
vue中的v-model原理,与组件自定义v-model详解
2020/08/04 Javascript
用Python代码来绘制彭罗斯点阵的教程
2015/04/03 Python
Python中的正则表达式与JSON数据交换格式
2019/07/03 Python
在python中实现同行输入/接收多个数据的示例
2019/07/20 Python
python是否适合网页编程详解
2019/10/04 Python
python matplotlib画盒图、子图解决坐标轴标签重叠的问题
2020/01/19 Python
详解Ubuntu环境下部署Django+uwsgi+nginx总结
2020/04/02 Python
Python Dict找出value大于某值或key大于某值的所有项方式
2020/06/05 Python
通过实例了解Python异常处理机制底层实现
2020/07/23 Python
用CSS3写的模仿iPhone中的返回按钮
2015/04/04 HTML / CSS
Lookfantastic葡萄牙官方网站:欧洲第一大化妆品零售商
2018/03/17 全球购物
Bravofly德国:预订廉价航班和酒店
2019/09/22 全球购物
德国W家官网,可直邮中国的母婴商城:Windeln.de
2021/03/03 全球购物
摄影专业毕业生求职信
2014/03/13 职场文书
出国留学经济担保书
2014/04/01 职场文书
检察机关个人对照检查材料
2014/09/15 职场文书
运动会闭幕词
2015/01/28 职场文书
Elasticsearch 聚合查询和排序
2022/04/19 Python