การใช้งาน 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

รีวิว ShopBack ช้อปแล้วได้เงินคืน

สวัสดีครับ บทความนี้ผมจะรีวิว App นึงที่ชื่อว่า ShopBack เป็น App ที่ช้อปแล้วได้เงินคืน!! ก่อนอื่นมาดูกันก่อนว่า ShopBack เป็นใครมาจากไหน และนี้มีการทํางานเป็นอย่างไร?

How to send a file from remote URL in Node.js Express app

ใน nodejs express ถ้าต้องการ Response file จาก url อื่นๆ ตัวอย่างเช่น เรามี url "https://www.mydomain1.com/bg" แต่เราต้องการให้ เมื่อ Client เรียก url ดังกล่าวแล้ว ให้ไปนําข้อมูลจาก url "https://www.mydomain2.com/bg.jpg" ตอบกับไปให้ Client เราสามารทําได้ตามตัวอย่างดังนี้ครับ

nginx block user ที่เข้าเว็บด้วย ip ของ server หรือ domain อื่นๆ

สวัสดีครับ วันนี้ผมเจอกรณีที่คนเข้าเว็บมาด้วย Domain อื่นๆ ที่ไม่ใช่ของเรา แต่เป็นหน้าเว็บเราเฉยเลย ทําให้ Domain อื่นๆของใครก็ไม่รู้ สวมรอยเป็นเว็บเราได้อย่างเช่นกรณีนี้


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

Build with ❤️ and Astro.

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