🔥 สวัสดีเพื่อน ๆ ทุกคน!! เคยสงสัยกันไหมว่า Object.assign() และ Object.create() นั้นมันแตกต่างกันยังไง ?? และหลาย ๆ คนยังอาาจะสับสนวิธีการใช้งานของทั้ง 2 ตัวนี้อยู่..
.
👉 ไม่ต้องกังวลไป เพราะแอดมาสรุปความแตกต่างของทั้งสอง ให้ทุกคนดูกันชัด ๆ แล้วจ้า จะเป็นยังไงนั้น ไปดูกันโลดดดด !!
.
🟣 Object.assign() - ใช้คัดลอกข้อมูลใน Object ต้นทาง ไปยัง Object ปลายทางได้ตามต้องการ แต่หากมี Key ซ้ำกัน ผลลัพธ์จะแทนที่ด้วย Key ของปลายทางนั้นเอง
.
📑 มาดูตัวอย่างการใช้งานกันเลย
const aespa = {a: "Winter", b: "Karina", c: "NingNing", d: "Giselle"}
const blackpink = {d: "Jisoo", e: "Jennie", f: "Rose", g: "Lisa"}
const NewUser = Object.assign(aespa, blackpink);
console.log(NewUser);
.
📍 ผลลัพธ์
{a: 'Winter', b: 'Karina', c: 'NingNing', d: 'Jisoo', e: 'Jennie', f: 'Rose', g: 'Lisa'}
จะเห็นว่า Object aespa และ Object blackpink มี Key ซ้ำกัน คือ d นั่นเอง ผลลัพธ์ของ NewUser ก็จะแทนที่ด้วย Key ปลายทาง คือ {d: “Jisoo”}
.
🟢 Object.create() - ใช้สร้าง Object ใหม่จากค่าของ Object ต้นแบบ แต่ไม่ได้เป็นการคัดลอกเหมือนกับ Object.assign() เพียงแค่สามารถเรียกใช้ค่าใน Object ต้นแบบได้นั่นเอง
.
📑 ตัวอย่างการใช้งาน
const aespa = {a: "Winter", b: "Karina", c: "NingNing", d: "Giselle"};
var NewMember = Object.create(aespa);
console.log(NewMember.a,NewMember.b);
.
📍 ผลลัพธ์
Winter Karina
หากลอง print ค่าของ NewMember ออกมาบ้าง ซึ่งมันจะได้เป็น Object ค่าว่างออกมา
console.log(NewMember);
// output => {}
.
เป็นยังไงกันบ้าง พอจะเข้าใจวิธีการใช้งานของทั้งสองกันขึ้นมาบ้างแล้วเนอะ หากชอบเนื้อหานี้ฝากกดไลก์ กดแชร์ เพื่อเป็นกำลังใจให้เราด้วยน้าาาา
.
borntoDev - 🦖 สร้างการเรียนรู้ที่ดีสำหรับสายไอทีในทุกวัน
