纯函数是单元测试的完美案例。对于给定的输入，我们总是期望相同的输出——不涉及内部状态。让我们看一些示例和一些简单的测试，以检查这些方法是否按预期工作。 茉莉花 Jasmine 是 JavaScript 的单元测试框架。它可以在 Node.js 或浏览器上运行测试。它用在 Angular 框架中，在基于 Angular 的项目中尤其流行。对于 Vanilla JS 项目或基于其他框架的项目来说，它是一个不错的选择。 快乐路径测试 快乐的路径测试是当我们使用预期正常工作的输入来测试方法时。这些论据是有效的，并且在合理范围内。这些测试检查方法是否正确完成其工作 - 测试用例应该是如何在其文档中解释该方法的简单示例。 伪代码示例：    , expect(add(2, 2)).toBe(4)   expect(concatenate(“Lorem”, “Ipsum”)).toBe(“LoremIpsum”) 这些测试旨在在方法关键行为被破坏时自动捕获它。 方法 让我们看一些简单的方法：在一些实际应用程序中我们可能需要的简单操作。 所有的实现都大大简化了——如果我们为它们提供与预期略有不同的参数，所有方法都会以一种丑陋的方式被破坏。该代码远非健壮。 迎接 用名字和姓氏向用户打招呼的方法：   export function greet(name, surname) { return `Hello ${name} ${surname}!`; } 短日期 是一种格式化方法，它接受日期对象并将其格式化为短字符串。代码： shortDate   export function shortDate(date) { return date.toISOString().substring(0, 10); } 省略 接受一个长文本字符串和一个可选的长度参数，然后修剪该字符串以适合限制： ellipsis   export function ellipsis(text, length = 50) { if (text.length > length) { return text.substring(0, length) + "…"; } return text; } 翻译 一种为 和 对提供翻译后的字符串值的方法。它是可以用更高级的翻译库替换的简化实现。 key lang   export function translate(key, lang = "en") { switch (lang) { case "en": switch (key) { case "hello": return "Hello!"; } case "pl": switch (key) { case "hello": return "Cześć!"; } } } 申请折扣 对价格应用百分比折扣的方法。这种幼稚的实现可能让人感觉有点矫枉过正，但后来，当我们开始调查边缘情况时，它会变得更加有趣。   export function applyDiscount(price, discountPercentage) { return price - (price * discountPercentage) / 100; } 计算价格 该函数计算以给定价格购买多个单位时的总价。添加有趣的边缘情况后，它也会变得更加复杂。   export function calculatePrice(unitPrice, quantity) { return unitPrice * quantity; } 完整的JS代码 完整的JS代码，   ： src/main.js   export function greet(name, surname) { return `Hello ${name} ${surname}!`; } export function shortDate(date) { return date.toISOString().substring(0, 10); } export function ellipsis(text, length = 50) { if (text.length > length) { return text.substring(0, length) + "…"; } return text; } export function translate(key, lang = "en") { switch (lang) { case "en": switch (key) { case "hello": return "Hello!"; } case "pl": switch (key) { case "hello": return "Cześć!"; } } } export function applyDiscount(price, discountPercentage) { return price - (price * discountPercentage) / 100; } export function calculatePrice(unitPrice, quantity) { return unitPrice * quantity; } 添加 Jasmine 测试 要添加 Jasmine，我们首先将文件夹转换为 npm 包：   $ npm init -y Wrote to …/package.json: … 然后我们就可以安装 Jasmine 包了：   $ npm install --save-dev jasmine added 42 packages, and audited 43 packages in 2s 13 packages are looking for funding run `npm fund` for details found 0 vulnerabilities 然后我们就可以生成Jasmine使用的文件夹和文件了：   $ npx jasmine init (no output) 该命令生成以下内容：    — 一个文件夹，我们可以在其中放置 文件和测试，并且 spec/ *.spec.js  — 包含 Jasmine 配置的文件。 spec/support/jasmine.json 单元测试 对于以下单元测试，我仅关注快乐路径 - 我检查结果是否符合合理输入的预期。该测试应该是不言自明的，所以让我们看一下它们：   import { greet, shortDate, ellipsis, translate, applyDiscount, calculatePrice, } from "../src/main.js"; describe("main", () => { describe("greet", () => { it("should greet by name and surname", () => { expect(greet("Lorem", "Ipsum")).toEqual("Hello Lorem Ipsum!"); }); }); describe("shortDate", () => { it("should format correclty date", () => { const date = new Date("2023-11-02"); expect(shortDate(date)).toEqual("2023-11-02"); }); }); describe("shortDate", () => { it("should shorten long text at 50 chars", () => { expect( ellipsis( "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque a faucibus massa." ) ).toEqual("Lorem ipsum dolor sit amet, consectetur adipiscing…"); }); it("should leave short text unchanged", () => { expect(ellipsis("Lorem ipsum sin dolor")).toEqual( "Lorem ipsum sin dolor" ); }); it("should shorten to custom length", () => { expect(ellipsis("Lorem ipsum sin dolor", 10)).toEqual("Lorem ipsu…"); }); }); describe("translate", () => { it("should translate to supported langauges", () => { expect(translate("hello", "en")).toEqual("Hello!"); expect(translate("hello", "pl")).toEqual("Cześć!"); }); }); describe("applyDiscount", () => { it("should lower the price accordingly", () => { expect(applyDiscount(120, 25)).toEqual(90); expect(applyDiscount(8, 50)).toEqual(4); }); }); describe("calculatePrice", () => { it("should find a price of many products", () => { expect(calculatePrice(4, 3)).toEqual(12); expect(calculatePrice(9, 0.5)).toEqual(4.5); }); }); });  （文件  ） spec/main.spec.js 运行测试 要运行测试，我们可以将以下脚本添加到  ： package.json  .. "scripts": { "test": "jasmine" }, … 完成此操作后，  运行我们的测试： npm run test   $ npm run test > testing-example@1.0.0 test > jasmine Randomized with seed 76873 Started ........ 8 specs, 0 failures Finished in 0.004 seconds Randomized with seed 76873 (jasmine --random=true --seed=76873) 概括 在这篇文章中，我们了解了一个简单的 JS 代码示例以及如何通过单元测试覆盖它。您可以 。 在 GitHub 上找到完整的代码示例 也发布 在这里

2022 - HackerNoon Contributor of the Year - Beginners Guide

2022 - HackerNoon Contributor of the Year - Code Quality

2022 - HackerNoon Contributor of the Year - Learning

2022 - the Greatest Storyteller

Newsletter

Senior JS developer

該音頻是用故事的原始語言製作的！

Jasmine：关于纯函数和基本测试的初学者友好指南

About Author

註釋

標籤

这篇文章刊登在

Related Stories

加密货币增长：创建有效的用户角色

从论坛到信息流：社交媒体算法如何塑造数字互动

成功云迁移的完整指南：策略和最佳实践

Floki 的 Valhalla 成为印度环斯里兰卡赛事联合赞助商

加密货币增长：创建有效的用户角色

从论坛到信息流：社交媒体算法如何塑造数字互动

成功云迁移的完整指南：策略和最佳实践

Floki 的 Valhalla 成为印度环斯里兰卡赛事联合赞助商

Light-Mode

Classic

Newspaper

Dark-Mode

Neon Noir

Minty

HN StartUps