JavaScript使用Simple Inheritance创建自己的类

这篇文章主要为大家详细介绍了JavaScript 使用Simple Inheritance创建自己的类示例，具有一定的参考价值，可以用来参考一下。

/**
 * 使用Simple Inheritance创建类
 *
 * @param 
 * @arrange （www.idcnote.com）
 **/
(function() {
 /*
  * Simple Inheritance
  */
 var initializing = false;
 var fnTest = /xyz/.test(function() {
  xyz;
 }) ? /\b_super\b/ : /.*/;
 this.Class = function() {};
 Class.extend = function(prop) {
  var _super = this.prototype;
  initializing = true;
  var prototype = new this();
  initializing = false;
  for (var name in prop) {
   prototype[name] = typeof prop[name] == "function" &&
    typeof _super[name] == "function" && fnTest.test(prop[name]) ?
    (function(name, fn) {
    return function() {
     var tmp = this._super;
     this._super = _super[name];
     var ret = fn.apply(this, arguments);
     this._super = tmp;
     return ret;
    };
   })(name, prop[name]) :
    prop[name];
  }
  function Class() {
   if (!initializing && this.init)
    this.init.apply(this, arguments);
  }
  Class.prototype = prototype;
  Class.constructor = Class;
  Class.extend = arguments.callee;
  return Class;
 };
})();

$(function() {
 //定义一个Box的类
 var Box = Class.extend({
  init: function(opts) {
   opts = $.extend({
    "element": 'box'
   }, opts || {});
   this.opts = opts;
   this.element = $(opts.element);
   this.render();
  },
  render: function() {
   var elEl = this.element;
   elEl.html(this.opts.name + '，' + this.opts.age);
   this.show();
  },
  show: function() {
   var elEl = this.element;
   elEl.show();
  }
 });

 //实例1 - 直接用new来实例化Box
 var mybox = new Box({
  element: '.mybox',
  name: '张三',
  age: 15
 });

 //实例2 - 先扩展，再用new来实例化Box
 var mybox2 = Box.extend({
  init: function(opts) {
   this.opts = opts;
   this.element = $(opts.element);
   this.render();
   this.event();
  },
  hide: function() {
   var elEl = this.element;
   elEl.hide();
  },
  event: function() {
   var elEl = this.element;
   var that = this;
   elEl.on('click', function() {
    that.hide();
   })
  }
 });
 new mybox2({
  element: '.mybox2',
  name: '李四',
  age: 55
 });
})

注：关于JavaScript 使用Simple Inheritance创建自己的类示例的内容就先介绍到这里，更多相关文章的可以留意