ข้อผิดพลาดในการเข้าถึงองค์ประกอบของอ็อบเจ็กต์ใน JavaScript

สมมติว่าเรามีอ็อบเจ็กต์หนึ่ง:

let obj = {
	a: 1,
	b: 2,
	c: 3,
	d: 4,
	e: 5,
};

สมมติว่าเราต้องการดึงองค์ประกอบจากอ็อบเจ็กต์นี้โดยใช้คีย์บางอย่าง ชื่อของคีย์นี้ผู้ใช้ป้อนเข้ามาผ่าน input:

console.log(input.value);

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

for (let key in obj) {
	if (key === input.value) {
		let elem = obj[key];
		console.log(elem); // ค่าที่ต้องการหา
		break;
	}
}

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

let elem = obj[input.value];

หากจำเป็น สามารถเพิ่มการตรวจสอบว่ามีคีย์ดังกล่าวในอ็อบเจ็กต์หรือไม่:

if (obj[input.value] !== undefined) {
	let elem = obj[input.value];
	console.log(elem);
} else {
	console.log('ไม่มีคีย์ดังกล่าวในอ็อบเจ็กต์');
}