代码优化记录

emmm 在这家公司的话,比较好的就是每次写完的代码都有三个人review,对代码优化有一定的提升还有一些小的知识点,就此记录下来,这篇博客会持续更新
2020/07/06

知识点:
1 element ui 的 DatePicker组件,如果后台需要时间戳的话,可以直接用时间value-format设置timestamp来显示, 但是这里的话如果需要写默认值的话,一定也是传入的时间戳的格式才可以
2 将时间戳毫秒转化为秒的时候,应该加上Math.round()这样的话不会有三位小数点 Math.round(new Date(date).getTime() / 1000)
3.在你提交代码前应该去vscode的那个changes看看这一次改了什么,最好就是提交完commit也再看一次
4.接口的返回code的判断一般全局都有,不需要自己的判断
5.顶级菜单的meta里面的code,是子集的合成code,不用单独写
下面是基于egg.js的node开发,用sequelize做与数据库通讯的桥梁
6.如果node不采用读表,直接从后台的接口中转的话,应该进行一个错误的抛出

   if (res.status !== 200 || (res.data.code && res.data.code !== 0)) {
      ctx.throw(res.status, res.data.msg, { ...res.data })
    }

7.使用sequelize进行排序,不是去用sort去排序,这样没法去解决页数的问题,order: [[ 'updated_at', 'DESC' ]],

async versionManage({ limit, offset }) {
    const { rows, count } = await this.ctx.model.HxVersions.findAndCountAll({
      attributes: { exclude: [ 'createdAt', 'updatedAt' ] },
      order: [[ 'updated_at', 'DESC' ]],
      offset,
      limit,
    })
    return { list: rows, total: count }
  }

8 关于map的使用
拒绝:

list.map(item => {
   return xxxx
})

接受

const data = list.map(item => {
   return xxxx
})

map的设计思想，就是保持原数组不变，所以在map里，不建议直接修改源item，而是声明一个新的临时item，处理完后return这个新的item； 2，map处理的结果，建议用一个变量存储起来再使用
如果不需要数据返回直接操作,可以用forEach
9导出的功能是不需要做分页的操作的,是导出全部的数据
10 ctx.curl的使用不需要拼接参数,应该直接用data传过去

ctx.curl('xxx', {
  dataType: 'json',
  data: query,
})

11 有两个表,第一个接口:如果a表是主表,需要连接多个表,其中有个是b表,另一个接口,b表是主表,需要连接多个,其中有个是a表,那么这时候在model里面不需要做2次关联,直接1次关联,然后直接在service里面的include去用这个关联名字就可以了,例如:

this.belongsTo(app.model.HxUser, { foreignKey: 'userId', targetKey: 'userId', as: 'basic' })

this.hasOne(app.model.HxUserBaseInfo, { foreignKey: 'userId', sourceKey: 'userId', as: 'basic' })

只用在这里用basic去关联就好了

async baseInfoById(userId) {
    const { rows } = await this.ctx.model.xxxxxxx.findAndCountAll({
      attributes: { exclude: [ 'createdAt', 'updatedAt' ] },
      where: {
        userId,
      },
      include: [
        {
          model: this.app.model.HxUser,
          as: 'basic',
        },
      ],
    })
    return { list: rows }
  }
}

12 从外部引入的依赖,统一写在模块的顶部,例如:

const Excel = require('exceljs')

代码写法优化:
1.去掉多余的代码,像这里div就可以去掉了

     <template #triggerTime="{ scope }">
        <div>
          {{ parseTime(scope.row.triggerTime) }}
        </div>
      </template>

2.有两处复用到的方法一定要抽到utils里面

  function test() {
      return list.filter((item) => {
        return item.prop !== 'record'  
      }) 
    }

改成

 function test() {
    return list.filter(item => item.prop !== 'record')
 }

箭头函数后面不是块体的话,不用return, 在一个简写体中，只需要一个表达式，并附加一个隐式的返回值。在块体中，必须使用明确的return语句
箭头 后面就是返回值，但是碰到{}就当作函数的代码块执行并需要在函数代码块里面手动返回，其他的表达式全都是直接返回的
3.代码要使用JSDoc 格式注释
4.不建议通过下标获取某个数据,这样如果有加数据的话,以后变数很大
5.如果有几个相同的方法,类似于取消封禁,封禁等等,应该写到一个方法里面
下面是基于egg.js的node开发,用sequelize做与数据库通讯的桥梁
6 更新数据,用一个方法就好,要减少与数据库的交互,她写两份的目的是为了保险,怕id不存在更新不了, 不用考虑这个情况

 async editGameSubmit({ id, body }) {
    const gameModel = await this.ctx.model.HxGameGames.findAll({
      where: {
        id,
      },
    })
    return await gameModel[0].update({ ...body })
  }

改成

async editGameSubmit(id, body) {
  return await this.ctx.model.HxGameGames.update(
    { ...body },
    { where: { id } },
  )
}

7 去掉调试的打印
8.如果有一些数组的处理的时候,如果没有值,可以直接给一个默认值传到组件,
例如:

   const baseExcelInfo = {
      data: list,
      filename: 'userlist',
      header: this.header,
      sheetName: 'sheet1',
      imageKeys: [{
        name: 'userAvator',
        imgWidth: '100',
        imgHeight: '100',
      },
      ],
    }
    await service.common.exportFile.exportExcel(baseExcelInfo)

async exportExcel({
    data = [],
    filename = 'file',
    header,
    sheetName = 'sheet1',
    imageKeys = [],
    creator = 'me',
    lastModifiedBy = 'her',
  }) { 
  // do something
}

imageKeys这里就应该给一个空数组的默认值
9. 上边的const { app } = this，这个变量app，在下边只用了一次，就没必要单独声明了，直接用this.app访问就行了。
如果箭头函数的函数体，只有一个return，就不用写return语句了，直接在箭头后边，跟上要返回的内容，就行了