Cover image

การใช้งาน keyof type operator ใน TypeScript

14 Aug 2023

Share to:

สวัสดีครับ ในบทความนี้เราจะมาทําความรู้จักกับ keyof type operator ใน TypeScript กันครับ

keyof type operator คือการดึงเอา key ของ Object ออกมาเป็น literal type

เพื่อความเข้าใจมากขึ้นเรามาดูตัวอย่างกันครับ

type MyType = { a: boolean; b: string; 100: string };
type M = keyof MyType;

const v1: M = 'a'; // No Error
const v2: M = 'b'; // No Error
const v3: M = 100; // No Error
const v4: M = 1; // Error
const v5: M = 'aaa'; // Error
const v6: M = true; // Error

จากตัวอย่างด้านบน เราสร้าง type M จาก keyof MyType ดังนั้น Type M จะเป็น literal type ของ key ที่ อยู่ใน MyType ทําให้เมื่อเรานํา M ไปกำหนดให้กับตัวแปรใด ตัวแปรนั้นๆจะเก็บค่าเฉพาะ literal type ของ key ที่ อยู่ใน MyType เท่านั้น

เพื่อให้เห็นภาพมากขึ้นเรามาดูตัวอย่างการนำไปใช้งานดังนี้ครับ

function getProperty<T>(obj: T, key: keyof T) {
  return obj[key];
}

let x = { a: 1, b: 2, c: 3, d: 4 };

getProperty(x, 'a');
getProperty(x, 'm'); // Error เพราะ property "m" ไม่มีใน x

Copyright © 2019 - 2024 thiti.dev |  v1.33.0 |  Privacy policy | 

Build with ❤️ and Astro.

Github profile   Linkedin profile   Instagram   X profile   Youtube channel   Telegram   Email contact   วงแหวนเว็บ