นี่คือวัตถุของฉัน:

var obj = {key1: value1, key2: value2};

ฉันจะเพิ่มฟิลด์key3ด้วยvalue3ลงในวัตถุได้อย่างไร

มีสองวิธีในการเพิ่มคุณสมบัติใหม่ให้กับวัตถุ:

var obj = {
    key1: value1,
    key2: value2
};

ใช้เครื่องหมายจุด:

obj.key3 = "value3";

ใช้เครื่องหมายวงเล็บเหลี่ยม:

obj["key3"] = "value3";

แบบฟอร์มแรกจะใช้เมื่อคุณทราบชื่อของคุณสมบัติ แบบฟอร์มที่สองจะใช้เมื่อมีการกำหนดชื่อของคุณสมบัติแบบไดนามิก เหมือนในตัวอย่างนี้:

var getProperty = function (propertyName) {
    return obj[propertyName];
};

getProperty("key1");
getProperty("key2");
getProperty("key3");

จริงอาร์เรย์ JavaScript สามารถถูกสร้างขึ้นโดยใช้:

สัญกรณ์ Array:

var arr = [];

สัญกรณ์ของ Array

var arr = new Array();

ปี 2560 ตอบ: Object.assign()

Object.assign (dest, src1, src2, ... )ผสานวัตถุ

มันเขียนทับdestด้วยคุณสมบัติและค่าของวัตถุแหล่งที่มา (แต่จำนวนมาก) แล้วส่งกลับdestแหล่งที่มาของวัตถุผลตอบแทนแล้ว

Object.assign()วิธีการที่ใช้ในการคัดลอกค่าของคุณสมบัติของตัวเองทั้งหมดนับจากวัตถุหนึ่งหรือหลายแหล่งไปยังวัตถุเป้าหมาย มันจะกลับวัตถุเป้าหมาย

ตัวอย่างสด

var obj = {key1: "value1", key2: "value2"};
Object.assign(obj, {key3: "value3"});

document.body.innerHTML = JSON.stringify(obj);

คำตอบปี 2018: ผู้ดำเนินการแพร่กระจายวัตถุ {...}

obj = {...obj, ...pair};

จากMDN :

มันคัดลอกคุณสมบัติที่นับได้ของตัวเองจากวัตถุที่ให้ไปยังวัตถุใหม่

การแยกโคลน (ยกเว้นต้นแบบ) หรือการรวมวัตถุสามารถทำได้โดยใช้ไวยากรณ์ที่สั้นกว่า Object.assign()หรือการควบรวมกิจการของวัตถุคือตอนนี้ไปได้โดยใช้ไวยากรณ์ที่สั้นกว่า

โปรดทราบว่าObject.assign()ทริกเกอร์settersในขณะที่ไวยากรณ์การแพร่กระจายไม่ได้

ตัวอย่างสด

มันทำงานได้ใน Chrome ปัจจุบันและ Firefox ปัจจุบัน พวกเขาบอกว่ามันไม่ทำงานใน Edge ปัจจุบัน

var obj = {key1: "value1", key2: "value2"};
var pair = {key3: "value3"};
obj = {...obj, ...pair};

document.body.innerHTML = JSON.stringify(obj);

ปี 2562 ตอบ

ผู้ประกอบการกำหนดวัตถุ += :

obj += {key3: "value3"};

อ๊ะ ... ฉันถูกพาไป การลักลอบขนข้อมูลจากอนาคตเป็นสิ่งผิดกฎหมาย บดบังรับรองสำเนาถูกต้อง!

ฉันหลงรักLoDash / Underscoreเมื่อเขียนโครงการขนาดใหญ่

การเพิ่มโดยobj['key']หรือobj.keyเป็นคำตอบ JavaScript ที่บริสุทธิ์ทั้งหมด อย่างไรก็ตามทั้ง LoDash และ Underscore library มีฟังก์ชั่นเพิ่มเติมที่สะดวกสบายมากมายเมื่อทำงานกับ Objects and Array โดยทั่วไป

.push()สำหรับอาร์เรย์ไม่ได้สำหรับวัตถุ

มีฟังก์ชั่นเฉพาะสองอย่างที่อาจจะดีในการใช้และให้ฟังก์ชั่นที่คล้ายกับความรู้สึกขึ้นอยู่กับสิ่งที่คุณกำลังมองหา arr.push()ทั้งนี้ขึ้นอยู่กับสิ่งที่คุณกำลังมองหามีสองฟังก์ชั่นที่เฉพาะเจาะจงที่อาจจะมีความสุขที่จะใช้และให้ฟังก์ชันการทำงานคล้ายกับความรู้สึกของสำหรับข้อมูลเพิ่มเติมตรวจสอบเอกสารพวกเขามีตัวอย่างที่ดีที่นั่น

_.merge (Lodash เท่านั้น)

วัตถุที่สองจะเขียนทับหรือเพิ่มลงในวัตถุฐาน undefinedค่าจะไม่ถูกคัดลอก

var obj = {key1: "value1", key2: "value2"};
var obj2 = {key2:"value4", key3: "value3", key4: undefined};
_.merge(obj, obj2);
console.log(obj);
// → {key1: "value1", key2: "value4", key3: "value3"} 

_.extend / _.assign

วัตถุที่สองจะเขียนทับหรือเพิ่มลงในวัตถุฐาน undefinedจะถูกคัดลอก

var obj = {key1: "value1", key2: "value2"};
var obj2 = {key2:"value4", key3: "value3", key4: undefined};
_.extend(obj, obj2);
console.log(obj);
// → {key1: "value1", key2: "value4", key3: "value3", key4: undefined}

_.defaults

วัตถุที่สองประกอบด้วยค่าเริ่มต้นที่จะถูกเพิ่มลงในวัตถุพื้นฐานหากไม่มีอยู่ undefinedค่าจะถูกคัดลอกหากมีกุญแจอยู่แล้ว

var obj = {key3: "value3", key5: "value5"};
var obj2 = {key1: "value1", key2:"value2", key3: "valueDefault", key4: "valueDefault", key5: undefined};
_.defaults(obj, obj2);
console.log(obj);
// → {key3: "value3", key5: "value5", key1: "value1", key2: "value2", key4: "valueDefault"}

$ .extend

นอกจากนี้มันอาจคุ้มค่าที่จะกล่าวถึง jQuery.extend ซึ่งทำหน้าที่คล้ายกับ _.merge และอาจเป็นตัวเลือกที่ดีกว่าถ้าคุณใช้ jQuery อยู่แล้ว

วัตถุที่สองจะเขียนทับหรือเพิ่มลงในวัตถุฐาน undefinedค่าจะไม่ถูกคัดลอก

var obj = {key1: "value1", key2: "value2"};
var obj2 = {key2:"value4", key3: "value3", key4: undefined};
$.extend(obj, obj2); 
console.log(obj);
// → {key1: "value1", key2: "value4", key3: "value3"}

Object.assign ()

มันอาจจะคุ้มค่าที่จะกล่าวถึง ES6 / ES2015 Object.assign ฟังก์ชั่นคล้ายกับ _.merge และอาจเป็นตัวเลือกที่ดีที่สุดถ้าคุณใช้โพลีฟิล ES6 / ES2015 เช่นBabelหากคุณต้องการโพลีฟิลด้วยตัวเองตัวเอง

วัตถุที่สองจะเขียนทับหรือเพิ่มลงในวัตถุฐาน undefinedจะถูกคัดลอก

var obj = {key1: "value1", key2: "value2"};
var obj2 = {key2:"value4", key3: "value3", key4: undefined};
Object.assign(obj, obj2); 
console.log(obj);
// → {key1: "value1", key2: "value4", key3: "value3", key4: undefined}

คุณสามารถใช้อย่างใดอย่างหนึ่งเหล่านี้ (ให้ key3 เป็นคีย์ acutal ที่คุณต้องการใช้)

arr[ 'key3' ] = value3;

หรือ

arr.key3 = value3;

หาก key3 เป็นตัวแปรคุณควรทำสิ่งต่อไปนี้

var key3 = 'a_key';
var value3 = 3;
arr[ key3 ] = value3;

หลังจากนี้ขอarr.a_keyจะกลับค่าของการเป็นตัวอักษรvalue33

arr.key3 = value3;

เพราะ arr ของคุณไม่ใช่อาร์เรย์จริงๆ ... มันเป็นวัตถุต้นแบบ อาร์เรย์ที่แท้จริงจะเป็น:

var arr = [{key1: value1}, {key2: value2}];

แต่มันก็ยังไม่ถูกต้อง มันควรจะเป็นจริง:

var arr = [{key: key1, value: value1}, {key: key2, value: value2}];

var employees = []; 
employees.push({id:100,name:'Yashwant',age:30});
employees.push({id:200,name:'Mahesh',age:35});

เพียงเพิ่มคุณสมบัติ:

และเราต้องการที่จะเพิ่มprop2 : 2ไปยังวัตถุนี้สิ่งเหล่านี้เป็นตัวเลือกที่สะดวกที่สุด:

1. ผู้ประกอบการ Dot: object.prop2 = 2;
2. วงเล็บเหลี่ยม: object['prop2'] = 2;

แล้วเราจะใช้อันไหนดี?

ตัวดำเนินการ dot เป็นไวยากรณ์ที่สะอาดกว่าและควรใช้เป็นค่าเริ่มต้น (imo) อย่างไรก็ตามตัวดำเนินการจุดไม่สามารถเพิ่มคีย์แบบไดนามิกให้กับวัตถุซึ่งอาจมีประโยชน์มากในบางกรณี นี่คือตัวอย่าง:

const obj = {
  prop1: 1
}

const key = Math.random() > 0.5 ? 'key1' : 'key2';

obj[key] = 'this value has a dynamic key';

console.log(obj);

การผสานวัตถุ:

เมื่อเราต้องการรวมคุณสมบัติของวัตถุ 2 ตัวนี่คือตัวเลือกที่สะดวกที่สุด:

1. Object.assign()ใช้วัตถุเป้าหมายเป็นอาร์กิวเมนต์และหนึ่งหรือมากกว่าหนึ่งวัตถุที่มาและจะรวมเข้าด้วยกัน ตัวอย่างเช่น:

const object1 = {
  a: 1,
  b: 2,
};

const object2 = Object.assign({
  c: 3,
  d: 4
}, object1);

console.log(object2);

2. ตัวดำเนินการกระจายวัตถุ ...

const obj = {
  prop1: 1,
  prop2: 2
}

const newObj = {
  ...obj,
  prop3: 3,
  prop4: 4
}

console.log(newObj);

เราจะใช้อันไหน

• ไวยากรณ์การแพร่กระจายมีความละเอียดน้อยกว่าและควรใช้เป็น IMO เริ่มต้น อย่าลืม transpile ไวยากรณ์นี้เป็นไวยากรณ์ที่เบราว์เซอร์ทั้งหมดรองรับเพราะค่อนข้างใหม่
• Object.assign() เป็นแบบไดนามิกมากขึ้นเพราะเราสามารถเข้าถึงวัตถุทั้งหมดที่ถูกส่งผ่านเป็นอาร์กิวเมนต์และสามารถจัดการพวกเขาก่อนที่พวกเขาจะได้รับมอบหมายให้วัตถุใหม่

ฉันรู้ว่ามีคำตอบที่ยอมรับแล้วสำหรับเรื่องนี้ แต่ฉันคิดว่าฉันจะบันทึกความคิดของฉันอยู่ที่ไหนสักแห่ง ได้โปรด [คน] รู้สึกฟรีที่จะกระตุ้นรูในความคิดนี้เพราะฉันไม่แน่ใจว่ามันเป็นทางออกที่ดีที่สุด ... แต่ฉันเพิ่งจะรวมกันไม่กี่นาทีที่ผ่านมา:

Object.prototype.push = function( key, value ){
   this[ key ] = value;
   return this;
}

คุณจะใช้มันในวิธีนี้:

var obj = {key1: value1, key2: value2};
obj.push( "key3", "value3" );

ตั้งแต่ฟังก์ชั่นต้นแบบกลับมาthisคุณสามารถดำเนินการต่อไป.pushยังจุดสิ้นสุดของobjตัวแปรของคุณ:obj.push(...).push(...).push(...);

คุณสมบัติอื่นคือคุณสามารถส่งผ่านอาร์เรย์หรือวัตถุอื่นเป็นค่าในอาร์กิวเมนต์ของฟังก์ชันพุช ดูซอของฉันสำหรับตัวอย่างการทำงาน: http://jsfiddle.net/7tEme/

ประสิทธิภาพ

วันนี้ 2020.01.14 ฉันทำการทดสอบบน MacOs HighSierra 10.13.6 บน Chrome v78.0.0, Safari v13.0.4 และ Firefox v71.0.0 สำหรับโซลูชันที่เลือก ฉันแบ่งวิธีแก้ปัญหาที่ไม่แน่นอน (ตัวอักษรตัวแรก M) และไม่เปลี่ยนรูป (ตัวอักษรตัวที่หนึ่ง I) ฉันยังมีวิธีแก้ปัญหาที่เปลี่ยนแปลงไม่ได้ (IB, IC, ID / IE) ที่ยังไม่ได้เผยแพร่เพื่อตอบคำถามนี้

สรุปผลการวิจัย

• โซลูชันที่ไม่แน่นอนที่เร็วที่สุดนั้นเร็วกว่าการเปลี่ยนไม่ได้เร็วที่สุด (> 10x)
• วิธีที่ไม่แน่นอนแบบคลาสสิกเช่นobj.key3 = "abc"(MA, MB) เร็วที่สุด
• สำหรับโซลูชันที่ไม่เปลี่ยนรูปแบบ{...obj, key3:'abc'}และObject.assign(IA, IB) นั้นเร็วที่สุด
• น่าแปลกใจที่มีวิธีแก้ปัญหาที่ไม่เปลี่ยนรูปได้เร็วกว่าวิธีที่ไม่แน่นอนบางอย่างสำหรับโครเมี่ยม (MC-IA) และซาฟารี (MD-IB)

รายละเอียด

ในตัวอย่างด้านล่างนี้มีวิธีการทดสอบที่ได้รับการยืนยันล่วงหน้าคุณสามารถทดสอบล่วงหน้าจากเครื่องของคุณได้ที่นี่

var o = {
    key1: true,
    key2: 3,
};

var log= (s,f)=> console.log(`${s} --> ${JSON.stringify(f({...o}))}`);



function MA(obj) {
  obj.key3 = "abc";
  return obj;
}

function MB(obj) {
  obj['key3'] = "abc";
  return obj;
}

function MC(obj) {
  Object.assign(obj, {key3:'abc'});
  return obj;
}

function MD(obj) {
  Object.defineProperty(obj, 'key3', {
    value: "abc",       // undefined by default
    enumerable: true,      // false by default
    configurable: true,    // false by default
    writable: true         // false by default
  });
  return obj;
}

function IA(obj) {
  return {...obj, key3:'abc'};
}

function IB(obj) {
  return Object.assign({key3:'abc'}, obj);
}

function IC(obj) {
  let ob= JSON.parse(JSON.stringify(obj))
  ob.key3 = 'abc';
  return ob;
}


function ID(obj) {
	let ob= Object.fromEntries(Object.entries(obj));
  ob.key3 = 'abc';
  return ob;
}

function IE(obj) {
	return Object.fromEntries(Object.entries(obj).concat([['key3','abc']]))
}



log('MA',MA);
log('MB',MB);
log('MC',MC);
log('MD',MD);
log('IA',IA);
log('IB',IB);
log('IC',IC);
log('ID',ID);
log('IE',IE);

This snippet only presents code - it not perform tests itself!

คุณสามารถสร้างชั้นเรียนด้วยคำตอบของ @ Ionuț G. Stan

function obj(){
    obj=new Object();
    this.add=function(key,value){
        obj[""+key+""]=value;
    }
    this.obj=obj
}

การสร้างวัตถุใหม่ด้วยคลาสสุดท้าย:

my_obj=new obj();
my_obj.add('key1', 'value1');
my_obj.add('key2', 'value2');
my_obj.add('key3','value3');

การพิมพ์วัตถุ

console.log(my_obj.obj) // Return {key1: "value1", key2: "value2", key3: "value3"} 

การพิมพ์คีย์

console.log(my_obj.obj["key3"]) //Return value3

ฉันเป็นมือใหม่ใน javascript ความคิดเห็นยินดีต้อนรับ ได้ผลสำหรับฉัน

สองวิธีที่ใช้มากที่สุดที่กล่าวถึงแล้วในคำตอบส่วนใหญ่

obj.key3 = "value3";

obj["key3"] = "value3";

อีกวิธีหนึ่งในการกำหนดคุณสมบัติคือการใช้ Object.defineProperty ()

Object.defineProperty(obj, 'key3', {
  value: "value3",       // undefined by default
  enumerable: true,      // false by default
  configurable: true,    // false by default
  writable: true         // false by default
});

วิธีนี้มีประโยชน์เมื่อคุณต้องการควบคุมได้มากกว่าในขณะที่กำหนดคุณสมบัติ คุณสมบัติที่กำหนดสามารถตั้งค่าให้นับได้กำหนดค่าและเขียนได้โดยผู้ใช้

ตัวอย่างของคุณแสดงวัตถุไม่ใช่อาร์เรย์ ในกรณีนั้นวิธีที่ต้องการเพิ่มเขตข้อมูลไปยังวัตถุคือการกำหนดให้กับมันเช่น:

arr.key3 = value3;

เบราว์เซอร์ส่วนใหญ่ได้รับการสนับสนุนและจะตรวจสอบว่ามีวัตถุคีย์อยู่หรือไม่และคุณต้องการเพิ่มหรือไม่หากมีให้ใช้จะแทนที่ค่าคีย์ที่มีอยู่และไม่สามารถใช้งานได้เพิ่มคีย์ที่มีค่า

ตัวอย่างที่ 1

let my_object = {};

// now i want to add something in it  

my_object.red = "this is red color";

// { red : "this is red color"}

ตัวอย่างที่ 2

let my_object = { inside_object : { car : "maruti" }}

// now i want to add something inside object of my object 

my_object.inside_object.plane = "JetKing";

// { inside_object : { car : "maruti" , plane : "JetKing"} }

ตัวอย่างที่ 3

let my_object = { inside_object : { name : "abhishek" }}

// now i want to add something inside object with new keys birth , gender 

my_object.inside_object.birth = "8 Aug";
my_object.inside_object.gender = "Male";


    // { inside_object : 
//             { name : "abhishek",
//               birth : "8 Aug",
//               gender : "Male" 
//            }   
//       }

ในกรณีที่คุณมีตัวอักษร Object ที่ไม่ระบุชื่อหลายตัวภายในวัตถุและต้องการเพิ่มวัตถุอื่นที่มีคู่คีย์ / ค่าให้ทำดังนี้

Firebug 'วัตถุ:

console.log(Comicbook);

ผลตอบแทน:

[Object {name = "Spiderman", value = "11"}, Object {name = "Marsipulami", value = "18"}, Object {name = "Garfield", value = "2"}]

รหัส:

if (typeof Comicbook[3]=='undefined') {
    private_formArray[3] = new Object();
    private_formArray[3]["name"] = "Peanuts";
    private_formArray[3]["value"] = "12";
}

จะเพิ่มลงObject {name="Peanuts", value="12"}ในวัตถุการ์ตูน

อย่างใดอย่างหนึ่งobj['key3'] = value3หรือจะเพิ่มคู่ใหม่ไปobj.key3 = value3obj

แต่ฉันรู้ว่า jQuery ไม่ได้กล่าวถึง $.extend(obj,{key3: 'value3'})แต่ถ้าคุณใช้มันคุณสามารถเพิ่มวัตถุผ่าน เช่น:

var obj = {key1: 'value1', key2: 'value2'};
$('#ini').append(JSON.stringify(obj));

$.extend(obj,{key3: 'value3'});

$('#ext').append(JSON.stringify(obj));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p id="ini">Initial: </p>
<p id="ext">Extended: </p>

jQuery ขยาย (เป้าหมาย [, วัตถุ 1] [, วัตถุ N])ผสานเนื้อหาของวัตถุสองชิ้นขึ้นไปเข้าด้วยกันเป็นวัตถุแรก

และยังอนุญาตให้เพิ่ม / แก้ไขซ้ำด้วย$.extend(true,object1,object2);:

var object1 = {
  apple: 0,
  banana: { weight: 52, price: 100 },
  cherry: 97
};
var object2 = {
  banana: { price: 200 },
  durian: 100
};
$("#ini").append(JSON.stringify(object1));    

$.extend( true, object1, object2 );
 
$("#ext").append(JSON.stringify(object1));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p id="ini">Initial: </p>
<p id="ext">Extended: </p>

วิธีที่สั้นและสง่างามในสเปค Javascript ถัดไป (ตัวเลือกระยะ 3) คือ:

obj = { ... obj, ... { key3 : value3 } }

การสนทนาเชิงลึกสามารถพบได้ในObject spread vs Object.assignและ onเว็บไซต์ดร. Axel Rauschmayers

มันทำงานได้ใน node.js ตั้งแต่รีลีส 8.6.0

Vivaldi, Chrome, Opera และ Firefox ในรุ่นล่าสุดทราบถึงคุณลักษณะนี้ด้วยเช่นกัน แต่ Mirosoft ไม่ได้ทำมาจนถึงทุกวันนี้ทั้งใน Internet Explorer และ Edge

var arrOfObj = [{name: 'eve'},{name:'john'},{name:'jane'}];
    var injectObj = {isActive:true, timestamp:new Date()};

    // function to inject key values in all object of json array

    function injectKeyValueInArray (array, keyValues){
        return new Promise((resolve, reject) => {
            if (!array.length)
                return resolve(array);

            array.forEach((object) => {
                for (let key in keyValues) {
                    object[key] = keyValues[key]
                }
            });
            resolve(array);
        })
    };

//call function to inject json key value in all array object
    injectKeyValueInArray(arrOfObj,injectObj).then((newArrOfObj)=>{
        console.log(newArrOfObj);
    });

ผลลัพธ์เช่นนี้: -

[ { name: 'eve',
    isActive: true,
    timestamp: 2017-12-16T16:03:53.083Z },
  { name: 'john',
    isActive: true,
    timestamp: 2017-12-16T16:03:53.083Z },
  { name: 'jane',
    isActive: true,
    timestamp: 2017-12-16T16:03:53.083Z } ]

คุณสามารถเพิ่มด้วยวิธีนี้:

arr['key3'] = value3;

หรือด้วยวิธีนี้:

arr.key3 = value3;

คำตอบบอก keying เป็นวัตถุที่มีตัวแปรkey3จะทำงานเฉพาะในกรณีที่ค่าของการเป็นkey3'key3'

ตามAccessors Property ที่กำหนดไว้ใน ECMA-262 ( http://www.ecma-international.org/publications/files/ECMA-ST/Ecma-262.pdf , P67) มีสองวิธีที่คุณสามารถทำได้เพื่อเพิ่มคุณสมบัติให้กับ วัตถุที่มีอยู่ ทั้งหมดเหล่านี้สองทางเครื่องมือ Javascript จะปฏิบัติต่อพวกเขาเหมือนกัน

วิธีแรกคือใช้เครื่องหมายจุด:

obj.key3 = value3;

แต่ด้วยวิธีนี้คุณควรใช้IdentifierNameหลังเครื่องหมายจุด

วิธีที่สองคือการใช้เครื่องหมายวงเล็บ:

obj["key3"] = value3;

และรูปแบบอื่น:

var key3 = "key3";
obj[key3] = value3;

ด้วยวิธีนี้คุณสามารถใช้Expression (รวมIdentifierName ) ในเครื่องหมายวงเล็บ

เราสามารถทำได้ด้วยวิธีนี้เช่นกัน

var myMap = new Map();
myMap.set(0, 'my value1');
myMap.set(1, 'my value2');
 for (var [key, value] of myMap) {
  console.log(key + ' = ' + value);
 }

เนื่องจากเป็นคำถามของอดีต แต่เป็นปัญหาของปัจจุบัน อยากจะแนะนำวิธีแก้ปัญหาเพิ่มเติมอีก: เพียงแค่ส่งคีย์และค่าไปยังฟังก์ชันและคุณจะได้รับวัตถุแผนที่

var map = {};
function addValueToMap(key, value) {
map[key] = map[key] || [];
map[key].push(value);
}

เพื่อที่จะผนวกคู่ของคีย์ - ค่าไว้กับวัตถุดังนั้นในการทำงานกับองค์ประกอบนั้นจะทำสิ่งนี้ก่อน:

    var nwrow = {'newkey': 'value' };
    for(var column in row){
        nwrow[column] = row[column];
    }
    row = nwrow;

วิธีที่ดีที่สุดเพื่อให้บรรลุเดียวกันมีการระบุไว้ด้านล่าง:

function getKey(key) {
  return `${key}`;
}

var obj = {key1: "value1", key2: "value2", [getKey('key3')]: "value3"};

//console.log(obj);

คุณสามารถสร้างวัตถุใหม่โดยใช้{[key]: value}ไวยากรณ์:

const foo = {
  a: 'key',
  b: 'value'
}

const bar = {
  [foo.a]: foo.b
}

console.log(bar); // {key: 'value'}
console.log(bar.key); // value

const baz = {
  ['key2']: 'value2'
}

console.log(baz); // {key2: 'value2'}
console.log(baz.key2); // value2

ด้วยไวยากรณ์ก่อนหน้านี้คุณสามารถใช้ไวยากรณ์การแพร่กระจาย{...foo, ...bar}เพื่อเพิ่มวัตถุใหม่โดยไม่เปลี่ยนค่าเก่าของคุณ:

const foo = {a: 1, b: 2};

const bar = {...foo, ...{['c']: 3}};

console.log(bar); // {a: 1, b: 2, c: 3}
console.log(bar.c); // 3