随笔- 31  文章- 0  评论- 376  阅读- 20万 
摘要: 曾几何时,当你码神附体,一路披荆斩棘的完成代码后,带着“一码在手,天下我有”的傲然环顾之时,却发现单元测试、API文档、Demo实例陆续向你砸来,顿时有木有一种冰水挑战后的感觉。而这时你应该:哟哟,快使用SmartDoc; SmartDoc,一个基于NodeJS的自动化文档生成工具,她拥有明眸... 阅读全文
posted @ 2014-10-08 15:37 Roy Zhang 阅读(20435) 评论(18) 推荐(8) 编辑
摘要: 发布了smartjs后,有朋友问:“没看懂究竟是干嘛的”。唉,打击了,每次我都想高唱其实你不懂我的心。今天把相关的东西都整理了一遍,给大家介绍一下。里面绝大多数都已经实现过,有些则是有新的思路重做或者是加强。哈哈,应该也算不上重新造轮子,smartjs产生的背景这几年一直在以前端顾问的身份外包给国内... 阅读全文
posted @ 2014-06-21 16:22 Roy Zhang 阅读(3046) 评论(3) 推荐(1) 编辑
摘要: 隔了好久才终于又发布了一点东西,SmartJS是最近才开始搞的一个开源js库,目的是做一些比较有特点的事情(smartjs暂时也是依赖于jquery)。SmartJS的内容规划比较多,也无法在短时间全部完成,目前就以小版本一个个功能累加。第一期0.1版发布的内容主要是实现前端面向切面编程(AOP)的... 阅读全文
posted @ 2014-06-07 18:17 Roy Zhang 阅读(1552) 评论(1) 推荐(0) 编辑
2015年1月8日

新特性

smartDoc 0.1.1版正式发布,其中加入了更多方便生成文档的功能,主要特性如下:

* 加入@demo配置项,看可以动态抓取html和js的内容作为@example,同时支持扩展@demo读取
* 支持jasmine测试js文件的单元代码抓取为@example
* 实现多个example显示和tab切换
* 加入@show配置项来控制直接显示example效果
* 主题改版
* 去除@attribute属性设置,统一使用@property;

 

docConfig新增配置:

//demo扫描目录
demoDir: "",

 //demo生成器地址
demoBuilder: './demoBuilder.js',

//demo代码生成器地址
codeLoader: './jasmineLoader.js'

 

新版效果片段如图:

详细说明

  example与code分离

    1. 以前的@example都需要写在代码注释当中,很影响代码的可读性;新版中加入@demo配置,通过设置文件路径,可以自动读取html或者js文件生成@example

原来的写法: 现在的写法:
/**
* ................
* @method getTargets3
* @example 
*       var bar;  ....
*/

 

/**
* ................
* @method getTargets3
* @demo inherit/getTargets3.js
*/

 

       inherit/getTargets3.js 会读取定义在docConfig文件demoDir配置下的文件然后生成@example

      

      Jasmine的单元测试代码的读取重用

    支持jasmine测试js文件的单元代码的读取,减少而外开销。不过同时需要注意的事情是尽量编写测试用例的时候,每个单元尽量独立,不要使用全局变量;

    例如:

    

/**
     * Deferred对象
     * @class Deferred
     * @constructor
     * @demo st/deferred.js [resolve]
     */
    function Deferred() {

    }

 

   jasmine测试代码deferred.js:

  

describe('Deferred', function() {
        it("resolve",function(testDone){
            var defer = st.Deferred();

            function test(){
                setTimeout(function(){
                    defer.resolve("test");
                })
                return defer.promise();

            }

            st.when(test()).done(function(result){
                expect(result).toBe('test');
                testDone();
            })
        })
..........

 

   st/deferred.js [resolve] 对应的就是代码中的it("resolve",fn)的内容,文件地址后面的[...]表示jasmine的文件单元测试项,最终效果如下:


    
  

    

 支持@demo解析和读取自定义

      jasmine的是通过内置的jasmineLoader去解析代码的,同时可以自定义代码解析规则 - docConfig的demoBuilder和codeLoader

 

 支持页面直接显示@demo/example;同时也支持tab显示多个;

  例子中配置了多个@demo,同时在@demo中文件路径的配置加入了{...},表示tab的标题,,如果没有设置则取文件名;@show表示直接在页面上显示结果

/**
     * ui测试类; 
     * @class UI
     * @constructor
     * @content {string} type 内容
     * @demo ui.html
     * @demo ui2.html {ui测试2}
     * @show true
     */        
    function UI(content){
        this.init(content);
    }

 

效果如下:

 

 

结尾

smartdoc还在持续建设中,大家使用中有什么问题和建议,可以直接使用 git的issue 反馈给我。

相关链接如下:

SmartDoc地址

doc示例地址

注释编写说明

 

posted @ 2015-01-08 14:13 Roy Zhang 阅读(3704) 评论(10) 推荐(3) 编辑
2014年10月10日
摘要: 上面介绍了JS文档和Demo生成工具SmartDoc,本篇开始介绍一下注释的编写。SmartDoc使用的是YUIDoc的引擎,所以的注释规则都一样,先简单介绍下YUIDoc的注释编写。编写注释是一个很繁重的体力活,很多程序员都嫌麻烦不愿意做此事,但是在编写的过程,会让你注意到很多的细节和考虑一些没有... 阅读全文
posted @ 2014-10-10 09:11 Roy Zhang 阅读(5965) 评论(1) 推荐(1) 编辑
2014年6月23日
摘要: 发一张policy的参数图设置图:场景1 - 数据的懒加载/延迟加载在很多时候,为了提高网页的加载速度,减少不必要的开销,会将页面的数据拆分成几个部分,首先加载呈现可视区域内的数据,然后剩下来的会在需要的时候在进行加载。而这种按需加载的数据又分为两种: 1.按照需要进行加载;可以是由某个动作触发来... 阅读全文
posted @ 2014-06-23 19:48 Roy Zhang 阅读(1580) 评论(0) 推荐(1) 编辑
2014年6月22日
摘要: dataServices数据服务的管理器;首先看下具体的代码//数据服务 dataServices = st.factory({ name: "dataServices", proto: { //通过操作方法;type:操作类型; op:操作参... 阅读全文
posted @ 2014-06-22 15:14 Roy Zhang 阅读(1188) 评论(0) 推荐(1) 编辑
摘要: 在0.3版加入了DataManager,基于策略的数据管理模块;是SmartJS中比较重要的一个系列。整个个DataManager模块包括有:dataManager,dataPolicyManager,dataServices三个管理对象; 1.dataManager(以下简称dm) 数据管理的... 阅读全文
posted @ 2014-06-22 09:41 Roy Zhang 阅读(1179) 评论(0) 推荐(0) 编辑
2014年6月15日
摘要: 本篇介绍OOP的第二个对象factory。在以往项目中其实真正使用klass的地方相当少,而factory则是十分常见的。在smartjs中的factory并不是指的是工厂模式。在factory要求定义一个基础对象,这个对象可以是基类,也可以是模板对象或者是接口。然后factory就已此基础对象为基... 阅读全文
posted @ 2014-06-15 22:21 Roy Zhang 阅读(1026) 评论(0) 推荐(1) 编辑
摘要: SmartJS2.0加入OOP的功能。OOP包括klass与factory两个对象。Klass 类继承与其他的类继承相比,smartjs使用了执行指针的概念(后面例子中会介绍),另外提供base基类和初始化控制的扩展功能。首先来看看接口: var _klass = st.klass(name, p... 阅读全文
posted @ 2014-06-15 11:33 Roy Zhang 阅读(1392) 评论(0) 推荐(0) 编辑
2014年6月14日
摘要: SmartJS2.0发布,更新内容如下:新增oop(klass,factory)模块;promiseEvent加入非阻塞模式noBlock;trigger加入属性监听;smartjs主模块优化,支持requirejs和seajs;单元测试页面优化;先介绍一下针对AOP的优化部分:PromiseEve... 阅读全文
posted @ 2014-06-14 16:52 Roy Zhang 阅读(987) 评论(5) 推荐(0) 编辑
点击右上角即可分享
微信分享提示