บทช่วยสอนนี้จะสาธิตวิธีการเปลี่ยนค่าของวัตถุภายในอาร์เรย์ใน JavaScript
จะเปลี่ยน / อัปเดตค่าของวัตถุที่อยู่ภายในอาร์เรย์โดยใช้ JavaScript ได้อย่างไร
สำหรับการเปลี่ยนค่าของวัตถุที่อยู่ภายในอาร์เรย์ ให้ใช้วิธีการที่กำหนดไว้ล่วงหน้าของ JavaScript ดังต่อไปนี้:
วิธีที่ 1: เปลี่ยนค่าของวัตถุที่อยู่ภายในอาร์เรย์โดยใช้วิธี “findIndex()”
หากต้องการเปลี่ยนค่าของวัตถุภายในอาร์เรย์ ให้ใช้ปุ่ม “ ค้นหาดัชนี () ' วิธี. วิธีนี้จะค้นหาดัชนีขององค์ประกอบในอาร์เรย์ที่ตรงตามเงื่อนไขที่กำหนด สำหรับการระบุเงื่อนไขจะใช้ฟังก์ชันการเรียกกลับ
ไวยากรณ์
ทำตามไวยากรณ์ที่กำหนดเพื่อเปลี่ยนค่าของวัตถุโดยใช้เมธอด findIndex():
อาร์เรย์วัตถุ ค้นหาดัชนี ( คัดค้าน => {
//เงื่อนไข
} ) ;
ตัวอย่าง
สร้างอาร์เรย์ที่มีวัตถุต่างๆ:
เคยเป็น arrObj = [ { รหัส : 5 , ชื่อ : 'เมเยอร์' , อายุ : 25 } ,
{ รหัส : 9 , ชื่อ : 'พอล' , อายุ : 26 } ,
{ รหัส : 12 , ชื่อ : 'สตีเว่น' , อายุ : ยี่สิบ } ]
เรียกใช้เมธอด findIndex() ด้วยฟังก์ชันการโทรกลับที่ตรวจสอบ id ของวัตถุที่เทียบเท่ากับ “ 12 ” และเก็บดัชนีของวัตถุไว้ในตัวแปร “ รับดัชนี ”:
คอสต์ รับดัชนี = arrObj. ค้นหาดัชนี ( คัดค้าน => {กลับ คัดค้าน รหัส === 12 ;
} ) ;
เปลี่ยนมูลค่าทรัพย์สิน “ อายุ ” ของวัตถุ:
arrObj [ รับดัชนี ] . อายุ = 24 ;
สุดท้าย พิมพ์อาร์เรย์ของวัตถุที่อัปเดตบนคอนโซล:
คอนโซล บันทึก ( 'อาร์เรย์ของวัตถุที่อัปเดตคือ:' ) ;คอนโซล บันทึก ( arrObj ) ;
เอาต์พุตระบุว่าค่าของ “ อายุ ” ของวัตถุที่มี id คือ 12 ถูกเปลี่ยนจาก “ ยี่สิบ ' ถึง ' 24 ”:
วิธีที่ 2: เปลี่ยนค่าของวัตถุที่อยู่ภายในอาร์เรย์โดยใช้วิธี “map()” ด้วยสเปรดโอเปอเรเตอร์
ใช้ “ แผนที่() ” วิธีการด้วย “ ตัวดำเนินการกระจาย ” สำหรับเปลี่ยนค่าของวัตถุภายในอาร์เรย์ “map()” ใช้สำหรับสร้างอาร์เรย์ใหม่โดยการเรียกใช้ฟังก์ชันในแต่ละองค์ประกอบของอาร์เรย์ที่มีอยู่ ในขณะที่ตัวดำเนินการสเปรดอนุญาตให้กระจายหรือคัดลอกองค์ประกอบอาร์เรย์ไปยังอาร์เรย์ใหม่หรืออาร์กิวเมนต์ของการเรียกใช้ฟังก์ชัน เมธอด “map()” ไม่ได้แก้ไข/เปลี่ยนแปลงอาร์เรย์เดิม แต่จะแสดงผลอาร์เรย์ใหม่ที่มีองค์ประกอบที่แก้ไข
ไวยากรณ์
สำหรับการเปลี่ยนค่าของวัตถุโดยใช้เมธอด map() กับตัวดำเนินการสเปรด ให้ใช้ไวยากรณ์ต่อไปนี้:
ถ้า ( เงื่อนไข ) {
กลับ { ... คัดค้าน , สำคัญ : ใหม่มูลค่า } ;
}
กลับ คัดค้าน ;
} ) ;
ตัวอย่าง
เรียกใช้เมธอด map() ด้วยตัวดำเนินการสเปรดเพื่อเปลี่ยนชื่อของวัตถุที่มีรหัสเป็น ' 9 ”:
ถ้า ( คัดค้าน รหัส === 9 ) {
กลับ { ... คัดค้าน , ชื่อ : 'อลิซ' } ;
}
กลับ คัดค้าน ;
} ) ;
พิมพ์อาร์เรย์ที่แก้ไขของวัตถุบนคอนโซล:
คอนโซล บันทึก ( ใหม่ObjectArr ) ;สถานที่ให้บริการ “ ชื่อ ” ของวัตถุที่มีรหัสเป็น “ 9 ” ได้เปลี่ยนจาก “ พอล ' ถึง ' อลิซ ”:
วิธีที่ 3: เปลี่ยนค่าของวัตถุที่อยู่ภายในอาร์เรย์โดยใช้วิธี “find()”
สำหรับการเปลี่ยนค่าของวัตถุภายในอาร์เรย์ ให้ใช้ปุ่ม “ หา() ' วิธี. ใช้เพื่อค้นหาองค์ประกอบในอาร์เรย์ที่ตรงตามเงื่อนไขที่กำหนด มันจะส่งออกค่าขององค์ประกอบหากเป็นไปตามเงื่อนไข มิฉะนั้นจะให้ “ ไม่ได้กำหนด ” แสดงว่าไม่พบองค์ประกอบดังกล่าว
ไวยากรณ์
ใช้ไวยากรณ์ที่กำหนดสำหรับเมธอด find() เพื่อค้นหาองค์ประกอบในอาร์เรย์:
//เงื่อนไข
} ) ;
ตัวอย่าง
เรียกใช้เมธอด find() เพื่อค้นหาวัตถุที่มี id คือ “ 5 ” และเก็บวัตถุไว้ในตัวแปร “ ค้นหาดัชนี ”:
กลับ คัดค้าน รหัส === 5 ;
} ) ;
ตรวจสอบว่าตัวแปร “findIndex” ไม่เท่ากับ “ ไม่ได้กำหนด ” หมายถึง ถ้าพบวัตถุ ให้เปลี่ยนค่าของคุณสมบัติ “ ชื่อ ” ของวัตถุ:
ถ้า ( ค้นหาดัชนี !== ไม่ได้กำหนด ) {ค้นหาดัชนี ชื่อ = 'จอห์น' ;
}
สุดท้าย พิมพ์วัตถุบนคอนโซล:
คอนโซล บันทึก ( ค้นหาดัชนี ) ;เอาต์พุตแสดงเฉพาะวัตถุที่ระบุโดยเปลี่ยนค่า:
วิธีที่ 4: เปลี่ยนค่าของวัตถุที่อยู่ภายในอาร์เรย์โดยใช้ลูป 'for-of'
คุณยังสามารถใช้ปุ่ม “ สำหรับของ ” ลูปสำหรับเปลี่ยนค่าของวัตถุภายในอาร์เรย์ ใช้เพื่อวนซ้ำอาร์เรย์ของออบเจกต์และตรวจสอบเงื่อนไขเพื่อเปลี่ยนค่าของออบเจกต์ หลังจากเข้าถึงและเปลี่ยนค่าของวัตถุแล้ว ให้ยุติการวนซ้ำโดยใช้ปุ่ม ' หยุดพัก ' คำสำคัญ.
ไวยากรณ์
ปฏิบัติตามไวยากรณ์ที่กำหนดสำหรับลูป 'for-of':
ถ้า ( เงื่อนไข ) {
//คำแถลง
หยุดพัก ;
}
}
ตัวอย่าง
ใช้ for-of loop และตรวจสอบวัตถุที่มี id เป็น “ 5 ” และเปลี่ยน “ อายุ ' ถึง ' 27 ”:
ถ้า ( คัดค้าน รหัส === 5 ) {
คัดค้าน อายุ = 27 ;
หยุดพัก ;
}
}
พิมพ์วัตถุที่อัปเดตภายในอาร์เรย์บนคอนโซล:
คอนโซล บันทึก ( arrObj ) ;เอาต์พุต
เราได้รวบรวมข้อมูลที่จำเป็นทั้งหมดที่เกี่ยวข้องกับค่าที่เปลี่ยนแปลงของวัตถุซึ่งอยู่ภายในอาร์เรย์ใน JavaScript
บทสรุป
หากต้องการเปลี่ยนค่าของวัตถุที่อยู่ภายในอาร์เรย์ ให้ใช้เมธอดที่กำหนดไว้ล่วงหน้าของ JavaScript รวมถึง ' ค้นหาดัชนี () , “ แผนที่() ” วิธีการด้วย “ ตัวดำเนินการกระจาย ”, “ หา() ” วิธีการ หรือ “ สำหรับของ ” วนซ้ำ วิธีการเหล่านี้เปลี่ยนค่าของวัตถุภายในอาร์เรย์ได้สำเร็จ บทช่วยสอนนี้แสดงวิธีการต่างๆ ในการเปลี่ยนค่าของออบเจกต์ที่อยู่ภายในอาร์เรย์ใน JavaScript