评论组件开发

业务拆解

即拆分模块(将相似/相同业务分在一起)，根据概要设计文档的模块逻辑图设计主模块，子模块，及与外部模块的数据交互
评论组件子模块 :评论框 评论列表
这么设计在于，评论框作为评论发布的输入框，也可以作为评论列表回复框，而评论列表即最热评论列表，和最新评论列表

排期与工作进度控制

根据拆解的业务模块，把每个模块的功能点详细罗列出来，每天完成哪些功能点做到心中有数/可控，出现问题纠结超过1个小时视情况可以请教前辈
作为开发的准备工作，还可以测试下对外接口,接口数据格式 ,比如登录的回调，登录验证,取用户信息;评论接口返回数据格式,post评论的传递参数

开发前期，可以自行构建dom和css ，毕竟html css js本质上不分家 这样操作dom的时候更熟练
代码开发

---

 遇到业务处理复杂的，不要急于一开始把所有逻辑都能写全,可以先画流程图把逻辑梳理清楚，然后试着写，哪怕写了很多if else,写完后再试着回头来review自己的代码，

将可以重用的抽离出来，或者重新画流程图,重构自己的代码，因为写过一次,这时候对需求更清晰了解的情况下,设计的代码也就会更清晰.
开发过程中遇到的语言细节的问题,自行搜索引擎搜索当然是首选.一开始先学会用，记录下遇到的什么样的问题,完成功能点后再抽时间去研究原理.
一些需要经验的/设计相关的可以请教前辈,这样也不至于跑偏

知识点 （基本是针对jquery API的...）

1.传递参数给on事件的回调函数

给jquery对象绑定事件时,给回调传递参数，查看jqueryAPI可以看出,参数对象会被传递到event.data中

.click( [eventData ], handler )

	* eventData
Type: Anything
	* An object containing data that will be passed to the event handler.


	* handler
Type: Function( Event eventObject )
	* A function to execute each time the event is triggered.

jqnode.on('click', '#node',{'name':'nancy',age:24},handleSignInEvent); function handleSignInEvent(event){ console.log(event.data) //object {'name':'nancy',age:24} }
这是一种方式，还有如果传递参数在另外的对象上面，可以用代理

jquery proxy的api
调用方法有好几种
jQuery.proxy( function, context )
jQuery.proxy( context, name )

用哪种形式，依具体情况而定
比如 stackoverflow上面的一个question

$('#myElement').click(function() {
        // In this function, "this" is our DOM element.
    $(this).addClass('aNewClass');});
But what if we wanted a short delay before adding the class? We might use a setTimeout to accomplish it, but the trouble is that whatever function we give to setTimeout, the value of thisinside that function will be window instead of our element. 

$('#myElement').click(function() {
    setTimeout(function() {
          // Problem! In this function "this" is not our element!
        $(this).addClass('aNewClass');
    }, 1000);});
So what we can do instead, is to call $.proxy(), sending it the function and the value we want to assign to this, and it will return a function that will retain that value.
$('#myElement').click(function() {
   // ------------------v--------give $.proxy our function,
    setTimeout($.proxy(function() {
        $(this).addClass('aNewClass');  // Now "this" is again our element
    }, this), 1000);
   // ---^--------------and tell it that we want our DOM element to be the
   //                      value of "this" in the function});

2.异步编程

此次组件开发中比较明显的是列表模块的开发.初始化异步请求数据后渲染到页面前的逻辑处理,刚好开发完后部门的前辈分享了异步请求的博客,我的问题应该是

客户端缓存,就是success拿到数据后缓存，缓存后的数据逻辑处理应该在一个时序，否则就会拿不到数据.值得一提jquery的ajax源码可以重新研究下.
另，值得一提的是try catch ajax是捕获不到异常的.因为它自身做了处理，即如下

try {
     $.ajax({  /* do sth*/ });
}catch (e) {
     
}

这样捕获不到，其异常处理在

error
Type: Function( jqXHR jqXHR, String textStatus, String errorThrown )