TypeScript Academy · บทเรียน

การแยกสตริงระดับชนิดข้อมูล

แยกสตริงเป็นทูเพิลภายในระบบชนิดข้อมูล

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

ชนิดลิเทอรัลแม่แบบ

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

สัญกรณ์: ใน TypeScript จริง ชนิดลิเทอรัลแม่แบบจะเขียนด้วยสตริงที่คั่นด้วยเครื่องหมายแบ็กทิกและมีช่องแทนค่าดอลลาร์-วงเล็บปีกกา ในตัวอย่างเหล่านี้ เราแสดงรูปแบบดังกล่าวเป็น Tpl<...> โดยเรียงส่วนต่าง ๆ ตามลำดับ ตัวอย่างเช่น แม่แบบแบ็กทิกที่จับคู่คำนำหน้าลิเทอรัลแล้วตามด้วย Rest จะแสดงเป็น Tpl<'prefix', infer Rest>

type StartsWithA<S> = S extends Tpl<'a', string> ? true : false;
// Tpl<'a', string> is a backtick template literal type: 'a' then anything

type X = StartsWithA<'abc'>; // true
type Y = StartsWithA<'bcd'>; // false

การอนุมานส่วนต่อท้าย

วาง infer ไว้ภายในแม่แบบเพื่อจับบางส่วนของสตริง ในที่นี้เราจับทุกอย่างหลัง "a" ที่อยู่ข้างหน้า

type AfterA<S> = S extends Tpl<'a', infer Rest> ? Rest : never;
// Tpl<'a', Rest> captures everything after a leading 'a'

type X = AfterA<'abc'>; // 'bc'

การแยกด้วยตัวคั่น

หากต้องการแยกสตริงที่ตำแหน่งการปรากฏครั้งแรกของตัวคั่น ให้จับคู่รูปแบบ "ส่วนหัว ตัวคั่น ส่วนท้าย" และอนุมานทั้งสองด้าน ระบบจะเลือกการจับคู่ครั้งแรก เพราะการอนุมานส่วนหัวจะจับจากด้านซ้ายอย่างละโมบ

type SplitOnce<S, Sep extends string> =
  S extends Tpl<infer Head, Sep, infer Tail>
    ? [Head, Tail]
    : [S];
// Tpl<Head, Sep, Tail> matches up to the first separator

type X = SplitOnce<'a-b-c', '-'>; // ['a', 'b-c']

การแยกแบบเวียนเกิด

หากต้องการแยกเป็น ทุกส่วน ให้เรียกซ้ำกับส่วนท้าย รวบรวมส่วนหัวแต่ละส่วนลงในทูเพิลจนกว่าจะไม่เหลือตัวคั่น

type Split<S extends string, Sep extends string> =
  S extends Tpl<infer Head, Sep, infer Tail>
    ? [Head, ...Split<Tail, Sep>]
    : [S];
// recurse on Tail until no separator remains

type X = Split<'a.b.c', '.'>; // ['a', 'b', 'c']

ติดตามการเวียนเกิด

ติดตาม Split<"a.b.c", ".">:

ส่วนหัว "a" ส่วนท้าย "b.c" -> ["a", ...Split<"b.c">]
ส่วนหัว "b" ส่วนท้าย "c" -> ["b", ...Split<"c">]
"c" ไม่มี "." จึงเป็นกรณีฐาน -> ["c"]

ผลลัพธ์: ["a", "b", "c"]

type X = Split<"one,two", ",">; // ["one", "two"]
type Y = Split<"x/y/z", "/">; // ["x", "y", "z"]

การจัดการส่วนว่าง

การแยกอาจสร้างสตริงว่างเมื่อมีตัวคั่นอยู่ติดกันหรืออยู่ที่ขอบ สัญญาณรูปแบบยังคงจับคู่ได้ โดยอนุมาน Head หรือ Tail ที่ว่างเปล่า

type X = Split<"a,,b", ",">; // ["a", "", "b"]
type Y = Split<",a", ",">;   // ["", "a"]

การนำกลับมารวมกัน

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

type Join<T extends string[], Sep extends string> =
  T extends [infer H extends string, ...infer R extends string[]]
    ? R extends [] ? H : Tpl<H, Sep, Join<R, Sep>>
    : '';
// Tpl<...> denotes a template literal type concatenation

type X = Join<['a', 'b', 'c'], '-'>; // 'a-b-c'

การตัดช่องว่าง

เครื่องมือสำหรับสตริงสามารถประกอบกันได้ ชนิด Trim จะลบช่องว่างด้านหน้าและด้านหลังออก โดยลบช่องว่างทีละตัวซ้ำ ๆ ผ่านการอนุมานแม่แบบ

type TrimLeft<S extends string> =
  S extends Tpl<' ', infer R> ? TrimLeft<R> : S;
type TrimRight<S extends string> =
  S extends Tpl<infer R, ' '> ? TrimRight<R> : S;
type Trim<S extends string> = TrimRight<TrimLeft<S>>;
// Tpl<' ', R> strips a leading space; Tpl<R, ' '> strips a trailing one

type X = Trim<'  hi  '>; // 'hi'

การแทนที่ส่วนย่อยของสตริง

การแทนที่ทำได้โดยแยกสตริงรอบส่วนเป้าหมาย แล้วนำกลับมารวมกันโดยใช้ข้อความทดแทน ทั้งหมดนี้ทำผ่านการอนุมานแม่แบบและการเรียกซ้ำ

type ReplaceAll<S extends string, From extends string, To extends string> =
  S extends Tpl<infer A, From, infer B>
    ? Tpl<A, To, ReplaceAll<B, From, To>>
    : S;
// split around From, then rejoin with To via template literal types

type X = ReplaceAll<'a-b-c', '-', '_'>; // 'a_b_c'

เหตุผลที่การแยกมีความสำคัญ

การแยกเป็นรากฐานของการแยกวิเคราะห์แบบมีโครงสร้าง เส้นทางจะแยกด้วย "/" สตริงคำค้นจะแยกด้วย "&" และแถว CSV จะแยกด้วย "," ด้วย Split คุณจะเปลี่ยนชนิดสตริงแบบแบนให้เป็นทูเพิลที่ประมวลผลทีละองค์ประกอบได้

type Segments = Split<"users/42/posts", "/">; // ["users", "42", "posts"]

ข้อควรระวังเกี่ยวกับความลึก

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

type Ok = Split<"a/b/c/d/e", "/">; // fine for small strings

ตรวจสอบความเข้าใจ

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

สรุปทบทวน

คุณได้แยกสตริงทั้งหมดภายในชนิดข้อมูล

ชนิดลิเทอรัลแม่แบบร่วมกับ infer สามารถจับคู่และจับส่วนต่าง ๆ ของสตริงได้
SplitOnce แยกที่ตัวคั่นตัวแรก ส่วนการเรียกซ้ำจะให้ผลลัพธ์ Split ที่ครบถ้วน
การรวม การตัดช่องว่าง และ ReplaceAll สามารถประกอบขึ้นจากเครื่องมือชุดเดียวกัน

ถัดไป: การดึงข้อมูลที่มีโครงสร้างจากชนิดสตริง

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

บทเรียน “การแยกสตริงระดับชนิดข้อมูล” ฟรีหรือไม่

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

คุณจะเรียนรู้อะไรในบทเรียน “การแยกสตริงระดับชนิดข้อมูล”

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

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

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

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

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

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

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

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

แนวคิดตัวประกอบการแยกวิเคราะห์
การแยกสตริงระดับชนิดข้อมูล
การแยกวิเคราะห์ด้วยสตริงแบบแม่แบบ
ตัวแยกวิเคราะห์เส้นทางระดับชนิดข้อมูลฉบับย่อ

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