【青训营】- 如何写好JS

简介: 【青训营】- 如何写好JS

这是我参与8月更文挑战的第18天,活动详情查看:8月更文挑战

写好JS的一些原则

各司其责

  • JavaScript:负责行为表现
  • CSS: 负责样式
  • HTML:负责结构

组件封装

组件是值web页面上抽离出来的一个个包含模板、功能和样式的单元,好的组件具备封装性

、正确性、拓展性、复用性。组件设计的原则:封装性、正确性、拓展性、复用性。

实现组件的步骤:

  • 结构设计
  • 展现效果
  • 行为设计

三次重构

  • 插件化
  • 模板化
  • 抽象化

过程抽象

  • 用来处理局部细节控制的一些方法。
  • 函数式编程思想的基础应用。

高阶函数

  • 以函数作为参数
  • 以函数作为返回值
  • 常用于作为函数装饰器

下面介绍一些常用的高阶函数

  • Once
  • Throttle
  • Debounce
  • Consumer
  • Iterative

写代码最应当关注的是什么?

  • 风格
  • 效率
  • 约定
  • 使用场景
  • 设计

下面介绍下我个人的心得体会,关于如何写好JS

1. 代码应该有清晰的结构

有了清晰的结构,方便我们后续的阅读和维护,假以时日再次阅读该代码也可以快速上手,如果没有清晰的结构,一旦代码量增大,则可能导致难以排查错误的情况。

2. 指定良好的编码规范

一个良好的代码不应该有下面的问题:

  • 重复代码
  • 命名不规范
  • 函数过长

3. 避免使用JS内置不合理语法

JS这门语言由于历史原因,存在一些不合理的语法(可能会造成预料之外的bug),例如全局变量、等于判断、eval的使用等。

4. 尽量简洁的JS代码

在实现一个功能的时候,写法往往有很多种,一万个人就有一万个哈姆雷特,但是越简洁的语法,越能激起人们阅读的兴趣,同时能够提高可读性。

相关文章
|
7月前
|
存储 JavaScript 前端开发
js学习知识点总结
js学习知识点总结
|
10月前
|
JavaScript
JS(Dom操作)第十八课
JS(Dom操作)第十八课
42 0
|
11月前
|
JavaScript
学习JS第五天
学习JS第五天
40 0
|
11月前
|
JavaScript 数据安全/隐私保护
学习JS第四天
学习JS第四天
58 0
|
11月前
|
JavaScript
学习JS第八天
学习JS第八天
41 0
|
11月前
|
JavaScript
学习JS第六天
学习JS第六天
50 0
|
JavaScript 前端开发 算法
js基础,我来帮你
js基础,我来帮你
65 0
js基础,我来帮你
|
存储 Web App开发 SQL
我明白了,玩转前端面试JS篇
前端面试 无非就是 CSS + JS + 框架 + 工具 + 源码 + 算法 + 职业规划 + 实战,这篇文章以及接下来的文章也是围绕这些内容依次展开。 说到JS,它非常的强大,除了在页面中运行js,还有在服务器中运行的node.js,以js的构建工具等等,但是我在这篇文章中并不会去说那些js的扩展,比如多端应用、服务器端框架部分、小程序等等东西,还是说说通用的以及基础的部分吧。 首当其冲的是 作用域、闭包、面向对象的this指向以及多种创建方式呀继承方式呀、ES6的语法以及promise和async呀await呀,还有与HTML有关的JS DOM呀,和网络有关的 HTTP、NodeJS呀
133 0
我明白了,玩转前端面试JS篇
|
JavaScript
JS查漏补缺——神奇的this
JS查漏补缺系列是我在学习JS高级语法时做的笔记,通过实践费曼学习法进一步加深自己对其的理解,也希望别人能通过我的笔记能学习到相关的知识点。这一次我们来理解一下面试题常考的this的指向
101 0
|
JavaScript
【青训营】写好JS——写代码最应该关注什么?
【青训营】写好JS——写代码最应该关注什么?
90 0
【青训营】写好JS——写代码最应该关注什么?