制造自己的榫卯

简介:

一、榫卯

榫卯(sǔn mǎo),是古代中国建筑、家具及其它器械的主要结构方式,是在两个构件上采用凹凸部位相结合的一种连接方式。

若榫卯使用得当,两块木结构之间就能严密扣合,达到“天衣无缝”的程度,并且不用钉子。

下面这张图来自于山西悬空寺,屋檐下面的那些都是用榫卯做成的,没有用一颗钉子。

 

二、JavaScript与榫卯

在开发页面的时候,或多或少的要写JavaScript,除了些业务逻辑的代码外。

还有DOM操作,AJAX处理,事件绑定,实用功能,Promises/A+规范实现,样式、集合、数组、函数、对象、时间、URL、动画、模版、cookie等各种操作。

现在网上相关的开源库很多,例如封装DOM操作的,有ZeptoSizzle引擎等,实用库UnderscoreSugar等。

  

这些封装好的库使用起来方便兼容性好,但是有些时候我仅仅是需要使用里面的个别方法,例如做活动页面。

就为了这几个个别方法而把整个库都引进来,有种杀鸡用牛刀的感觉。

当看到下面那位非洲朋友用圣剑来切牛排,囧,瞬间就能体会那种感觉。

而如果想把里面的个别方法抽出来,又不能直接用,因为这些方法可能引用了库中的私有方法属性等,就好像建筑里的钉子,需要钉子来衔接。

所以这个时候就需要使用自己封装的函数,就好比榫卯,拿来即可用,而不需要特定的钉子。

 

三、构建榫卯结构

要想构建,最方便的还是要参考下现有的库是如何做的,这样能少走些弯路。

在Github上面看到了两个页面,专门记录了各种类库《Front-End-Develop-Guide》与《Awesome JavaScript

有些时候也不用一定要自己写,有相关的类库就直接收录进来,要用的时候就不用再到网上去各种搜索啦!

1)DOM选择器

这是在平时开发页面必用的,ES5规范出来后,定义了很多实用的方法,可以不再像以前那样编写大量的兼容代码。

原生的“querySelectorAll”和“querySelector”非常强大,语法和JQuery中的选择器大致一样。

Sizzle也就是是jQuery的选择器引擎,将近2000行的代码,不过很多代码是在兼容IE6、IE7等古老的PC浏览器,关于这个引擎可以参考《jQuery中的Sizzle引擎分析

我现在都是在移动端开发,移动端的浏览器都要高级些,所以我打算参考Zepto来封装。

这个是针对移动端浏览器,并且是模块化的,想参考里面的3个模块,event是事件模块。

还看到两个更小的库,HTML140 medley

 

2)实用库

实用库我打算参考UnderscoreSugar,这两个库都有各自的主页,分类也很清晰。

Underscore还有个带注释的源代码页面

Underscore分为Collection、Array、Function、Object、Utility几大部分。

Sugar分为Array、String、Number、Date、Object、Function、RegExp、Range几大部分。

根据他们的分类,两个库之间有些地方应该还能互补一下。

 

3)其他相关的库

1. 对时间的各种操作,有两个库用的人蛮多,Datejsmoment。我是比较前者,代码比较少,比较容易看源码。

2. Promises/A+规范的实现,相关库比较多,when.jsZepto中的deferred.js还有promise-polyfill。如果对这个规范概念不是很清楚,可以参考《Promises/A+规范的实现

3. 模板喜欢用mustache,代码简洁,但功能不简洁,用了以后就会知道很方便。

4. 本地存储的封装,可以借鉴或直接引用store.js,代码就100多行,完全能看懂。

5. cookie的各种操作,可以借鉴或直接引用js-cookie,源码也是我喜欢的100多行。

6. 对URL的基本操作,可以借鉴或直接引用domurl

 

我选择库都会选择小巧、功能比较单一、而且不依赖第三方库。

源码看起来也能方便点,抽出代码的时候也能少费点时间。

这里只是做个抛砖引玉,具体怎么构建可以根据实际情况来操作。

 

参考资料:

Zepto源码分析

前端开发指南

Awesome JavaScript

 





    本文转自 咖啡机(K.F.J)   博客园博客,原文链接:http://www.cnblogs.com/strick/p/5347551.html,如需转载请自行联系原作者

相关文章
|
存储 JavaScript 前端开发
制造自己的榫卯
榫卯(sǔn mǎo),是古代中国建筑、家具及其它器械的主要结构方式,是在两个构件上采用凹凸部位相结合的一种连接方式。
制造自己的榫卯
|
机器学习/深度学习 人工智能 弹性计算
如何才能以更低投入帮助工业企业建立一座柔性制造智能工厂?
过去,很多制造业企业都觉得生产线的“柔性”只是一个可选项,就算一条产线只能生产一种产品,只要产品卖的好,就不用过多担心。但疫情却为企业管理者敲响了警钟,未来确实存在像疫情黑天鹅这样的极端情形,如果产线没有足够的柔性去应对,就只能坐以待毙。
|
数据采集 传感器 大数据
|
大数据 新制造
《机械制造业智能工厂规划设计》——导读
信息技术,特别是信息通信技术,催生了新一轮科技革命和产业变革,掀起了新一轮工业革命。这场革命对于制造业来讲就是要实现数字化、网络化和智能化。
1424 0
《机械制造业智能工厂规划设计》——第2章 2.0智能工厂设计通则
本节书摘来自华章计算机《机械制造业智能工厂规划设计》一书中的第2章,第2.0节,作者:蒋明炜著, 更多章节内容可以访问云栖社区“华章计算机”公众号查看。
1251 0