这段代码还有更深一层的优化余地吗?谢谢大佬们

个人很喜欢做代码的优化,但是目前火候欠佳,自己写过的代码都想更好的优化,有没有大佬能给出更好的建议,如果可以,不用写出代码,点一下也行。

如果能从性能方便给小弟点一下就更好了!(可能这里的代码也没有啥大的性能问题)

代码如下:

async submit () {
  try {
    const params = {
      product_name: this.pro_name,
      product_desc: this.editor.txt.html(),
      price: this.pro_price,
      input_time: Date.parse(this.timeVal),
      input_user: this.username,
      submitFlag: this.submitFlag,
      id: this.rowId || undefined
    }
    const { data } = await this.$axios.post('/addProducts', params)
    if (data.status === 200) {
      if (this.submitFlag === 'add') {
        this.$message({
          message: '添加成功!',
          type: 'success'
        })
      } else if (this.submitFlag === 'update') {
        this.$message({
          message: '修改成功!',
          type: 'success'
        })
        // 重置flag,默认为添加商品状态
        this.changeSubmitFlag('add')
      }
      // 清空表单
      this.reset()
      // 重新获取商品列表数据(利用响应式重新渲染视图)
      try {
        const { data } = await this.$axios.post('/getProducts', { currentPage: 1 })
        this.changeTableData(data.result)
      } catch (error) {
        console.log(error)
      }
      // 重置页码
      try {
        const { data } = await this.$axios.post('/getProducts')
        this.changeTotalProducts(data.result[0].result)
      } catch (error) {
        console.log(error)
      }
    } else if (data.status === 400) {
      this.$message.error(data.msg)
    }
  } catch (error) {
    console.log(error)
  }
}
回复
阅读 882
2 个回答
  1. 尽量不要嵌套,能退出就及早退出。
  2. 尤其不要嵌套 try ... catch ...
  3. 只有会出错的步骤需要 try,比如发起请求,声明变量时不需要
  4. 操作失败就要退出,因为后续的操作很难延续

所以优化后的代码大约是:

const params = {};
let data;
try {
  ({data} = await axios.post());
} catch (e) {
  // 处理错误,及早退出
  return;
}
// 第二步操作
try {
  const list = await axios.get();
} catch (e) {
  // 错了提前终止
  return;
}
// 更新页码,我搞不懂为啥刷新列表跟更新页码要分开两步做
// 同上
// 结束
  1. try catch 是否有些过多了? 这样的代码看着很难受,你这 catch 到了也只是做了一个简单的打印,用户仍然是无感知的。
  2. 状态码的解析,最好是写在 axios 拦截器里面,不然你没请求一次都要写,太麻烦了。
  3. 后两个 getProducts 请求可以考虑用 Promise.all,这样可以同时发请求,无需等待上一个回来再去发下一个。
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题
宣传栏