- การใช้เมธอด Object.assign() เพื่อผนวกค่ากับ Object ใน JavaScript
- การใช้เมธอด push() เพื่อผนวกค่ากับอ็อบเจ็กต์ใน JavaScript
- การใช้ตัวดำเนินการการแพร่กระจาย (…) เพื่อผนวกค่ากับวัตถุใน JavaScript
วิธีที่ 1: การใช้เมธอด Object.assign() เพื่อผนวกค่ากับอ็อบเจ็กต์ใน JavaScript
ดิ Object.assign() เมธอดเป็นวิธีหนึ่งที่มีชื่อเสียงในการผนวกค่ากับอ็อบเจกต์ ต้องใช้สองอาร์กิวเมนต์ อันแรกแสดงถึงออบเจกต์เป้าหมาย และอาร์กิวเมนต์ที่สองใช้คู่คีย์/ค่า ไวยากรณ์ของ Object.assign() วิธีการมีให้ด้านล่าง:
ไวยากรณ์
วัตถุ . กำหนด ( เป้าหมาย แหล่งที่มา ) ;
พารามิเตอร์อธิบายไว้ที่นี่:
- เป้า : ระบุอ็อบเจ็กต์ที่จะต่อท้ายค่า
- แหล่งที่มา : หมายถึงค่าที่ถูกต่อท้าย
มาทำความเข้าใจการทำงานของวิธีนี้โดยใช้โค้ดตัวอย่างต่อไปนี้
รหัส
คอนโซล บันทึก ( 'ตัวอย่างการใช้เมธอด assign()' ) ;
ให้ user_obj = {
1 : { ชื่อ : “อดัม” } ,
สอง : { ชื่อ : “แฮร์รี่” } ,
} ;
ให้obj = วัตถุ . กำหนด ( ผู้ใช้_obj, { 3 : { ชื่อ : 'จาซัม' } } ) ;
คอนโซล บันทึก ( วัตถุ ) ;
ในรหัสนี้:
- ประการแรก “อดัม” และ “แฮร์รี่” ถูกกำหนดให้เป็นค่าของ 'ชื่อ' คุณสมบัติ.
- ดิ Object.assign() ใช้วิธีการต่อท้าย a 'จาซัม' คุณค่าของ “user_obj” วัตถุ.
- ในที่สุด console.log() เมธอดถูกใช้เพื่อแสดงค่าทั้งหมดในหน้าต่างคอนโซล
เอาท์พุต
สังเกตได้จากผลลัพธ์ที่เพิ่มค่าใหม่ให้กับวัตถุสำเร็จแล้ว
วิธีที่ 2: การใช้วิธีการ push() เพื่อผนวกค่ากับ Array Object ใน JavaScript
ดิ ดัน() สามารถใช้วิธีการเพิ่มหรือแทรกค่าหนึ่งหรือหลายค่าลงในอาร์เรย์ เมธอดนี้ส่งคืนอาร์เรย์ใหม่หลังจากต่อท้ายค่า ให้เราดูว่าทำงานผ่านไวยากรณ์ต่อไปนี้หรือไม่:
ไวยากรณ์
ร. ดัน ( value1,value2, ...,valueN )ในไวยากรณ์นี้ “ค่า1”, “ค่า2” และ 'ค่าN' เป็นค่าที่จะต่อท้าย “ arr ' ตัวแปร.
รหัส
คอนโซล บันทึก ( 'ตัวอย่างการใช้เมธอด assign()' ) ;const กีฬา = [ 'คริกเก็ต' , 'ฮอกกี้' , 'ฟุตบอล' ] ;
const เคาน์เตอร์ = กีฬา ดัน ( 'บาสเกตบอล' ) ;
คอนโซล บันทึก ( เคาน์เตอร์ ) ;
คอนโซล บันทึก ( กีฬา ) ;
คำอธิบายของรหัสมีให้ที่นี่:
- อาร์เรย์ชื่อ “กีฬา” ถูกสร้างขึ้นซึ่งประกอบด้วยองค์ประกอบสามประการคือ 'คริกเก็ต', 'ฮ็อกกี้' และ 'ฟุตบอล' .
- หลังจากนั้นค่า 'บาสเกตบอล' ถูกผนวกเข้ากับการใช้ sports.push() วิธีการในจาวาสคริปต์
- ในที่สุด console.log() วิธีการแสดงอาร์เรย์ในหน้าต่างคอนโซล .
เอาท์พุต
ผลลัพธ์แสดงให้เห็นว่า 'บาสเกตบอล' ค่าจะถูกผนวกเข้ากับ กีฬา วัตถุโดยใช้ ดัน() กระบวนการ.
วิธีที่ 3: การใช้ตัวดำเนินการ Spread (…) เพื่อผนวกค่ากับวัตถุใน JavaScript
ตัวดำเนินการสเปรด (…) ถูกใช้เพื่อต่อท้ายค่ากับอ็อบเจกต์ใน JavaScript มีประโยชน์ในการรวมวัตถุไว้ในที่เดียว ไวยากรณ์ของตัวดำเนินการสเปรดแสดงไว้ด้านล่าง:
ไวยากรณ์
{ ... วัตถุ , กุญแจ : 'ค่า' }ในไวยากรณ์นี้ 'ค่า' ถูกกำหนดให้เป็น กุญแจ ในวัตถุ วัตถุ .
โค้ดตัวอย่างของตัวดำเนินการสเปรดเพื่อผนวกค่ากับอ็อบเจ็กต์มีดังต่อไปนี้:
รหัส
คอนโซล บันทึก ( 'ตัวอย่างการใช้สเปรดโอเปอเรเตอร์' ) ;ให้ obj1 = { ชื่อ : 'แฮร์รี่' } ;
obj2 = { ... obj1 , สี : 'สีขาว' } ;
คอนโซล บันทึก ( obj2 ) ;
ในรหัสนี้:
- หนึ่ง 'obj1 ” ใช้เพื่อเก็บองค์ประกอบ ชื่อ โดยกำหนดมูลค่า “แฮร์รี่” .
- หลังจากนั้น 'สีขาว' ค่าต่อท้าย 'obj1' .
- ในที่สุด console.log() วิธีแสดงค่าที่ต่อท้ายในหน้าต่างคอนโซล
เอาท์พุต
ผลลัพธ์แสดงวัตถุใหม่ “ obj2 ” ซึ่งมีค่าจากวัตถุ “ obj1 ” เช่นเดียวกับค่าต่อท้าย “ สีขาว ”
บทสรุป
JavaScript ให้สองวิธีคือ Object.assign() และ ดัน() เพื่อผนวกค่ากับวัตถุ
ดิ Object.assign() เมธอดผนวกค่ากับอ็อบเจ็กต์โดยคู่คีย์/ค่า ดิ ดัน() วิธีการเพิ่มค่าหนึ่งหรือหลายค่าลงในอาร์เรย์ อย่างไรก็ตาม แพร่กระจาย (…) ตัวดำเนินการยังสามารถใช้เพื่อผนวกค่ากับวัตถุ โพสต์นี้แสดงให้เห็นถึงความเป็นไปได้ทั้งหมดในการผนวกค่าเข้ากับวัตถุใน JavaScript