在 VSCode 中编写简单 JavaScript 测试用例的步骤和示例

📅 发布时间:2026/7/15 22:01:28 👁️ 浏览次数:
在 VSCode 中编写简单 JavaScript 测试用例的步骤和示例
步骤 1创建项目文件夹在你的工作区中创建一个新文件夹例如VSCode-js-test-demo。步骤 2初始化项目在 VSCode 中打开该文件夹。打开终端 (Ctrl 或Terminal - New Terminal)。运行命令初始化项目npminit -y这会创建一个默认的package.json文件。步骤 3安装测试框架选择一个测试框架安装。这里以流行的Jest为例npminstall--save-dev jest(备选你也可以选择MochaChai等组合)步骤 4编写被测试的函数创建一个文件math.js写入一个简单的函数// math.jsfunctionadd(a,b){returnab;}functionsubtract(a,b){returna-b;}module.exports{add,subtract};步骤 5编写测试用例创建一个测试文件math.test.js(Jest 默认会查找*.test.js文件)// math.test.jsconst{add,subtract}require(./math);// 导入要测试的函数// 描述测试组 (通常描述被测试的功能模块)describe(数学函数测试,(){// 测试用例 1: 测试 add 函数it(应该正确计算两个数字的和,(){// 断言调用 add(2, 3)预期结果是 5expect(result).toBe(5);expect(add(-1,1)).toBe(0);});// 测试用例 2: 测试 subtract 函数it(应该正确计算两个数字的差,(){// 断言调用 subtract(5, 3)预期结果是 2expect(subtract(5,3)).toBe(2);expect(subtract(10,20)).toBe(-10);});});步骤 6配置package.json运行脚本打开package.json在scripts部分添加一个test命令{name:js-test-demo,version:1.0.0,scripts:{test:jest// 添加这行},devDependencies:{jest:^29.7.0}}步骤 7运行测试在终端运行命令npmtest预期输出你会看到类似下面的输出表明两个测试用例都通过了PASS ./math.test.js 数学函数测试 ✓ 应该正确计算两个数字的和 (2 ms) ✓ 应该正确计算两个数字的差 Test Suites: 1 passed, 1 total Tests: 2 passed, 2 total Snapshots: 0 total Time: 0.123 s Ran all test suites.进阶单独调试某个测试用例的返回值如果你只想查看某一个测试用例的返回值不需要运行全部用例可以将目标测试用例的 test() 改为 test.only()仅运行该用例// math.test.jsconst{add,subtract}require(./math);// 导入要测试的函数// 描述测试组 (通常描述被测试的功能模块)describe(数学函数测试,(){test.only(应该正确计算两个数字的和,(){// 先接收返回值constresultadd(2,3);// 打印具体返回值标注场景便于识别console.log(【应该正确计算两个数字的和】返回值,result);expect(result).toBe(5);});});运行 npm test终端只会输出该用例的返回值和测试结果更聚焦。总结总结创建项目npm init -y安装测试框架npm install --save-dev jest编写功能代码 (math.js)编写测试代码 (math.test.js)使用describe,it,expect等配置package.json的test脚本运行测试npm test这样就完成了一个简单的 JavaScript 测试用例。你可以根据需要扩展功能函数和添加更多的测试用例。