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宝典学习笔记
Feb 07 Javascript
jQuery UI AutoComplete 使用说明
Jun 20 Javascript
浅谈JSON和JSONP区别及jQuery的ajax jsonp的使用
Nov 23 Javascript
javascript中String对象的slice()方法分析
Dec 20 Javascript
jquery小火箭返回顶部代码分享
Aug 19 Javascript
JS+DIV+CSS实现的经典标签切换效果代码
Sep 14 Javascript
JS中使用变量保存arguments对象的方法
Jun 03 Javascript
原生JS+Canvas实现五子棋游戏实例
Jun 19 Javascript
vue 文件目录结构详解
Nov 24 Javascript
webpack打包js的方法
Mar 12 Javascript
vue实现网络图片瀑布流 + 下拉刷新 + 上拉加载更多(步骤详解)
Jan 14 Javascript
在js文件中引入(调用)另一个js文件的三种方法
Sep 11 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
Yii中使用PHPExcel导出Excel的方法
2014/12/26 PHP
Laravel 登录后清空COOKIE的操作方法
2019/10/14 PHP
JQuery Tips(4) 一些关于提高JQuery性能的Tips
2009/12/19 Javascript
jQuery EasyUI API 中文文档 - DataGrid数据表格
2011/11/17 Javascript
jQuery自定义事件的简单实现代码
2014/01/27 Javascript
js 数组去重的四种实用方法
2014/09/09 Javascript
javascript正则表达式之search()用法实例
2015/01/19 Javascript
node.js中的forEach()是同步还是异步呢
2015/01/29 Javascript
jquery.validate使用时遇到的问题
2015/05/25 Javascript
极力推荐10个短小实用的JavaScript代码段
2016/08/03 Javascript
js实现简单的获取验证码按钮效果
2017/03/03 Javascript
jquery实现全选、全不选以及单选功能
2017/03/23 jQuery
node.js中cluster的使用教程
2017/06/09 Javascript
Angular实现下拉框模糊查询功能示例
2018/01/03 Javascript
Vue项目组件化工程开发实践方案
2018/01/09 Javascript
webpack4.x下babel的安装、配置及使用详解
2019/03/07 Javascript
快速了解Vue父子组件传值以及父调子方法、子调父方法
2020/07/15 Javascript
vue使用video插件vue-video-player的示例
2020/10/03 Javascript
vue项目中js-cookie的使用存储token操作
2020/11/13 Javascript
Vue使用Element实现增删改查+打包的步骤
2020/11/25 Vue.js
[07:08]2014DOTA2西雅图国际邀请赛 小组赛7月11日TOPPLAY
2014/07/11 DOTA
python实现爬虫统计学校BBS男女比例之多线程爬虫(二)
2015/12/31 Python
人生苦短我用python python如何快速入门?
2018/03/12 Python
python matlibplot绘制3D图形
2018/07/02 Python
python ftp 按目录结构上传下载的实现代码
2018/09/12 Python
修改python plot折线图的坐标轴刻度方法
2018/12/13 Python
python tkinter canvas 显示图片的示例
2019/06/13 Python
pycharm显示远程图片的实现
2019/11/04 Python
pytorch获取模型某一层参数名及参数值方式
2019/12/30 Python
python实现定时发送邮件
2020/12/23 Python
Python实现京东抢秒杀功能
2021/01/25 Python
学雷锋志愿服务月活动总结
2014/03/09 职场文书
葛优非诚勿扰搞笑征婚台词
2014/03/17 职场文书
保密承诺书范文
2014/03/27 职场文书
《静夜思》教学反思
2016/02/17 职场文书
nginx日志格式分析和修改
2022/04/28 Servers