TypeScript Academy · บทเรียน

การประกอบผลข้างเคียง

เชื่อมและรวมผลข้างเคียงด้วย pipe และตัวสร้าง

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

การประกอบเอฟเฟกต์

เอฟเฟกต์เป็นค่า ดังนั้นคุณจึงสร้างโปรแกรมด้วยการ นำเอฟเฟกต์มาประกอบกัน เครื่องมือหลักคือ Effect.pipe, Effect.map, Effect.flatMap และไวยากรณ์ที่อาศัยตัวสร้างจาก Effect.gen

pipe: การส่งต่อผ่านฟังก์ชัน

pipe ส่งเอฟเฟกต์ผ่านการแปลงหลายขั้นจากซ้ายไปขวา ช่วยหลีกเลี่ยงการซ้อนกันหลายชั้น

import { Effect, pipe } from "effect";

const program = pipe(
  Effect.succeed(2),
  Effect.map((n) => n + 1),
  Effect.map((n) => n * 10)
);
// Effect<number, never, never> producing 30

map: การแปลงค่าความสำเร็จ

Effect.map ใช้ฟังก์ชันบริสุทธิ์กับค่าความสำเร็จ โดยไม่เปลี่ยนแปลงช่องทางข้อผิดพลาดและข้อกำหนด

import { Effect } from "effect";

const doubled = Effect.map(Effect.succeed(21), (n) => n * 2);
// Effect<number, never, never>

flatMap: การจัดลำดับเอฟเฟกต์

เมื่อขั้นถัดไปเป็นเอฟเฟกต์ด้วยตัวเอง ให้ใช้ flatMap (เรียกอีกอย่างว่า chain) โดยจะเรียกใช้เอฟเฟกต์แรก แล้วส่งค่าของมันเข้าไปยังฟังก์ชันที่ส่งคืนเอฟเฟกต์อีกตัว

import { Effect, pipe } from "effect";

const getId = Effect.succeed(1);
const loadUser = (id: number) => Effect.succeed({ id, name: "Ada" });

const program = pipe(getId, Effect.flatMap(loadUser));
// Effect<{ id: number; name: string }, never, never>

map เทียบกับ flatMap

ใช้ map เมื่อฟังก์ชันของคุณส่งคืน ค่าธรรมดา และใช้ flatMap เมื่อฟังก์ชันส่งคืน เอฟเฟกต์ หากใช้ map กับฟังก์ชันที่ส่งคืนเอฟเฟกต์ คุณจะได้เอฟเฟกต์ที่ซ้อนกัน

ช่องทางสะสมกัน

เมื่อคุณจัดลำดับเอฟเฟกต์ ชนิดข้อผิดพลาดจะ รวมกันเป็นยูเนียน และข้อกำหนดก็จะรวมกันเช่นเดียวกัน ชนิดข้อมูลที่ประกอบแล้วจะแสดงทุกสิ่งที่อาจล้มเหลวและทุกสิ่งที่จำเป็นต้องใช้

// Effect<A, E1, R1> then Effect<B, E2, R2>
// => Effect<B, E1 | E2, R1 | R2>

Effect.gen: ไวยากรณ์ตัวสร้าง

Effect.gen ช่วยให้คุณเขียนโค้ดเอฟเฟกต์แบบลำดับต่อเนื่องที่อ่านคล้าย async/await โดยใช้ yield* เพื่อดึงค่าจากเอฟเฟกต์แต่ละตัวออกมา

import { Effect } from "effect";

const program = Effect.gen(function* () {
  const id = yield* Effect.succeed(1);
  const user = yield* Effect.succeed({ id, name: "Ada" });
  return user.name;
});
// Effect<string, never, never>

gen เทียบกับ pipe

gen อ่านเข้าใจได้ชัดเจนกว่าสำหรับลำดับงานหลายขั้นแบบเส้นตรงที่มีตัวแปรระหว่างทาง ส่วน pipe เหมาะกับสายการแปลงสั้น ๆ ทั้งสองแบบทำงานร่วมกันได้อย่างอิสระ

การรวมเอฟเฟกต์ที่เป็นอิสระต่อกัน

Effect.all เรียกใช้เอฟเฟกต์หลายตัวและรวบรวมผลลัพธ์ พร้อมสะสมข้อผิดพลาดและข้อกำหนดจากเอฟเฟกต์ทั้งหมด

import { Effect } from "effect";

const both = Effect.all([Effect.succeed(1), Effect.succeed("x")]);
// Effect<[number, string], never, never>

ยังคงเลื่อนการทำงานไว้

ทั้งหมดนี้เป็นเพียงการ อธิบาย โปรแกรมเท่านั้น จะไม่มีการทำงานใดเกิดขึ้นจนกว่าคุณจะเรียกใช้โปรแกรมที่ขอบเขตสุดท้ายด้วย Effect.runPromise หรือ Effect.runSync

import { Effect } from "effect";
// const result = await Effect.runPromise(program);

เหตุผลที่เรื่องนี้สำคัญ

การประกอบคือสิ่งที่ทำให้เอฟเฟกต์นำไปใช้งานได้จริง คุณสามารถนำชิ้นส่วนขนาดเล็กที่มีชนิดข้อมูลมาประกอบเป็นโปรแกรมขนาดใหญ่ โดยให้คอมไพเลอร์ติดตามข้อผิดพลาดและการพึ่งพาทุกอย่าง map, flatMap, pipe และ gen คือคำสั่งที่ใช้เป็นประจำในโค้ดของไลบรารีนี้

ตรวจสอบอย่างรวดเร็ว

ตรวจสอบความเข้าใจของคุณเกี่ยวกับการประกอบเอฟเฟกต์

สรุป

คุณประกอบเอฟเฟกต์ด้วย map (แปลงค่าที่สำเร็จ), flatMap (จัดลำดับขั้นตอนที่คืนค่าเอฟเฟกต์), pipe (ส่งค่าต่อผ่านการแปลงต่าง ๆ) และ Effect.gen (ไวยากรณ์ตัวสร้างที่ทำงานคล้ายการรอค่า) ช่องข้อผิดพลาดและช่องข้อกำหนด สะสมเป็นยูเนียน และจะไม่มีสิ่งใดทำงานจนกว่าคุณจะเรียกใช้ที่ขอบเขตการทำงาน

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

บทเรียน “การประกอบผลข้างเคียง” ฟรีหรือไม่

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

คุณจะเรียนรู้อะไรในบทเรียน “การประกอบผลข้างเคียง”

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

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

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

บทเรียน “การประกอบผลข้างเคียง” ใช้เวลานานแค่ไหน

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

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

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

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

← กลับไปที่ TypeScript Academy