论坛首页 Web前端技术论坛

[nicEdit专题]bkClass , bkElement and bkEvent

浏览 3090 次
该帖已经被评为良好帖
作者 正文
   发表时间:2008-05-02  

bkClass :

看名字就知道和类有关,不过javascript中没有Class的概念,一切都是对象。BK要做什么呢?

看看bkClass的代码:

function bkClass() { }
bkClass.prototype.construct = function() {};
bkClass.extend = function(def) {
  var classDef = function() {
      if (arguments[0] !== bkClass) { return this.construct.apply(this, arguments); }
  };
  var proto = new this(bkClass);
  bkExtend(proto,def);
  classDef.prototype = proto;
  classDef.extend = this.extend;      
  return classDef;
};

 好似是对象的Clone,当然了,因为javascript里没有Class,要模拟Class的话当然是Clone了,(注意不是深度Clone,因为bkExtend是引用的扩展)

当然更重要的是在Clone的同时,还进行了扩展,construct,extend,
都是Class所具备的最基础特性。

bkExtend(proto,def);

 bkExtend有返回值的,怎么没有用到?这是javascript本身的特性,当函数的参数是一个非简单对象(string,boolean,Number)时,传递的其实是实参,也就是对象引用了。

也就是bkClass把一个对象扩展的都像bkClass一样,好像是一个简单的Class工厂.

当然你在使用的时候要遵循的一个基本规则就是自己实现对象的

construct

方法,因为javascript并没有 因为名字是 construct 就真的自动去调用他的。调用construct正是

 if (arguments[0] !== bkClass) { return this.construct.apply(this, arguments); }

这一句,

(补充:javascript的构造属性是 constructor ,具体细节请您查查资料)

好了,通过bkClass来定义你的对象,这样你的对象就具备了 Class 中的,construct,和Exend这两大基本特征了。

bkElement :第一个用bkClass构建的对象。

bkElement就像他的名字一样是对DOM中的Element进行的封装,内部实现的都是我们常见的操作内容,包括:

创建Element
添加兄弟Element
添加 子Element
样式Style
样式类名Class
属性Attributes
在页面中的位置Pos
设置内容Content等
还有最重要的事件Event操作,当然后面我们回发现这里的事件不同于一般的事件,是自定义的事件,可以通过代码触发的事件,这就是一个简单的事件模型了.

再看看 bkEvent :

addEvent

看代码的话感觉只是名字叫Event,其实内部就是把传递过来的evFunc存储起来了,对就是这样因为触发靠的是代码方式

fireEvent

就是提供 触发 的接口了。

看上去代码很清晰,结构也很简单呀!

是这样的,BK就是用这些简单的工具来组合出nicEdit的

 

论坛首页 Web前端技术版

跳转论坛:
Global site tag (gtag.js) - Google Analytics