Đây là đối tượng của tôi theo nghĩa đen:

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

Làm thế nào tôi có thể thêm trường key3với value3đối tượng?

Có hai cách để thêm thuộc tính mới vào một đối tượng:

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

Sử dụng ký hiệu chấm:

obj.key3 = "value3";

Sử dụng ký hiệu ngoặc vuông:

obj["key3"] = "value3";

Các hình thức đầu tiên được sử dụng khi bạn biết tên của tài sản. Hình thức thứ hai được sử dụng khi tên của tài sản được xác định động. Giống như trong ví dụ này:

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

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

Một mảng JavaScript thực sự có thể được xây dựng bằng cách sử dụng:

Ký hiệu mảng:

var arr = [];

Ký hiệu xây dựng mảng:

var arr = new Array();

Câu trả lời năm 2017: Object.assign()

Object.assign (Dest, src1, src2, ...) hợp nhất các đối tượng.

Nó ghi đè lên destcác thuộc tính và giá trị của (tuy nhiên nhiều) đối tượng nguồn, sau đó trả về dest.

Các Object.assign()phương pháp được sử dụng để sao chép các giá trị của tất cả các thuộc tính riêng đếm được từ một hoặc nhiều đối tượng nguồn cho một đối tượng mục tiêu. Nó sẽ trả về đối tượng đích.

Ví dụ sống

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

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

Câu trả lời năm 2018: toán tử trải rộng đối tượng {...}

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

Từ MDN :

Nó sao chép các thuộc tính vô số của riêng mình từ một đối tượng được cung cấp lên một đối tượng mới.

Hiện tại có thể nhân bản nông (không bao gồm nguyên mẫu) hoặc hợp nhất các đối tượng bằng cách sử dụng cú pháp ngắn hơn Object.assign().

Lưu ý rằng Object.assign()kích hoạt setters trong khi cú pháp lây lan không.

Ví dụ sống

Nó hoạt động trong Chrome hiện tại và Firefox hiện tại. Họ nói rằng nó không hoạt động trong Edge hiện tại.

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

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

Năm 2019 trả lời

Toán tử gán đối tượng += :

obj += {key3: "value3"};

Rất tiếc ... tôi đã mang đi. Thông tin buôn lậu từ tương lai là bất hợp pháp. Bị che khuất!

Tôi đã yêu thích LoDash / Underscore khi viết các dự án lớn hơn.

Thêm bởi obj['key']hoặc obj.keylà tất cả các câu trả lời JavaScript thuần túy. Tuy nhiên, cả hai thư viện LoDash và Underscore đều cung cấp nhiều chức năng tiện lợi bổ sung khi làm việc với các Đối tượng và Mảng nói chung.

.push()là cho Mảng , không phải cho các đối tượng .

Tùy thuộc vào những gì bạn đang tìm kiếm, có hai chức năng cụ thể có thể tốt để sử dụng và cung cấp chức năng tương tự như cảm giác arr.push(). Để biết thêm thông tin kiểm tra các tài liệu, họ có một số ví dụ tuyệt vời ở đó.

_.merge (chỉ dành cho nhà nghỉ)

Đối tượng thứ hai sẽ ghi đè hoặc thêm vào đối tượng cơ sở. undefinedcác giá trị không được sao chép.

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

Đối tượng thứ hai sẽ ghi đè hoặc thêm vào đối tượng cơ sở. undefinedsẽ được sao chép.

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}

_đặc biệt

Đối tượng thứ hai chứa các mặc định sẽ được thêm vào đối tượng cơ sở nếu chúng không tồn tại. undefinedcác giá trị sẽ được sao chép nếu khóa đã tồn tại.

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

Ngoài ra, có thể đáng để đề cập đến jQuery.extend, nó có chức năng tương tự như _.merge và có thể là một lựa chọn tốt hơn nếu bạn đang sử dụng jQuery.

Đối tượng thứ hai sẽ ghi đè hoặc thêm vào đối tượng cơ sở. undefinedcác giá trị không được sao chép.

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 ()

Có thể đáng nói đến ES. / ES2015 Object.assign, nó có chức năng tương tự như _.merge và có thể là tùy chọn tốt nhất nếu bạn đang sử dụng một polyfill ES6 / ES2015 như Babel nếu bạn muốn tự polyfill .

Đối tượng thứ hai sẽ ghi đè hoặc thêm vào đối tượng cơ sở. undefinedsẽ được sao chép.

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}

Bạn có thể sử dụng một trong hai thứ này (cung cấp key3 là khóa chính mà bạn muốn sử dụng)

arr[ 'key3' ] = value3;

hoặc là

arr.key3 = value3;

Nếu key3 là một biến, thì bạn nên làm:

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

Sau này, yêu cầu arr.a_keysẽ trả về giá trị của value3, theo nghĩa đen 3.

arr.key3 = value3;

bởi vì mảng của bạn không thực sự là một mảng ... Đó là một đối tượng nguyên mẫu. Mảng thực sự sẽ là:

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

nhưng nó vẫn không đúng Nó thực sự nên là:

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});

Chỉ cần thêm thuộc tính:

Và chúng tôi muốn thêm prop2 : 2vào đối tượng này, đây là những tùy chọn thuận tiện nhất:

1. Toán tử chấm: object.prop2 = 2;
2. dấu ngoặc vuông: object['prop2'] = 2;

Vì vậy, cái nào chúng ta sử dụng sau đó?

Toán tử dấu chấm là cú pháp rõ ràng hơn và nên được sử dụng làm mặc định (imo). Tuy nhiên, toán tử dấu chấm không có khả năng thêm các khóa động vào một đối tượng, điều này có thể rất hữu ích trong một số trường hợp. Đây là một ví dụ:

const obj = {
  prop1: 1
}

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

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

console.log(obj);

Sáp nhập đối tượng:

Khi chúng ta muốn hợp nhất các thuộc tính của 2 đối tượng, đây là các tùy chọn thuận tiện nhất:

1. Object.assign(), lấy một đối tượng đích làm đối số và một hoặc nhiều đối tượng nguồn và sẽ hợp nhất chúng lại với nhau. Ví dụ:

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

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

console.log(object2);

2. Toán tử trải rộng đối tượng ...

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

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

console.log(newObj);

Chúng ta sử dụng cái nào?

• Cú pháp lây lan ít dài dòng hơn và nên được sử dụng làm imo mặc định. Đừng quên dịch cú pháp này thành cú pháp được tất cả các trình duyệt hỗ trợ vì nó tương đối mới.
• Object.assign() năng động hơn vì chúng ta có quyền truy cập vào tất cả các đối tượng được truyền vào dưới dạng đối số và có thể thao tác với chúng trước khi chúng được gán cho Đối tượng mới.

Tôi biết đã có một câu trả lời được chấp nhận cho điều này nhưng tôi nghĩ tôi sẽ ghi lại ý tưởng của mình ở đâu đó. Xin vui lòng [mọi người] thoải mái chọc lỗ trong ý tưởng này, vì tôi không chắc liệu đó có phải là giải pháp tốt nhất không ... nhưng tôi chỉ kết hợp nó vài phút trước:

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

Bạn sẽ sử dụng nó theo cách này:

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

Vì, hàm nguyên mẫu đang quay trở lại, thisbạn có thể tiếp tục xâu chuỗi .pushđến cuối objbiến của mình :obj.push(...).push(...).push(...);

Một tính năng khác là bạn có thể truyền một mảng hoặc một đối tượng khác làm giá trị trong các đối số của hàm đẩy. Xem fiddle của tôi cho một ví dụ làm việc: http://jsfiddle.net/7tEme/

Hiệu suất

Hôm nay 2020.01,14 Tôi thực hiện các thử nghiệm trên MacOs HighSierra 10.13.6 trên Chrome v78.0.0, Safari v13.0.4 và Firefox v71.0.0, cho các giải pháp được chọn. Tôi chia các giải pháp cho mutable (chữ cái đầu tiên M) và bất biến (chữ cái đầu tiên I). Tôi cũng cung cấp một số giải pháp bất biến (IB, IC, ID / IE) chưa được công bố trong câu trả lời cho câu hỏi này

Kết luận

• giải pháp đột biến nhanh nhất nhanh hơn nhiều so với bất biến nhanh nhất (> 10 x)
• phương pháp đột biến cổ điển như obj.key3 = "abc"(MA, MB) là nhanh nhất
• đối với các giải pháp bất biến, {...obj, key3:'abc'}và Object.assign(IA, IB) là nhanh nhất
• đáng ngạc nhiên là có các giải pháp bất biến nhanh hơn một số giải pháp đột biến cho chrome (MC-IA) và safari (MD-IB)

Chi tiết

Trong đoạn trích dưới đây có giải pháp đã được thử nghiệm, bạn có thể kiểm tra trước trên máy của mình TẠI ĐÂY

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!

Bạn có thể tạo một lớp với câu trả lời của @ Ionuț G. Stan

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

Tạo một đối tượng mới với lớp cuối cùng:

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

In ấn đối tượng

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

In chìa khóa

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

Tôi là người mới trong javascript, ý kiến ​​được chào đón. Làm việc cho tôi.

Hai cách được sử dụng nhiều nhất đã được đề cập trong hầu hết các câu trả lời

obj.key3 = "value3";

obj["key3"] = "value3";

Một cách nữa để xác định thuộc tính là sử dụng 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
});

Phương pháp này hữu ích khi bạn muốn có nhiều quyền kiểm soát hơn trong khi xác định thuộc tính. Thuộc tính được xác định có thể được đặt thành vô số, cấu hình và ghi được bởi người dùng.

Ví dụ của bạn hiển thị một Object, không phải là Array. Trong trường hợp đó, cách ưa thích để thêm một trường vào Object là chỉ gán cho nó, như vậy:

arr.key3 = value3;

được hỗ trợ bởi hầu hết các trình duyệt và nó kiểm tra xem khóa đối tượng có sẵn hay không bạn muốn thêm, nếu có, nó sẽ vượt qua giá trị khóa hiện có và không có sẵn nó thêm khóa có giá trị

ví dụ 1

let my_object = {};

// now i want to add something in it  

my_object.red = "this is red color";

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

ví dụ 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"} }

ví dụ 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" 
//            }   
//       }

Trong trường hợp bạn có nhiều đối tượng ẩn danh trong một đối tượng và muốn thêm một đối tượng khác chứa các cặp khóa / giá trị, hãy làm điều này:

Firebird 'the Object:

console.log(Comicbook);

trả về:

[Object {name = "Người nhện", value = "11"}, Object {name = "Marsipulami", value = "18"}, Object {name = "Garfield", value = "2"}]

Mã số:

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

sẽ thêm Object {name="Peanuts", value="12"}vào Đối tượng truyện tranh

Hoặc obj['key3'] = value3hoặc obj.key3 = value3sẽ thêm cặp mới vào obj.

Tuy nhiên, tôi biết jQuery không được đề cập, nhưng nếu bạn đang sử dụng nó, bạn có thể thêm đối tượng thông qua $.extend(obj,{key3: 'value3'}). Ví dụ:

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. mở rộng (đích [, object1] [, objectN]) hợp nhất nội dung của hai hoặc nhiều đối tượng lại với nhau thành đối tượng đầu tiên.

Và nó cũng cho phép thêm / sửa đổi đệ quy với $.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>

Một cách ngắn gọn và thanh lịch trong đặc tả Javascript tiếp theo (giai đoạn ứng cử viên 3) là:

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

Một cuộc thảo luận sâu hơn có thể được tìm thấy trong Object lây lan so với Object.assign và trên trang web của Tiến sĩ Axel Rauschmayers .

Nó hoạt động đã có trong node.js kể từ khi phát hành 8.6.0.

Các bản phát hành cập nhật của Vivaldi, Chrome, Opera và Firefox cũng biết tính năng này, nhưng Mirosoft không tồn tại cho đến ngày hôm nay, trong Internet Explorer cũng như 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);
    });

Đầu ra như thế này: -

[ { 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 } ]

Bạn có thể thêm nó theo cách này:

arr['key3'] = value3;

hoặc theo cách này:

arr.key3 = value3;

Các câu trả lời gợi ý khóa vào đối tượng với biến key3sẽ chỉ hoạt động nếu giá trị key3là 'key3'.

Theo Trình truy cập thuộc tính được xác định trong ECMA-262 ( http: //www.ecma-i Intl.org/publications/files/ECMA-ST/Ecma-262.pdf, P67), có hai cách bạn có thể làm để thêm thuộc tính vào một đối tượng tồn tại. Tất cả hai cách này, công cụ Javascript sẽ đối xử với chúng như nhau.

Cách đầu tiên là sử dụng ký hiệu dấu chấm:

obj.key3 = value3;

Nhưng theo cách này, bạn nên sử dụng Mã định danh sau ký hiệu dấu chấm.

Cách thứ hai là sử dụng ký hiệu ngoặc:

obj["key3"] = value3;

và một hình thức khác:

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

Bằng cách này, bạn có thể sử dụng Biểu thức (bao gồm Tên định danh ) trong ký hiệu dấu ngoặc.

Chúng ta có thể làm điều này theo cách này quá.

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

Vì nó là một câu hỏi của quá khứ nhưng vấn đề của hiện tại. Sẽ đề xuất thêm một giải pháp: Chỉ cần chuyển khóa và giá trị cho hàm và bạn sẽ nhận được một đối tượng bản đồ.

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

Để thêm một cặp khóa-giá trị cho một đối tượng, vì vậy, for in hoạt động với phần tử đó trước tiên làm điều này:

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

Cách tốt nhất để đạt được điều tương tự được nêu dưới đây:

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

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

//console.log(obj);

Bạn có thể tạo một đối tượng mới bằng cách sử dụng {[key]: value}cú pháp:

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

Với cú pháp trước đó, giờ đây bạn có thể sử dụng cú pháp trải rộng {...foo, ...bar}để thêm một đối tượng mới mà không làm thay đổi giá trị cũ của bạn:

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