前端学习笔记（二）

一、前端解耦

前端解耦的一个简单示例：

http://raychase.iteye.com/blog/1512239

HTML\CSS\JS  其实可以通过MVC架构进行解耦。

HTML:MODEL 层

CSS:VIEW 层

JS: CONTROLLER层

我们使用class 解放了css

我们使用选择器获取dom元素，为之定义function的方法来解放js。

以上的方式也解决了一下问题：
（1）js压缩后可能产生的window下的方法名发生变化，造成的问题。

（2）原有的方法域都在window下，很容易造成方法覆盖。

二、DOM树的生成

不同浏览器引擎，DOM树的生成方式不同。

$("YYYY") 多次使用会导致多次遍历。因此通过使用变量

var yy = $("YYYY") ；的方式来代替多次使用$("YYYY") 。可以减少遍历次数。

在 $("YYYY") 中存储的是指向DOM结构的指针，因此在修改dom结构后，不会影响到指针，指针可以一直使用。

如果在 $("YYYY") 所指向的dom被删除后，再次调用事件（如click），则不会报错，因为，jquery如果未找到dom那么就会返回[]，而不是一个null；

一段时间后，垃圾回收机制会回收指针。

为了加快垃圾回收，我们可以将需要回收的置空  =null；

三、模块化

（eg:Node.js  ）

使用方式类似于java的import,

当前封装框架：seajs和requirejs。使用的原理，都是通过在文件中使用YOI.loader来管理文件加载。

此方法在客户端使用时，可以通过监听模式来等待所需的js加载后通过回调函数进行执行。

在服务器端使用时，由于读取速度很快，因此不再需要进行监听。

示例：http://www.cnblogs.com/snandy/archive/2012/03/08/2378441.html         

a require a1

b require b1

c require a1\b1

a1  和 b1 可以是同一个js，但是由于别名不同 所以可以区别调用的方法。从而解决命名冲突问题（相当于，加了一个域）。