- 方法遵循单一功能原则 ```javascript let a = 1 let b = 2
// bad function func(c) { a = a + b c++ return c }
// good function addFunc() { a = a + b }
function increaseFunc(c) { c++ return c }
2. 不要再赋值参数```javascript// badfunction f1(a) {a = 1;// ...}function f2(a) {if (!a) { a = 1; }// ...}// goodfunction f3(a) {const b = a || 1;// ...}function f4(a = 1) {// ...}
- 具有多行签名或者调用的函数应该像本指南中的其他多行列表一样缩进:在一行上只有一个条目,并且每个条目最后加上逗号
```javascript
// bad
function foo(bar,
// … }baz,quux) {
// good function foo( bar, baz, quux, ) { // … }
// bad console.log(foo, bar, baz);
// good console.log( foo, bar, baz, );
4. 方法的分类及基本命名方法大致可分为初始化方法、渲染方法、逻辑方法、事件方法、请求方法- 初始化方法:当页面初次进入或刷新页面加载必要数据时调用,固定方法名为initPage- 逻辑方法:动态数据获取之后的数据格式处理,方法名统一前缀format- 事件方法:页面上各类元素绑定的增删改查等方法,方法名以功能为前缀加上数据具体类型- 请求方法:动态获取各类数据、不做其他处理,方法名以get、post等为前缀加上数据具体类型```javascript// 初始化方法function initPage() {// 该方法一般用于页面初次进入或刷新页面加载必要数据时}// 渲染方法function initList() {// 该方法仅用于动态渲染各类表单、列表、详情数据,不做其他任何操作}// 逻辑方法function formatList() {// ...}// 事件方法function addList() {// 页面中的各类添加事件}function removeList() {// 页面中的各类移除删除事件}function editList() {// 页面中的各类编辑事件}function previewList() {// 页面中的各类查看预览事件}// 请求方法function getList() {// ...}function getDetail() {// ...}function postData() {// ...}
- 当给事件(无论是 DOM 事件还是更加私有的事件)附加数据时,传入一个对象而不是原始值。 这样可以让后边的贡献者向事件数据添加更多的数据,而不用找出更新事件的每个处理器 ```javascript // bad $(this).trigger(‘listingUpdated’, listing.id);
// …
$(this).on(‘listingUpdated’, (e, listingID) => { // do something with listingID });
// good $(this).trigger(‘listingUpdated’, { listingID: listing.id });
// …
$(this).on(‘listingUpdated’, (e, data) => { // do something with data.listingID }); ```
