在BaseComponent.js中继承optionable.js中的类,然后在BaseComponent.js使用extend()函数对Optionable进行扩展,为什么我这么写运行不了,请问怎么改?
BaseComponent.js
import Optionable from './optionable'
function cloneObj(oldObj) { //复制对象方法
if (typeof(oldObj) != 'object') return oldObj;
if (oldObj == null) return oldObj;
var newObj = Object();
for (var i in oldObj)
newObj[i] = cloneObj(oldObj[i]);
return newObj;
}
function extend() { //扩展对象
var args = arguments;//将传递过来的参数数组赋值给args变量
//调用复制对象方法
var temp = cloneObj(args[0]);
for (var n = 1; n < args.length; n++) {
for (var i in args[n]) {
temp[i] = args[n][i];
}
}
return temp;
}
const BaseComponent = Optionable.extend({
getSupportEvents: function () {
return ['render', 'click', 'mouseup', 'mousedown', 'mousemove', 'mouseover', 'mouseout', 'optionChange'].concat(this._getSupportEvents());
},
_getSupportEvents: function () {
return [];
},
/**
* 最小高度
* @type {number}
*/
minHeight: 10,
/**
* 最小宽度
* @type {number}
*/
minWidth: 10,
/**
* 初始化
* @param {string=} id
* @param {Object} serialize
* @returns {exports}
* @private
*/
_init: function (id, serialize) {
var self = this;
serialize = self.originSerialize = serialize || {};
self.rendered = false;
return self;
}
});
optionable.js
const Optionable = {
_init: function () {
var self = this;
self.options = {};
self.optionNames = [];
self._super();
// 监听属性变化的事件列表
self._watchOptionEvents = {};
// 监听属性变化
self.bind('optionChange', function (value, name) {
_.each(self._watchOptionEvents[name], function (event, index) {
if (event && _.isFunction(event.callback)) {
_.caller(event.callback, value, name, self);
if (event.once == true) {
delete self._watchOptionEvents[name][index];
}
}
});
});
self._defineOptions = self.getDefineOptions();
return self;
},
getDefineOptions: function () {
return {};
}
}
export default Optionable
我改了一下原来的函数
class.js
/**
* @class
* @constructor
*/
function Class() {
}
/**
* 销毁
*/
Class.prototype.destroy = function () {
var self = this;
// 自动销毁全部
_.each(self, function (v, k) {
// 如果也是一个Class,同样调用destroy方法销毁
if (v instanceof Class && !v.deleted) {
self[k].destroy();
} else {
// 否则直接设置为 null
self[k] = null;
}
});
// 标记已销毁
self.deleted = true;
};
/**
* 类继承
* @returns {Class}
*/
Class.extend = function extend() {
var prototype = new this();
var _super = this.prototype;
// 可以一次传入多个props,越往后优先级越高
var args = [].slice.call(arguments, 0);
var props = {};
args.unshift(props);
args.unshift(true);
// 合并所有的props
_.extend.apply(null, args);
for (var name in props) {
if (props.hasOwnProperty(name)) {
// 如果属性是一个方法,并且是继承父级的方法
if (_.isFunction(props[name]) && _.isFunction(_super[name])) {
// 改写原方法
prototype[name] = (function (super_fn, fn) {
return function () {
var tmp = this._super;
// 使方法内部可以通过_super调用到父级方法
this._super = super_fn;
var ret = fn.apply(this, arguments);
this._super = tmp;
if (!this._super) {
delete this._super;
}
return ret;
}
})(_super[name], props[name]);
// 如果是一个对象,则与父级合并
}
/*
else if (_.isObject(props[name])) {
prototype[name] = _.extend(true, {}, _super[name], props[name]);
}
*/
else {
prototype[name] = props[name];
}
}
}
function Constructor() {
}
Constructor.prototype = prototype;
Constructor.prototype.constructor = Constructor;
Constructor.extend = extend;
/**
* 通过create来获取实例化对象
* @returns {Constructor}
*/
Constructor.create = function () {
// 实例化类
var instance = new this();
// 调用_init方法
if (_.isFunction(instance._init)) {
instance._init.apply(instance, arguments);
}
// 返回实例
return instance;
};
return Constructor;
};
export default Class
eventful.js
import Class from './class';
const Eventful = Class.extend({
_init: function () {
console.log('Eventful')
return this;
}
})
export default Eventful