代码审查、编写、源码阅读，AI编辑器Cursor助你一臂之力！

Cursor是一款专为编程而设计的带有人工智能功能的编辑器,Cursor能够处理自然语言进行代码自动生成，帮助程序员更快的编写代码，错误检测，并且能够创建更清晰和易于维护的代码等。

官网的介绍：

接下来以日常开发中常见的应用场景与实例来看看的Cursor的强大功能吧！

一、应用场景与实例

只有两个快捷键：Ctrl+K是生成，Ctrl+L是chat

1、生成vue代码

描述：用vue3和Element-plus生成登陆组件

生成过程如下：

结果如下：

<template>
  <el-form>
    <el-form-item label="用户名">
      <el-input v-model="username"></el-input>
    </el-form-item>
    <el-form-item label="密码">
      <el-input v-model="password" type="password"></el-input>
    </el-form-item>
    <el-form-item>
      <el-button type="primary" @click="login">登录</el-button>
    </el-form-item>
  </el-form>
</template>

<script>
import { ref } from 'vue';
import { ElForm, ElFormItem, ElInput, ElButton } from 'element-plus';

export default {
  components: {
    ElForm,
    ElFormItem,
    ElInput,
    ElButton,
  },
  setup() {
    const username = ref('');
    const password = ref('');

    const login = () => {
      // 登录逻辑
    };

    return {
      username,
      password,
      login,
    };
  },
};
<script>

2、分析代码

可以帮助我们分析别人写的代码和框架源码，实例如下：

3、代码优化

可以帮助我们优化代码，给出更优建议，也可以作为代码审查的辅助工具。

Cursor给的优化建议如下： 为了优化以上代码，我们可以使用 async/await 语法来替代 Promise 的 then/catch 语法，使代码更加简洁易读。同时，我们可以使用解构赋值来简化代码。以下是优化后的代码：

async updPwd(data) {
  const regEmail =
    /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/
  const indentifyWay = regEmail.test(data.username) ? 'EMAIL' : 'PHONE'
  const { newpassword, newpassword2, username } = data
  const encryptPassword = await this.JSEncrypt(newpassword)
  const encryptConfirmPassword = await this.JSEncrypt(newpassword2)
  const params = {
    token: this.resetPwdToken,
    password: encryptPassword,
    confirmPassword: encryptConfirmPassword,
    indentifyWay,
    indentifyChannel: username
  }
  try {
    const { data } = await initPwd(params)
    this.state = 'setPwdSuc'
    this.$router.push('/login')
  } catch (error) {
    this.state = 'setPwdFail'
  } finally {
    this.$refs.llsLogin.loading = false
  }
}

优化解释：以上代码使用了 async/await 语法来替代 Promise 的 then/catch 语法，同时使用解构赋值来简化代码。在 try 块中，我们使用解构赋值来获取 initPwd 函数返回的 data 属性，如果返回的 code 不是 '200'，则设置状态为 'setPwdFail'，否则设置状态为 'setPwdSuc'，并跳转到登录页面。在 catch 块中，我们设置状态为 'setPwdFail'。在 finally 块中，我们关闭 loading 状态。

4、编辑代码

描述：接口返回结果转成字符串并打印

二、总结

Cursor功能已经很强大，可以帮助我们写简单重复的代码、偏逻辑的代码（比如正则表达式等）、优化代码、代码审查、代码提示.....

还有更多的使用场景等着我们去挖掘，毫无疑问AI已经成为我们开发人员的好助手，随着AI训练它们将会给我们开发和日常生活带来更多便利和惊喜，让我们张开怀抱开始拥抱AI吧！