开发者社区 问答 正文

大家是怎样管理JS的?

一个页面里

$("").on("click", function(){
一堆代码
})

一堆这种东西,写完了自己都不想再看。
快吐了

展开
收起
杨冬芳 2016-06-20 14:07:21 1547 分享 版权
1 条回答
写回答
取消 提交回答
  • IT从业

    我在大概一年前也有同样的困扰,你可以看到,大家的回复都很重肯,很多老司机。
    其中这个回答非常棒,体现了很清晰的良好的设计思想,可以说一下点醒了我:

    如何在绑定事件的时候,不用关心具体绑定给谁?

    事实上,当你开始思考这个问题的时候,说明你开始走起了前端之路。

    从jQuery解脱

    你需要改变现有类似$('.class1')这种方式,有计划的用事件委派来绑定,这样你的问题解决了,也是第一步迈出了。想想看为什么你看到的牛逼的代码感觉很牛逼?
    你需要抽离jQuery的部分和真正逻辑部分,相信我,我理解DOM操作复杂度,我也理解业务复杂度,所以你才需要拆分,不要再看到$('.class').parent().next().next()这种的。

    面向对象

    记得大学的课程吗,之所以叫面向对象思想,因为这是一种思考方式。你需要将代码颗粒、分散成小而美满足面向对象思想的结构,比如可复用性、适度的封装、善用继承等。
    接下来对项目目录和文件结构,甚至命名有要求。简单说不再是一个页面一个js或者一个功能一个js,而是一个对象一个js。

    沉淀代码

    开始尝试比如React,AngularJS等,看看为什么这些框架写出来的和你现在业务代码不一样。推荐React。
    这时候在回来思考你的代码,封装自己的DOM操作方式,形成自己的框架,和完整的前端工程体系。

    最后

    我总结了下这个路程:

    1.开始有计划的用事件委派来绑定

    2.开始抽离jQuery的部分和真正逻辑部分

    3.开始将代码颗粒、分散成小而美满足面向对象思想的(比如可复用性、适度的封装、善用继承等)结构

    4.开始对项目目录和文件结构,甚至命名有要求

    5.善用技巧,摆脱类似$('.class1')这种方式

    6.开始尝试比如React,AngularJS等。

    7.封装自己的DOM操作方式

    8.形成自己的框架

    9.形成完整的前端工程体系

    2019-07-17 19:44:05
    赞同 展开评论
问答分类:
问答标签:
问答地址: