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 相关文章推荐
一个用js实现的页内搜索代码
May 23 Javascript
js 完美图片新闻轮转效果,腾讯大粤网首页图片轮转改造而来
Nov 21 Javascript
js关闭浏览器窗口及检查浏览器关闭事件
Sep 03 Javascript
jQuery 仿百度输入标签插件附效果图
Jul 04 Javascript
js的image onload事件使用遇到的问题
Jul 15 Javascript
详解js中构造流程图的核心技术JsPlumb
Dec 08 Javascript
JS中setTimeout的巧妙用法前端函数节流
Mar 24 Javascript
js中string和number类型互转换技巧(分享)
Nov 28 Javascript
vue地区选择组件教程详解
May 04 Javascript
vue检测对象和数组的变化分析
Jun 30 Javascript
详解vue使用插槽分发内容slot的用法
Mar 28 Javascript
javascript对象3个属性特征
Nov 17 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
php_screw 1.5:php加密: 安装与使用详解
2013/06/20 PHP
php获取数据库结果集方法(推荐)
2017/06/01 PHP
PHP hex2bin()函数用法讲解
2019/02/25 PHP
laravel5.6 框架操作数据 Eloquent ORM用法示例
2020/01/26 PHP
js计数器代码
2006/11/04 Javascript
用javascript实现页面打印的三种方法
2007/03/05 Javascript
js判断当前浏览器类型,判断IE浏览器方法
2014/06/02 Javascript
使用Node.js配合Nginx实现高负载网络
2015/06/28 Javascript
基于JavaScript代码实现微信扫一扫下载APP
2015/12/30 Javascript
5个最顶级jQuery图表类库插件【jquery插件库】
2016/05/05 Javascript
jQuery+CSS3+Html5实现弹出层效果实例代码(附源码下载)
2016/05/16 Javascript
基于jQuery下拉选择框插件支持单选多选功能代码
2016/06/07 Javascript
jQuery基于函数重载实现自定义Alert函数样式的方法
2016/07/27 Javascript
JavaScipt选取文档元素的方法(推荐)
2016/08/05 Javascript
vue项目总结之文件夹结构配置详解
2017/12/13 Javascript
JS合并两个数组的3种方法详解
2019/10/24 Javascript
JS实现鼠标按下拖拽效果
2020/07/23 Javascript
vc6编写python扩展的方法分享
2014/01/17 Python
pymongo为mongodb数据库添加索引的方法
2015/05/11 Python
在Python中操作字典之update()方法的使用
2015/05/22 Python
多版本Python共存的配置方法
2017/05/22 Python
最近Python有点火? 给你7个学习它的理由!
2017/06/26 Python
Python3 Random模块代码详解
2017/12/04 Python
解决nohup重定向python输出到文件不成功的问题
2018/05/11 Python
Python DataFrame 设置输出不显示index(索引)值的方法
2018/06/07 Python
Python3实现从排序数组中删除重复项算法分析
2019/04/03 Python
PyQt5实现从主窗口打开子窗口的方法
2019/06/19 Python
Django后端发送小程序微信模板消息示例(服务通知)
2019/12/17 Python
html2 canvas生成清晰的图片实现打印功能
2019/09/23 HTML / CSS
英国虚拟主机服务商:eUKhost
2016/08/16 全球购物
计算机应用毕业生自荐信
2013/10/23 职场文书
初三学生个人自我评定
2014/04/06 职场文书
优秀应届生求职信
2014/06/16 职场文书
mysql知识点整理
2021/04/05 MySQL
Python实现机器学习算法的分类
2021/06/03 Python
vue动态绑定style样式
2022/04/20 Vue.js