vscode： 4 篇

2025年2月

使用AI自动写代码，DeepSeek+CLine+VSCode实战教程

0 前言#

最近 DeepSeek 火了起来，各个媒体都在宣传，那 DeekSeek 到底是个啥？从程序员角度来看：DeepSeek 一个人工智能助手，可以帮助我们解决代码知识点疑问，以及某个晦涩难懂的知识点问题，处理生活中的一些文本信息问题等。

其实这些能力早在数年前 ChatGPT 也已经具备了，那么为什么最近 DeepSeek 这么火呢？一个原因就是因为它是国产的，那必须得支持。还有一个原因就是它实惠呀，便宜！目测目前比 ChatGPT 要便宜了近 10 倍不止吧~ 咱能用得起了…… 在价格下降的同时，表现的能力也是越来越聪明。

下面主要是介绍 DeepSeek+CLine+VSCode 的实战教程，所表现出了的能力也是相当出色的，可以直接操控我们的编译器来写代码，自动写代码！也就是说它除了回答我们一些专业问题之外，还可以直接对我们的文件目录及文件内容进行增删改查！

1 先上结果#

](https://imgse.com/i/pEnSBqJ)

2 注册使用 deepseek 模型的账号#

这里注册 deepseek 账号我们可以选择在其官网上注册使用，也可以选择在其他平台上注册使用。但是现在 deepseek 官网因为频繁受到某国不知名网络的攻击已经关闭了新的注册入口。

现在主要是来介绍在华为云上面的注册方法，使用的效果也是相当可以的，华为云也是相对稳定一些。

首先点击下面的链接可以注册个账号，现在注册可以免费获得 14 块钱的使用额度：

https://cloud.siliconflow.cn/i/10XZLZAC

3 创建秘钥#

我们注册好账号后，再来创建一个 API 秘钥，后面要用到

](https://imgse.com/i/pEnStP0)

4 vscode 安装 cline 及配置 deepseek 模型#

刚刚的账号及 API 秘钥弄好以后，我们来到 vscode

4.1 在 vscode 中安装 cline 插件#

安装一个 cline 插件，这个插件可以自动操作我们的 vscode 终端，配合 deepseek、chatgpt 这个 AI 助手来使用效果相当强劲

4.2 配置 deepseek 模型#

下载好 cline 插件后，我们点击 vscode 侧边栏的 cline 的界面，在里面配置 deepseek 模型，见图 4-2-1

（图 4-2-1）

图 4-2-1 里面 2.2 文字内容：

https://api.siliconflow.cn/v1

图 4-2-1 里面的 2.3 秘钥就是之前我们创建的那个秘钥

图 4-2-1 里面的 2.4 内容，我选的是 deepseek 最聪明的（最贵的）那个模型：

deepseek-ai/DeepSeek-R1

配置完以后我们带点击一下那个“Done”按钮，就会保存我们的配置。

5 开始使用 vscode+cline+deepseek 写代码#

刚刚我们都已经配置好了，现在开始使用

ok，到这里已经配置完成啦~ 可以体验 AI 写代码的魅力了~

2024年4月

async、await的这个小细节你知道？async、await多次实践使用后的一点小结（async返回异步问题）

前端 vscode ES6 javascript

前言#

我们都知道async、await 是用来将“同步函数变成异步函数，可以同步获取到里面异步函数的返回值”的，比如我们在请求一个接口的时候，这个接口的返回值是一个异步的，那我们就可以用 await 将这个异步接口返回变成同步，使我们可以同步的获取到接口的返回值，然后在紧接着的下文中就可以直接用这个接口的返回值。

一实例 1#

循序渐进，先上一个简单的代码

const asyncFun = (value: number) => {
  return new Promise((resolve, reject) => {
    // 模拟一个异步请求
    setTimeout(() => {
      resolve(value + 1)
    }, 2000)
  })
}

const getValue = async () => {
  let result = await asyncFun(1)
  console.log('result:', result)
}

getValue() // result:2

如上图代码，输出的结果是

result: 2

我们来浅分析一下这段代码，这段代码其实我们是模拟了一个接口请求的操作，asyncFun(value: number)返回一个 Promise，Promise 就代表这个结果是一个异步的，当我们调用这个函数时得到的结果就会等所有同步代码执行完以后才会得到这个 Promise 的结果。

如果我们调用asyncFun(value: number)这个函数想要同步获取到里面的结果，获取完这个结果后，紧接着同步执行下面的代码，那我们就要使用async、await 来解决，这是ES6 推出的新语法，好用的很啊，但是也有一些细节需要注意（下文会提到）。

所以我们在使用getValue() 这个函数调用asyncFun(value: number)时，首先在getValue()函数头部加了 async，声明咱这个函数是一个异步函数，这样在这个函数里面我们就可以用await将异步的返回值转为同步获取到了，所以await asyncFun(1); 的意思是等这里完全执行完（2 秒之后），获取到value+1这个具体数值，然后才会执行console.log('result:', result); 这句话。

所以上面这段代码最后输出的就是

result: 2

二实例 2（踩坑记录）#

同样的，咱们也是直接上代码块，大家看一下这段代码输出的是个啥：

const asyncFun = (value: number) => {
  return new Promise((resolve, reject) => {
    // 模拟一个异步请求
    setTimeout(() => {
      resolve(value + 1)
    }, 2000)
  })
}

const getValue = async () => {
  let result = await asyncFun(1)
  return result
}

const add666Value = () => {
  let result: any = getValue()
  result = result + '666'
  console.log('result:', result)
}

add666Value()

上面这段代码就是将getValue()方法又封装了一遍，得到这个结果，然后再去输出这个结果，那么大家觉得这个是个啥值呢？可能有的人会认为输出的是result: 2666，其实不然，真正输出的结果是：

result: [object Promise]666

嘿嘿，这是为啥呢？这就是前面说的那个小细节了，使用 async 声明的函数其返回值是一个 Promise。通常我们写一个普通函数，想 return 啥它就能直接 return 啥，但是只要在这个函数头上加了 async ，那它就会返回 Promise 类型，这个函数的返回值就是一个异步的了，等到所有同步函数执行完以后才会等到里面的确切值。

比如这个小例子 1：

const littleExample1 = () => {
  const a = 1
  return a
}

这个littleExample1()的返回值就是一个 number 类型的 1;

而看下面这个小例子 2：

const littleExample2 = async () => {
  const a = 1
  return a
}

嘿，这个小例子 2 返回的就是个 Promise 了，你就说细节不细节，之前都没关注过，但这个场景确实在实际使用中有用到的，然后我就说为啥返回值不是预期的值呢，结果一排查就是这个 async 的原因。

三实例 2 解决方案#

话不多说，我们来看看 实例2 中的代码块如何处理才能得到一个我们预期的值，也就是： result: 2666 ，直接上代码：

const asyncFun = (value: number) => {
  return new Promise((resolve, reject) => {
    // 模拟一个异步请求
    setTimeout(() => {
      resolve(value + 1)
    }, 2000)
  })
}

const getValue = async () => {
  let result = await asyncFun(1)
  return result
}

const add666Value = async () => {
  let result: any = await getValue()
  result = result + '666'
  console.log('result:', result)
}

add666Value()

ok，这样子就是我们预期的输出结果了，也就是我们将add666Value()前面加了个 async ，将其声明为异步函数 ，getValue()前面再加个await ,这样getValue()返回的结果就不是 Promise 了，result 就可以得到一个 number 类型的 2，number 类型+string 类型时前面的 number 类型会变成 string 类型，相当于'2'+'666'，所以最终输出的结果就是：