Как добавить пару ключ / значение в объект JavaScript?

Question

Как добавить пару ключ / значение в объект JavaScript?

вот мой объект literal:

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

Как я могу добавить {key3: value3} на объект?

1011

javascript object-literal

автор: T.J. Crowder

22 ответов

автор: Ionuț G. Stan · Accepted Answer · 2011-11-08 16:36:31

есть два способа добавить новый свойства объект:

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

A реальные массив JavaScript может быть построен с помощью либо:

буквенное обозначение массива:

var arr = [];

обозначение конструктора массива:

var arr = new Array();

автор: 7vujy0f0hy · Accepted Answer · 2017-12-30 20:31:56

год 2017 ответ: `Object.assign()`

видео

он работает в текущем Chrome и текущем Firefox. Они говорят, что это не работает в current Edge.

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

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

год 2019 ответ

~~оператор назначения объектов +=:~~

obj += {key3: "value3"};

Упс... Я увлекся. Контрабанда информации из будущего незаконна. Правильно затемненный!

автор: Sir.Nathan Stassen · Accepted Answer · 2015-12-28 17:18:57

я полюбил Лодашь / подчеркивание при написании больших проектов.

добавление на obj['key'] или obj.key все твердые чистые ответы JavaScript. Однако библиотеки LoDash и Underscore предоставляют множество дополнительных удобных функций при работе с объектами и массивами в целом.

.push() для массивов, не объекты.

в зависимости от того, что вы в поисках, есть две конкретные функции, которые могут быть приятно использовать и дать функциональность, похожую на ощущение arr.push(). Для получения дополнительной информации проверьте документы,у них есть отличные примеры.

_.слияние (только Лодашь)

второй объект будет перезаписан или добавлен в базовый объект. 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"}

_.расширять._ / назначить

второй объект перезапишет или добавит к базовому объекту. 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}

_.по умолчанию

второй объект содержит значения по умолчанию, которые будут добавлены в базовый объект, если они не существуют. 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"}

$.продлить

кроме того, возможно, стоит упомянуть jQuery.extend, он функционирует аналогично _.слияния и может быть лучшим вариантом, если вы уже используете на 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"}

автор: seth · Accepted Answer · 2012-03-31 00:03:53

вы можете использовать любой из них (при условии, что key3-это ключ acutal, который вы хотите использовать)

arr[ 'key3' ] = value3;

или

arr.key3 = value3;

если key3 является переменной, то вы должны сделать:

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

после этого, с просьбой arr.a_key возвращает значение value3, буквальный 3.

автор: Robert Koritnik · Accepted Answer · 2009-07-22 23:25:33

arr.key3 = value3;

потому что ваш arr на самом деле не массив... Это прототип объекта. Реальный массив будет:

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

но это все еще неправильно. На самом деле это должно быть:

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

автор: Vicky · Accepted Answer · 2017-09-26 08:46:16

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

автор: sadmicrowave · Accepted Answer · 2013-06-26 18:34:00

Я знаю, что уже есть принятый ответ на это, но я думал, что задокументирую свою идею где-нибудь. Пожалуйста, [люди] не стесняйтесь тыкать дыры в эту идею, так как я не уверен, что это лучшее решение... но я только что собрал это вместе несколько минут назад:

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

Другой особенностью является то, что вы можете передать массив или другой объект в качестве значения в аргументах функции push. См. мою скрипку для рабочего примера:http://jsfiddle.net/7tEme/

автор: Eduen Sarceno · Accepted Answer · 2017-05-23 11:47:29

вы можете создать класс с ответом @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, комментарии приветствуются. Работать на меня.

автор: bdukes · Accepted Answer · 2009-07-22 23:25:57

в вашем примере показан объект, а не массив. В этом случае предпочтительный способ добавить поле к объекту-просто назначить ему, например:

arr.key3 = value3;

автор: Sanchay Kumar · Accepted Answer · 2017-01-13 06:14:37

два наиболее часто используемых способа, уже упомянутых в большинстве ответов

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

этот метод полезен, когда вы хотите иметь больше контроля при определении имущества. Определенное свойство может быть установлено как перечисляемое, настраиваемое и записываемое пользователем.

автор: nottinhill · Accepted Answer · 2012-08-01 14:28:41

Если у вас есть несколько анонимных объектных литералов внутри объекта и вы хотите добавить другой объект, содержащий пары ключ / значение, сделайте следующее:

Firebug ' объект:

console.log(Comicbook);

возвращает:

[объект { name= "Человек-Паук", value= "11"}, объект { name= " Марсипулами", 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"} к Объект Комиксов

автор: Armfoot · Accepted Answer · 2015-06-08 17:47:25

или obj['key3'] = value3 или obj.key3 = value3 добавит новую пару в obj.

однако я знаю, что 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.расширения(target [, object1] [, objectN]) объединяет содержимое двух или более объектов в первый объект.

и он также позволяет рекурсивным добавлениям / модификациям с $.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>

автор: wombleton · Accepted Answer · 2009-07-22 23:33:35

вы можете либо добавить его таким образом:

arr['key3'] = value3;

или так:

arr.key3 = value3;

ответы, предлагающие ввод ключа в объект с переменной key3 будет работать только если значение key3 был 'key3'.

автор: Chen Yang · Accepted Answer · 2013-08-02 03:51:40

По данным Доступ К Свойствам определено в 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;

таким образом, вы можете использовать выражение (включая IdentifierName) в квадратные скобки.

автор: xyxyber · Accepted Answer · 2017-12-04 19:00:55

короткий и элегантный способ в следующей спецификации Javascript (Этап 3 кандидата):

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

более глубокое обсуждение можно найти в распространение объекта против объекта.назначить и сайт доктора Акселя Раушмайерса.

он работает уже в узле.js с выпуска 8.6.0.

Vivaldi, Chrome, Opera и Firefox в современных выпусках также знают эту функцию, но Mirosoft не до сегодняшнего дня, ни в Internet Explorer ни в крае.

автор: Sayed Tauseef Haider Naqvi · Accepted Answer · 2017-12-16 16:10:44

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

автор: Miraj Hamid · Accepted Answer · 2017-09-07 03:36:55

мы можем сделать это слишком.

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

автор: PPing · Accepted Answer · 2018-02-16 11:42:06

Так как это вопрос прошлого, но проблема настоящего. Предложите еще одно решение: просто передайте ключ и значения функции, и вы получите объект карты.

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

автор: relipse · Accepted Answer · 2016-12-08 22:24:04

для того чтобы добавить пара ключ-значение для объекта, поэтому на работает с этим элементом сначала сделайте следующее:

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

автор: sgajera · Accepted Answer · 2017-11-21 04:19:41

лучший способ достичь того же изложен ниже:

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

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

//console.log(obj);

автор: Willem van der Veen · Accepted Answer · 2018-08-23 20:01:57

простое добавление свойства:

и мы хотим добавить prop2 : 2 для этого объекта, это наиболее удобные варианты:

точка оператора: object.prop2 = 2;
квадратные скобки: object['prop2'] = 2;

так кто же мы тогда?

оператор точки является более чистым синтаксисом и должен использоваться по умолчанию (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 объектов, это наиболее удобные варианты:

Object.assign(), принимает целевой объект в качестве аргумента и один или несколько исходных объектов и объединит их вместе. Например:

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

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

console.log(object2);

оператор распространения объектов ...

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

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

console.log(newObj);

какой из них мы используем?

синтаксис распространения менее подробен и должен использоваться как imo по умолчанию. Не забудьте перенести этот синтаксис в синтаксис, который поддерживается всеми браузерами, потому что он относительно новый.
Object.assign() является более динамичным, потому что у нас есть доступ ко всем объектам, которые передаются в качестве аргументов и могут манипулировать ими до их назначения к новому объекту.

автор: dfa · Accepted Answer · 2009-07-22 23:23:04

arr.push({key3: value3});

-17

автор: dfa

Как добавить пару ключ / значение в объект JavaScript?

22 ответов

использование точечной нотации:

С помощью квадратных скобок:

буквенное обозначение массива:

обозначение конструктора массива:

год 2017 ответ: Object.assign()

год 2019 ответ

_.слияние (только Лодашь)

_.расширять._ / назначить

_.по умолчанию

$.продлить

простое добавление свойства:

слияние объектов:

год 2017 ответ: `Object.assign()`