สมาชิก rest ของทูเพิล
ใช้สมาชิก rest ภายในชนิดข้อมูลทูเพิล
สมาชิก rest ของทูเพิล เป็นบทเรียน TypeScript Academy ฟรีบน CoddyKit นี่คือบทเรียนที่ 3 จากทั้งหมด 4 บทเรียน คุณสามารถอ่านบทเรียนทั้งหมดด้านล่างฟรี — จากนั้นลองปฏิบัติด้วยตัวคุณเองในเบราว์เซอร์พร้อมตัวแก้ไขโค้ดในตัวและติวเตอร์ AI ตลอด 24/7 บทเรียนนี้เป็นส่วนหนึ่งของเส้นทางการเรียน TypeScript Academy และความก้าวหน้าของคุณจะซิงค์ข้ามเว็บและแอป CoddyKit คอร์ส TypeScript Academy มีบทเรียนทั้งหมด 4 บทเรียน
ทูเพิลที่มีความยาวแปรผัน
โดยปกติทูเพิลจะมีความยาวคงที่ แต่ สมาชิกส่วนที่เหลือ ช่วยให้ตำแหน่งหนึ่งรองรับสมาชิกได้ทุกจำนวน วิธีนี้ใช้จำลองข้อมูลที่มีทั้งส่วนคงที่และส่วนแปรผัน
ส่วนที่เหลือท้ายทูเพิล
เขียน [string, ...number[]] เพื่อหมายถึงสตริงหนึ่งค่า ตามด้วยตัวเลขตั้งแต่ศูนย์ค่าขึ้นไป ช่องแรกมีตำแหน่งคงที่ ส่วนที่เหลือสามารถเพิ่มได้อย่างอิสระ
type Row = [string, ...number[]]
const r: Row = ["scores", 9, 8, 7]
console.log(r[0], r.length) // scores 4ส่วนคงที่เป็นสิ่งที่ต้องมี
สมาชิกคงที่ที่อยู่ด้านหน้าต้องมีอยู่เสมอ ส่วนที่เหลืออาจไม่มีสมาชิกได้ แต่จะข้ามช่องคงที่ไม่ได้
type Row = [string, ...number[]]
const min: Row = ["label"] // ok, zero numbers
// const bad: Row = [] // Error: missing string
console.log(min)ส่วนที่เหลือนำหน้า
สมาชิกส่วนที่เหลือสามารถอยู่ ด้านหน้า และมีสมาชิกคงที่อยู่หลังจากนั้นได้เช่นกัน วิธีนี้ใช้จำลองส่วนหัวที่มีความยาวแปรผันและส่วนท้ายที่มีความยาวคงที่
type Trailing = [...number[], boolean]
const t: Trailing = [1, 2, 3, true]
console.log(t[t.length - 1]) // trueส่วนที่เหลือตรงกลาง
ส่วนที่เหลือสามารถอยู่ตรงกลาง ระหว่างสมาชิกคงที่ด้านหน้าและด้านท้ายได้ TypeScript จะระบุตำแหน่งที่เป็นส่วนคงที่ของแต่ละด้านให้
type Middle = [string, ...number[], boolean]
const m: Middle = ["start", 1, 2, false]
console.log(m[0], m[m.length - 1]) // start falseทูเพิลมีส่วนที่เหลือได้เพียงหนึ่งส่วน
ทูเพิลหนึ่งชุดมีสมาชิกส่วนที่เหลือได้มากที่สุดหนึ่งส่วน หากมีสองส่วน ตำแหน่งของสมาชิกจะไม่ชัดเจน จึงไม่อนุญาตให้ใช้
// type Bad = [...string[], ...number[]] // Error: only one rest allowed
type Ok = [string, ...number[]]
const o: Ok = ["x", 1]
console.log(o)การแยกโครงสร้างทูเพิลที่มีส่วนที่เหลือ
การแยกโครงสร้างสอดคล้องกับสมาชิกส่วนที่เหลือของทูเพิลอย่างพอดี ตัวแปรรับค่าคงที่จะรับค่าจากช่องคงที่ ส่วนตัวแปรรับค่าส่วนที่เหลือจะเก็บส่วนที่แปรผันไว้เป็นอาร์เรย์ที่มีชนิดข้อมูลกำกับ
type Row = [string, ...number[]]
const row: Row = ["scores", 9, 8]
const [label, ...values] = row
console.log(label, values) // scores [9, 8]สมาชิกทูเพิลแบบมีป้ายกำกับ
คุณสามารถตั้งชื่อให้ตำแหน่งต่าง ๆ ในทูเพิลเพื่อใช้เป็นเอกสารกำกับได้ ป้ายกำกับจะแสดงในคำแนะนำเครื่องมือและลายเซ็น แต่ไม่เปลี่ยนค่า ณ เวลาทำงาน
type Range = [start: number, end: number]
const span: Range = [0, 10]
console.log(span[0], span[1]) // 0 10ป้ายกำกับของสมาชิกส่วนที่เหลือ
สมาชิกส่วนที่เหลือสามารถมีป้ายกำกับได้เช่นกัน ซึ่งมีประโยชน์เป็นพิเศษในทูเพิลพารามิเตอร์ของฟังก์ชัน เพราะช่วยให้คำแนะนำอ่านเข้าใจได้ง่ายขึ้น
type Args = [command: string, ...flags: string[]]
const a: Args = ["build", "--watch", "--minify"]
console.log(a[0], a.slice(1))ทูเพิลส่วนที่เหลือเป็นรายการพารามิเตอร์
ทูเพิลที่มีสมาชิกส่วนที่เหลือสามารถใช้ระบุรายการพารามิเตอร์ของฟังก์ชันได้ ทำให้สร้างลายเซ็นที่กำหนดส่วนคงที่ก่อนแล้วตามด้วยส่วนแปรผันผ่านการกระจายได้อย่างแม่นยำ
type Params = [name: string, ...scores: number[]]
function report(...args: Params): string {
const [name, ...scores] = args
return name + ": " + scores.join(",")
}
console.log(report("Ada", 9, 8))เหตุผลที่ทูเพิลส่วนที่เหลือมีความสำคัญ
ทูเพิลส่วนที่เหลือสามารถสื่อโครงสร้างที่อาร์เรย์ทั่วไปสื่อไม่ได้ เช่น ส่วนหัวที่ต้องมีตามด้วยเนื้อหาที่มีความยาวแปรผัน เนื้อหาที่มีความยาวแปรผันตามด้วยส่วนท้ายที่ต้องมี หรือมีทั้งสองรูปแบบ ทูเพิลเหล่านี้เป็นพื้นฐานสำคัญของการกำหนดชนิดข้อมูลให้ฟังก์ชันที่รับอาร์กิวเมนต์ได้หลายจำนวน
type CSVRow = [id: number, ...fields: string[]]
const row: CSVRow = [1, "Ada", "Engineer"]
console.log(row[0], row.slice(1))ตรวจสอบความเข้าใจ
ทดสอบความเข้าใจเกี่ยวกับสมาชิกส่วนที่เหลือของทูเพิล
ทบทวน
สมาชิกส่วนที่เหลือของทูเพิล (...T[]) ช่วยให้ตำแหน่งหนึ่งรองรับสมาชิกได้ทุกจำนวน ขณะที่สมาชิกคงที่ด้านหน้าและด้านท้ายยังคงเป็นสิ่งที่ต้องมี ส่วนที่เหลืออาจอยู่ท้าย อยู่หน้า หรืออยู่ตรงกลางก็ได้ แต่ทูเพิลหนึ่งชุดอนุญาตให้มีส่วนที่เหลือได้เพียงหนึ่งส่วน การแยกโครงสร้างจะสอดคล้องกับโครงสร้างเหล่านี้ ป้ายกำกับช่วยเพิ่มคำแนะนำที่อ่านเข้าใจง่าย และทูเพิลส่วนที่เหลือเป็นพื้นฐานของการกำหนดชนิดข้อมูลให้ฟังก์ชันที่รับอาร์กิวเมนต์ได้หลายจำนวน
เรียนรู้ TypeScript ด้วย AI tutor — ฟรี
เขียนและเรียกใช้โค้ดจริงในเบราว์เซอร์ของคุณ รับความช่วยเหลือทันทีจาก AI tutor 24/7 และเรียนรู้ต่อจากที่คุณหยุดบนเว็บหรือในแอป
- คอร์ส
- 101
- บทเรียน
- 352
คำถามที่พบบ่อย
บทเรียน “สมาชิก rest ของทูเพิล” ฟรีหรือไม่
ใช่ — ข้อความเต็มของ “สมาชิก rest ของทูเพิล” ฟรีให้อ่านที่นี่บนเว็บ เพื่อปฏิบัติแบบโต้ตอบ (ตัวแก้ไขโค้ดในตัวและติวเตอร์ AI ตลอด 24/7) และปลดล็อคส่วนที่เหลือของคอร์ส TypeScript Academy ให้อัปเกรดเป็น CoddyKit PRO คอร์ส TypeScript Academy มีบทเรียนทั้งหมด 4 บทเรียน
คุณจะเรียนรู้อะไรในบทเรียน “สมาชิก rest ของทูเพิล”
ใช้สมาชิก rest ภายในชนิดข้อมูลทูเพิล คุณปฏิบัติ TypeScript Academy ด้วยโค้ดที่ใช้งานได้จริงที่คุณเรียกใช้โดยตรงในเบราว์เซอร์ และติวเตอร์ AI ตลอด 24/7 ตอบคำถามของคุณขณะที่คุณไปผ่านบทเรียน
คุณต้องมีประสบการณ์ก่อนที่จะเริ่มเรียน TypeScript Academy หรือไม่
ไม่จำเป็นต้องมีประสบการณ์มาก่อน TypeScript Academy บน CoddyKit ออกแบบมาสำหรับผู้เริ่มต้นไปจนถึงผู้เรียนขั้นสูง คุณสามารถเริ่มต้นที่นี่หรือเริ่มจากตัวแรกและเรียนด้วยความเร็วของคุณเอง นี่คือบทเรียนที่ 3 จากทั้งหมด 4 บทเรียน
บทเรียน “สมาชิก rest ของทูเพิล” ใช้เวลานานแค่ไหน
บทเรียน CoddyKit ส่วนใหญ่ใช้เวลาประมาณ 5–10 นาที แต่ละบทเรียนจึงสั้นและเป็นแบบโต้ตอบ คุณสามารถก้าวหน้าอย่างต่อเนื่องและกลับมาเรียนต่อจากตรงที่เพิ่งหยุดบนเว็บและแอปได้เลย
ฉันเขียนและรันโค้ดในบทเรียน TypeScript Academy นี้ได้ไหม
ได้ บทเรียน TypeScript Academy ทุกบทมีตัวแก้ไขโค้ดในตัว คุณจึงเขียนและรันโค้ดจริงได้เลยในเบราว์เซอร์ และได้รับข้อเสนอแนะจาก AI ในทันที — ไม่ต้องติดตั้งในเครื่องของคุณ
บทเรียนทั้งหมดในหลักสูตรนี้
- พารามิเตอร์ rest ในฟังก์ชัน
- การกระจายค่าในอาร์เรย์และออบเจ็กต์
- สมาชิก rest ของทูเพิล
- การกำหนดชนิดข้อมูลให้ฟังก์ชันหลายอาร์กิวเมนต์