通义灵码助力JavaScript开发:快速获取API与智能编码技巧

2025-04-02 10:51 更新

一、引言

JavaScript 拥有丰富的 API 生态,从浏览器的 Web API 到 Node.js 的环境生态,为开发者提供了强大的工具和库。然而,面对如此庞大的生态系统,开发者常常需要花费大量时间翻阅文档来查找和学习如何使用这些 API。通义灵码的出现改变了这一现状,通过其智能问答和代码生成功能,开发者可以快速获取所需的 API 信息和使用示例,大幅提高开发效率。

本文以通义灵码提供的通义千问大模型进行介绍!


二、通义灵码简介

通义灵码是由阿里云技术团队开发的智能编码助手,基于先进的通义大模型,为开发者提供以下功能:

  • 代码续写和优化:根据现有代码上下文,智能生成行级或函数级的代码建议,帮助开发者快速完成代码编写,并对代码进行优化,提高代码质量和执行效率。
  • 自然语言描述生成代码:开发者可以通过自然语言描述需求,通义灵码能够将其转化为相应的代码,大大简化了代码编写过程,尤其适用于复杂功能的实现。
  • 注释生成和代码解释:自动为代码添加详细注释,方便开发者及团队成员更好地理解代码逻辑和功能;同时,能够对代码进行详细解释,帮助学习者深入理解代码原理。
  • 单元测试生成:根据代码自动生成单元测试用例,确保代码的可靠性和稳定性,提高测试效率。
  • 研发智能问答:作为基础和核心功能,开发者可以通过与通义灵码的问答对话,获取所需的技术支持和解决方案,就像拥有一位智能的编程助手。
  • 代码问题修复:能够识别代码中的潜在问题,并提供修复建议,帮助开发者及时解决代码错误和漏洞。


通义灵码官网https://tongyi.aliyun.com/lingma/

通义灵码支持:JetBrains IDEs、Visual Studio Code、Visual Studio,及远程开发场景(Remote SSH、Docker、WSL、Web IDE),安装后登录账号即可开始使用。

JavaScript开发通常采用VSCode进行,它也是前端开发中最常使用的代码编辑器。通义灵码提供了VSCode的插件,我们可以直接在插件市场下载安装!


三、环境配置

(一)选择合适的开发环境

JavaScript 开发通常采用 Visual Studio Code(简称 VSCode),安装过程详见:安装过程(详见:VSCode 入门它是一款轻量级且功能强大的代码编辑器,特别适合前端开发。VSCode 拥有丰富的插件生态系统,能够为开发者提供良好的支持。

(二)安装 VSCode

请确保你已经安装了 VSCode,本文不再赘述安装过程。若未安装,可前往 VSCode 官方网站下载安装。

(三)安装通义灵码插件

  1. 打开 VSCode,点击左侧活动栏中的“扩展”图标,进入扩展市场。
  2. 在搜索框中输入“TONGYI Lingma”,找到通义灵码插件。
  3. 点击“安装”按钮,等待插件下载并安装完成。
  4. 安装完成后,VSCode 左侧会新增一个通义灵码的图标,点击即可进入插件界面。

(四)登录通义灵码

  1. 点击左侧活动栏中的通义灵码图标,进入插件界面。
  2. 首次使用时,点击“立即登录”,同意用户协议,会跳转到登录页面。
  3. 通义灵码支持多种登录方式,包括账号密码登录、手机号登录、支付宝、阿里云、淘宝、钉钉登录。选择一种登录方式完成登录。

登录后即可使用通义灵码的各项功能。


四、功能演示

(一)使用智能问答功能快速获取 API

通义灵码的智能问答功能是获取 JavaScript API 信息的最快捷方式。

你可以通过直接提问 API 的具体名称来获取该 API 的详细信息和使用示例。

例如,你可以问:“如何使用 fetch API 发起 HTTP 请求?” 通义灵码会提供详细的解答,并生成相应的代码示例。

你还可以根据功能描述让 AI 帮你找到能实现该功能的 API。

例如,你可以问:“如何在 JavaScript 中实现定时器功能?” AI 会推荐 setInterval 和 clearInterval 等相关 API,并提供使用示例。


(二)会话创建和清理

智能问答是一个持续对话的过程,为了提高 AI 生成答案的质量,应该适时清理会话。

你可以通过以下两种方式清理会话:

  • 清理会话:在对话框中输入​/clearContext​,然后点击确定即可。

  • 创建新会话:在智能问答的右上角有一个圆形 ​​+​​ 号按钮,点击即可创建新对话。

代码小技巧

通义灵码生成的代码一般都会在右上角有这四个小按钮,分别对应着插入、复制、新建和合并的功能,后续的功能会用到这些小技巧。

  • 插入 :会把 AI 生成的代码替换到我们选中的代码位置,一般在代码注释和代码优化中应用。

  • 复制 :则是复制 AI 生成的代码,我们可以自己选择插入的位置。

  • 新建 :则是新建一个文件,把 AI 生成的代码放进去,一般而言生成测试代码会选择新建一个文件夹存放。

  • 合并 :则是把代码黏贴到文件中,比如黏贴到选中的代码后,一般我们在智能问答中得到我们需要的代码可以用合并。

(三)代码续写

通义灵码提供了强大的代码续写功能,能够根据现有的代码内容猜测后续你想要输入的代码,从而提高代码开发的效率。

在编写 JavaScript 代码时,这一功能可以帮助你快速熟悉语法结构和编程模式。

如果 AI 不能及时猜测到你需要的代码续写支持,你可以通过快捷键 Alt+P 手动触发生成代码建议。

为了提高代码补全的准确性,建议在编写代码前先写代码注释描述其功能。

开发小提示:为了让代码补全功能更贴近我们想要的结果,我们可以先写代码注释描述其功能。例如上图所示

通义灵码提供了一组快捷键使用方式,可以更好的进行代码续写的控制:

操作 macOS Windows
接受行间代码建议 Tab Tab
废弃行间代码建议 esc esc
查看上一个行间推荐结果 ⌥(option) + [ Alt+[
查看下一个行间推荐结果 ⌥(option)+] Alt+]
手动触发行间代码建议 ⌥(option)+P Alt+P


(四)代码注释和解释

通义灵码能够为代码生成详细的注释,帮助你和团队成员更好地理解代码逻辑。

你可以使用快捷键 Shift+Alt+V,或者在右键菜单中选择通义灵码的代码注释功能,来为选中的代码生成注释。

代码解释功能则会告诉你代码为什么这么写。

选中代码后,点击通义灵码的代码解释按钮,它会根据你的代码生成对应的解释,帮助你深入理解代码的逻辑和实现原理。

使用代码解释辅助理解代码

代码解释与代码注释不同,注释是为了让代码更易读,而代码解释是告诉你代码为什么这么写。 与代码注释相同,选中代码后,点击通义灵码的代码解释按钮,通义灵码会根据你的代码生成对应的解释。 

(五)单元测试生成

单元测试是确保代码质量和稳定性的重要环节。通义灵码可以根据你的代码自动生成单元测试用例和测试代码,帮助你更好地掌握单元测试的方法和技巧。

生成的测试用例代码一般需要复制到专门的测试用例文件中,方便后续测试。

你也可以使用通义灵码的新建文件功能,快速创建测试用例文件。

(六)代码优化

通义灵码能够对你的代码进行审查和优化,找出潜在的问题,并提供优化建议。

AI 不仅会指出问题所在,还会给出具体的优化思路,甚至直接生成优化后的代码。

你可以使用合并(diff)操作,将原代码替换为优化后的代码,从而提高代码的执行效率和质量。

(七)AI 程序员

通义灵码的 AI 程序员功能使 AI 能够像专业程序员一样协助进行代码的修改。

在项目开发中,若需修改多个代码文件,AI 程序员能轻松胜任,帮助进行代码检查、优化和修改。

虽然 AI 可以生成代码,但最终决定权仍然在你手中。

你可以根据自己的需求和判断,选择是否接受 AI 生成的代码。


五、总结与展望

通义灵码作为一款智能编码助手,为 JavaScript 开发者提供了全方位的支持。

从智能问答到代码续写,从注释生成到单元测试,再到代码优化和 AI 程序员功能,它几乎涵盖了开发过程中的各个方面。

通过本文的介绍,希望你能更好地理解和使用通义灵码,提升开发效率和代码质量。

随着 AI 技术的不断发展,通义灵码将在未来的 JavaScript 开发中发挥更加重要的作用,成为你不可或缺的编程伙伴。


以上内容是否对您有帮助:
在线笔记
App下载
App下载

扫描二维码

下载编程狮App

公众号
微信公众号

编程狮公众号