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

14 Aug 2023,
Share: 
Cover image

สวัสดีครับ ในบทความนี้เราจะมาทําความรู้จักกับ 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

Suggestion blogs

การใช้งานคำสั่ง git init

สวัสดีครับ บทความนี้เราจะมาเรียนรู้การใช้งานคําสั่ง "git int" กันครับ

เหรียญ 1 บาท เนื่องในวันอาหารโลก

เหรียญ 1 บาท เนื่องในวันอาหารโลก พ.ศ.2525 องค์การอาหารและเกษตรแห่งสหประชาชาติขอความร่วมมือให้กรมธนารักษ์จัดทำเหรียญกษาปณ์ที่ระลึกเนื่องในวันอาหารโลก องค์การอาหารและเกษตรแห่งสหประชาชาติเป็นองค์การระหว่างประเทศที่ดำเนินการเกี่ยวกับการเพิ่มผลผลิตในการเกษตรให้มากยิ่งขึ้น เพื่อมิให้ประชากรของโลกขาดแคลนอาหาร และเนื่องด้วยวันที่ 16 ตุลาคม พ.ศ. 2524 เป็นวันฉลองการก่อตั้งองค์การอาหารและการเกษตรแห่งสหประชาชาติ ครบปีที่ 36 องค์การ ฯ จึงถือเอาวันที่

Line notify พื้นฐาน

สวัสดีครับ เรามาทําความรู้จักกับ Line notify และมาลองใช้งานเบื้องต้น เพื่อให้เข้าใจและสามารถนําไปต่อยอดได้ สําหรับ Line notify เป็นบริการหนึ่งของ Line ซึ่ง Line notify มีรูปแบบการให้บริการคือ ทําให้เราสามารถส่งข้อความแจ้งเตือนจาก service หรืออุปกรณ์ใดๆก็ได้ ที่สามารถเชื่อมต่อ internet ได้ และสามารถเชื่อสารด้วย http post มายัง Account ของเราได้


Copyright © 2019 - 2025 thiti.dev |  v1.53.0 |  Privacy policy | 

Build with ❤️ and Astro.

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