纯函数是单元测试的完美案例。对于给定的输入，我们总是期望相同的输出——不涉及内部状态。让我们看一些示例和一些简单的测试，以检查这些方法是否按预期工作。 茉莉花 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

释放人工智能的力量。前沿技术的系统评价：摘要与介绍

Telegram：加密岛通往大陆的桥梁

如何将您的工作流程提高 10 倍：17 个必备应用程序

看不见的层面：为什么用户访谈是不可替代的资产

释放人工智能的力量。前沿技术的系统评价：摘要与介绍

Telegram：加密岛通往大陆的桥梁

如何将您的工作流程提高 10 倍：17 个必备应用程序

看不见的层面：为什么用户访谈是不可替代的资产

Light-Mode

Classic

Newspaper

Minty

Dark-Mode

Neon Noir

Minty

HN StartUps