0Pricing
TypeScript Academy · บทเรียน

การกำหนดชนิดข้อมูลให้การทดสอบและม็อก; expectTypeOf

ใช้ expectTypeOf สำหรับการตรวจสอบแบบสแตติก และใช้ม็อกที่มีชนิดข้อมูลปลอดภัยใน Vitest/Jest เพื่อป้องกันการทดสอบที่เปราะบาง

การกำหนดชนิดข้อมูลให้การทดสอบและม็อก; expectTypeOf เป็นบทเรียน TypeScript Academy ฟรีบน CoddyKit นี่คือบทเรียนที่ 2 จากทั้งหมด 3 บทเรียน คุณสามารถอ่านบทเรียนทั้งหมดด้านล่างฟรี — จากนั้นลองปฏิบัติด้วยตัวคุณเองในเบราว์เซอร์พร้อมตัวแก้ไขโค้ดในตัวและติวเตอร์ AI ตลอด 24/7 บทเรียนนี้เป็นส่วนหนึ่งของเส้นทางการเรียน TypeScript Academy และความก้าวหน้าของคุณจะซิงค์ข้ามเว็บและแอป CoddyKit คอร์ส TypeScript Academy มีบทเรียนทั้งหมด 3 บทเรียน

บทนำ

เป้าหมาย: ตรวจสอบชนิดข้อมูลด้วย expectTypeOf และเขียน ม็อกที่ปลอดภัยด้านชนิดข้อมูล เพื่อไม่ให้การปรับโครงสร้างทำให้การทดสอบเสียหายโดยไม่รู้ตัว

พื้นฐานของ expectTypeOf

expectTypeOf ตรวจสอบชนิดข้อมูลระหว่างคอมไพล์ใน Vitest ไม่มีต้นทุนขณะรัน แต่ช่วยตรวจจับความไม่ตรงกันได้ตั้งแต่เนิ่น ๆ

// Vitest provides expectTypeOf
import { expectTypeOf } from "vitest";

function fullName(first: string, last: string) {
  return `${first} ${last}`
}

// static checks (compile-time)
expectTypeOf(fullName).toBeFunction()
expectTypeOf(fullName("Ada","Lovelace")).toBeString()

การตรวจยืนยันขั้นสูง

รูปแบบที่มีประโยชน์ ได้แก่ การแกะชนิดผลลัพธ์ที่แก้ไขแล้วด้วย Awaited<ReturnType<...>> รวมถึงการเปรียบเทียบชนิดข้อมูลแบบลิเทอรัลและยูเนียน

import { expectTypeOf } from "vitest";

interface User { id: number; name: string }
function getUser(): Promise<User> { return Promise.resolve({ id:1, name:"A" }) }

// unwrap Promise
type Resolved = Awaited<ReturnType<typeof getUser>>
expectTypeOf<Resolved>().toMatchTypeOf<User>()

// literal + union
const status = "ok" as const
expectTypeOf(status).toEqualTypeOf<"ok">()

ม็อกของ Vitest

กำหนดชนิดของม็อกให้ถูกต้องโดยระบุลายเซ็นให้ vi.fn อาร์กิวเมนต์ที่ไม่ถูกต้องจะถูกตรวจพบระหว่างคอมไพล์

import { vi, describe, it, expect } from "vitest";

function fetchUser(id: number): Promise<string> {
  return Promise.resolve(`user-${id}`)
}

// typed mock
const mockFetch: ReturnType<typeof vi.fn<[(id: number), Promise<string>]>> = vi.fn(async (id: number) => `user-${id}`)

it("uses typed mock", async () => {
  const name = await mockFetch(5)
  expect(name).toBe("user-5")
  // mockFetch("x") // TS error: id must be number
})

ม็อกของ Jest

ใน Jest ให้บังคับใช้ลายเซ็นการเรียกด้วย jest.fn<Signature>(); และระบุชนิดของม็อกให้ชัดเจนด้วย MockedFunction

import { jest } from "@jest/globals";

function times(a: number, b: number) { return a * b }

const mul = jest.fn<(a:number,b:number)=>number>((a,b)=>a*b)

mul(2,3) // ok
// mul("2",3) // TS error

// MockedFunction utility
type MulMock = jest.MockedFunction<typeof mul>
const _check: MulMock = mul

เคล็ดลับ

แยกการตรวจสอบค่า (ขณะรัน) ออกจากการตรวจสอบชนิดข้อมูล (ระหว่างคอมไพล์) เพราะทั้งสองอย่างเป็นคนละชั้นกัน

// value assertions
import { expect } from "vitest";
expect(2 + 3).toBe(5)

// type assertions (compile-time)
import { expectTypeOf } from "vitest";
expectTypeOf(2 + 3).toBeNumber()

// don't confuse with runtime validators like zod

คำถาม

ตรวจสอบอย่างรวดเร็ว: expectTypeOf ตรวจสอบอะไรระหว่างการเรียกใช้การทดสอบ

สรุปทบทวน

สรุปทบทวน: expectTypeOf — การรับประกันชนิดข้อมูลระหว่างคอมไพล์; vi.fn/jest.fn — ม็อกที่ปลอดภัยด้านชนิดข้อมูลพร้อมลายเซ็น

คำถามที่พบบ่อย

บทเรียน “การกำหนดชนิดข้อมูลให้การทดสอบและม็อก; expectTypeOf” ฟรีหรือไม่

ใช่ — ข้อความเต็มของ “การกำหนดชนิดข้อมูลให้การทดสอบและม็อก; expectTypeOf” ฟรีให้อ่านที่นี่บนเว็บ เพื่อปฏิบัติแบบโต้ตอบ (ตัวแก้ไขโค้ดในตัวและติวเตอร์ AI ตลอด 24/7) และปลดล็อคส่วนที่เหลือของคอร์ส TypeScript Academy ให้อัปเกรดเป็น CoddyKit PRO คอร์ส TypeScript Academy มีบทเรียนทั้งหมด 3 บทเรียน

คุณจะเรียนรู้อะไรในบทเรียน “การกำหนดชนิดข้อมูลให้การทดสอบและม็อก; expectTypeOf”

ใช้ expectTypeOf สำหรับการตรวจสอบแบบสแตติก และใช้ม็อกที่มีชนิดข้อมูลปลอดภัยใน Vitest/Jest เพื่อป้องกันการทดสอบที่เปราะบาง คุณปฏิบัติ TypeScript Academy ด้วยโค้ดที่ใช้งานได้จริงที่คุณเรียกใช้โดยตรงในเบราว์เซอร์ และติวเตอร์ AI ตลอด 24/7 ตอบคำถามของคุณขณะที่คุณไปผ่านบทเรียน

คุณต้องมีประสบการณ์ก่อนที่จะเริ่มเรียน TypeScript Academy หรือไม่

ไม่จำเป็นต้องมีประสบการณ์มาก่อน TypeScript Academy บน CoddyKit ออกแบบมาสำหรับผู้เริ่มต้นไปจนถึงผู้เรียนขั้นสูง คุณสามารถเริ่มต้นที่นี่หรือเริ่มจากตัวแรกและเรียนด้วยความเร็วของคุณเอง นี่คือบทเรียนที่ 2 จากทั้งหมด 3 บทเรียน

บทเรียน “การกำหนดชนิดข้อมูลให้การทดสอบและม็อก; expectTypeOf” ใช้เวลานานแค่ไหน

บทเรียน CoddyKit ส่วนใหญ่ใช้เวลาประมาณ 5–10 นาที แต่ละบทเรียนจึงสั้นและเป็นแบบโต้ตอบ คุณสามารถก้าวหน้าอย่างต่อเนื่องและกลับมาเรียนต่อจากตรงที่เพิ่งหยุดบนเว็บและแอปได้เลย

ฉันเขียนและรันโค้ดในบทเรียน TypeScript Academy นี้ได้ไหม

ได้ บทเรียน TypeScript Academy ทุกบทมีตัวแก้ไขโค้ดในตัว คุณจึงเขียนและรันโค้ดจริงได้เลยในเบราว์เซอร์ และได้รับข้อเสนอแนะจาก AI ในทันที — ไม่ต้องติดตั้งในเครื่องของคุณ

บทเรียนทั้งหมดในหลักสูตรนี้

  1. การตั้งค่า Vitest/Jest สำหรับ TS
  2. การกำหนดชนิดข้อมูลให้การทดสอบและม็อก; expectTypeOf
  3. ภาพรวมการกำหนดชนิดข้อมูลการทดสอบ E2E (Playwright/Cypress)
← กลับไปที่ TypeScript Academy