Добавление элементов в объект


222

Мне нужно заполнить файл JSON, теперь у меня есть что-то вроде этого:

{"element":{"id":10,"quantity":1}}

И мне нужно добавить еще один «элемент». Мой первый шаг - поместить этот json в тип Object с помощью cart = JSON.parse, теперь мне нужно добавить новый элемент. Я предположил, что должен использовать cart.pushдля добавления другого элемента, я попробовал это:

var element = {};
element.push({ id: id, quantity: quantity });
cart.push(element);

Но я получаю ошибку «У объекта нет метода push», когда я пытаюсь это сделать element.push, и я думаю, что я делаю что-то ОЧЕНЬ неправильно, потому что я нигде не говорю «элемент».

Как я могу это сделать?

Изменить: извините за все, у меня было много путаницы в моей голове.

Я думал, что могу получать только тип объекта при получении данных JSON.parse, но я получаю то, что я положил в JSON.

Помещение массива вместо объекта решило мою проблему, я также использовал множество предложений, спасибо всем!



Object.assign (цель, источник); может использоваться для копирования всех свойств из исходного объекта в целевой объект.
Дэвид Спектор

Ответы:


287

Ваш элемент не является массивом, однако ваша корзина должна быть массивом для поддержки многих элементов элемента. Пример кода:

var element = {}, cart = [];
element.id = id;
element.quantity = quantity;
cart.push(element);

Если вы хотите, чтобы cart была массивом объектов в форме, { element: { id: 10, quantity: 1} }выполните:

var element = {}, cart = [];
element.id = id;
element.quantity = quantity;
cart.push({element: element});

JSON.stringify() была упомянута как проблема в комментарии:

>> JSON.stringify([{a: 1}, {a: 2}]) 
      "[{"a":1},{"a":2}]" 

2
спасибо, но моя корзина теперь не массив, и я не могу сделать cart.push :( мне нужен объект для использования JSON.stringify (cart) после этой операции
HypeZ

@HypeZ Вы по-прежнему можете структурировать корзину, если это массив объектов.
Константин Динев

еще раз спасибо! Но мои базовые данные являются причиной типа объекта "cart = JSON.parse (jsonfile)" в начале .. Я не думаю, что я должен взять json как объект, преобразовать его в массив, добавить элемент, stringify ..
HypeZ

по какой-то причине мой объект заполняется только последним элементом. например, у меня есть 4 разных элемента, но в объекте все 4 элемента: = последнее значение, решение, которое я нашел, это создать элемент = {}; внутри за, то его работа исправна
Городецкий Дмитрий

1
@GorodeckijDimitrij Если вы повторно используете один и тот же объект элемента и заново заполняете его ключи новыми значениями, тогда вы будете изменять один и тот же экземпляр элемента, снова и снова помещая его в массив. Просто используйте новый объект для каждого добавляемого элемента, что вы и сделали в цикле for.
Константин Динев

161

С этим рядом

var element = {};

Вы определяете, elementчтобы быть простым объектом. У нативного объекта JavaScript нет push()метода. Чтобы добавить новые элементы в простой объект, используйте этот синтаксис:

element[ yourKey ] = yourValue;

С другой стороны, вы можете определить elementкак массив, используя

var element = [];

Затем вы можете добавить элементы, используя push().


4
element[ yourKey ] = yourValue;это лучший способ добавить элемент к объекту.
Прамеш Баджрачарья

Но вы не можете получить порядок добавления элемента в объект с помощью элемента [yourKey] = yourValue;
RollerCosta

2
@Pramesh Bajracharya Он не добавляет значения к элементу, он просто устанавливает текущий элемент на это значение.
Хасен

1
@ sommesh как вы хотите сохранить дубликаты? Вы могли бы сделатьelement[ yourkey ] = [ element{yourkey], yourNewValue ];
Сирко

1
@sommesh это даст вам дубликат ключа, который по определению невозможен в объекте JS. Вы можете собрать только несколько значений для одного ключа, как я уже показывал ранее.
Сирко

21

Если корзина должна храниться как объект, а не как массив (хотя я бы рекомендовал хранить его как []), вы всегда можете изменить структуру, чтобы использовать идентификатор в качестве ключа:

var element = { quantity: quantity };
cart[id] = element;

Это позволяет добавить несколько товаров в корзину следующим образом:

cart["1"] = { quantity: 5};
cart["2"] = { quantity: 10};

// Cart is now:
// { "1": { quantity: 5 }, "2": { quantity: 10 } }

спасибо, но моя корзина должна быть объектом, а не массивом :(
HypeZ

3
Одна из причин использовать такой объект, если вам нужно удалить элементы. Удаление ключа из объекта намного проще, чем удаление ключа из массива.
Bryc

Если комментарий массива HypeZ кого-нибудь отбрасывает, ответ Крэйга не добавляет массив, для доступа к свойству используются скобки []. Протестируйте его здесь на jsfiddle и прочитайте об этом здесь, в Mozilla, и вот отличная статья в Digital Ocean, с которой мне хотелось бы познакомиться давно.
Хастиг Зусамменстеллен

12

Для добавления к объекту используйте Object.assign

var ElementList ={}

function addElement (ElementList, element) {
    let newList = Object.assign(ElementList, element)
    return newList
}
console.log(ElementList)

Вывод:

{ "Элемент": { "ID": 10, "количество": 1}, "элемент": { "ID": 11, "количество": 2}}


Это, вероятно, самый функциональный способ сделать что-то, но начинающий разработчик javascript, вероятно, не поймет этого.
codeninja

1
я попробовал, но он переопределит существующий элемент, потому что оба имеют одинаковое имя element, поэтому он будет иметь только последний элемент.
Haritsinh Gohil

7

Я читал что-то, связанное с этой попыткой, если это полезно.

1. Определить функцию push внутри объекта.

let obj={push:function push(element){ [].push.call(this,element)}};

Теперь вы можете выдвигать элементы как массив

obj.push(1)
obj.push({a:1})
obj.push([1,2,3])

Это будет производить этот объект

obj={
 0: 1
 1: {a: 1}
 2: (3) [1, 2, 3]
 length: 3
}

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


6

Вы должны написать var element = [];
в javascript {}пустой объект и []пустой массив.


6
cart.push({"element":{ id: id, quantity: quantity }});

4
не могу сделать cart.push, потому что корзина теперь является объектом! :(
HypeZ

какая-то конкретная причина, почему это объект, а не массив?
Cris

потому что я получил его из "cart = JSON.parse (jsonfile)", и он дает объект
HypeZ

5
function addValueInObject(object, key, value) {
    var res = {};
    var textObject = JSON.stringify(object);
    if (textObject === '{}') {
        res = JSON.parse('{"' + key + '":"' + value + '"}');
    } else {
        res = JSON.parse('{' + textObject.substring(1, textObject.length - 1) + ',"' + key + '":"' + value + '"}');
    }
    return res;
}

этот код работает.


3

Попробуй это:

var data = [{field:"Data",type:"date"},  {field:"Numero",type:"number"}];

var columns = {};

var index = 0;

$.each(data, function() {

    columns[index] = {
        field : this.field,
        type : this.type
    };

    index++;
});

console.log(columns);

3

Добавление новых элементов ключ / пара в исходный объект:

const obj = { a:1, b:2 }
const add = { c:3, d:4, e: ['x','y','z'] }

Object.entries(add).forEach(([key,value]) => {obj[key] = value })

obj новое значение:

{a: 1, b: 2, c: 3, d: 4, e: ["x", "y", "z"] }

2

Если кто-то захочет создать похожий JSON, без использования cartв качестве массива, то здесь:

У меня есть массив объектов myArrкак:

var myArr = [{resourceType:"myRT",
            id: 1,
            value:"ha"},
            {resourceType:"myRT",
            id: 2,
            value:"he"},
            {resourceType:"myRT",
            id: 3,
            value:"Li"}];

и я попытаюсь создать JSON со следующей структурой:

{
 "1":{"resourceType":"myRT","id":"1","value":"ha"},
 "2":{"resourceType":"myRT","id":"2","value":"he"},
 "3":{"resourceType":"myRT","id":"3","value":"Li"}
}

Вы можете просто сделать

var cart = {};
myArr.map(function(myObj){
                    cart[myObj.id]= myObj;
                    });

Как добавить значение к той новой структуре JSON, которую вы создали?
Джуд Фернандес

1
@JudeFernandes в cart[key]=valueосновном это карта ключевых значений. Сделайте upvote, если ответ был полезным. Спасибо!
Саад Патель

2

Для тех, кто все еще ищет решение, я думаю, что объекты должны быть сохранены в массиве, как ...

var element = {}, cart = [];
element.id = id;
element.quantity = quantity;
cart.push(element);

Затем, когда вы хотите использовать элемент в качестве объекта, вы можете сделать это ...

var element = cart.find(function (el) { return el.id === "id_that_we_want";});

Поместите переменную в id_that_we_want и присвойте ей идентификатор элемента, который мы хотим получить из нашего массива. Объект "elemnt" возвращается. Конечно, нам не нужен идентификатор, чтобы найти объект. Мы могли бы использовать любое другое свойство, чтобы найти.


1
 function addValueInObject(value, object, key) {

        var addMoreOptions = eval('{"'  + key + '":' +  value + '}');

        if(addMoreOptions != null) {
            var textObject = JSON.stringify(object);
            textObject = textObject.substring(1,textObject.length-1);
            var AddElement = JSON.stringify(addMoreOptions);
            object = eval('{' + textObject +','+  AddElement.substring(1,AddElement.length-1) + '}');
        }
        return object;
    }

addValueInObject('sdfasfas', yourObject, 'keyname');

ИЛИ:

var obj = {'key':'value'};

obj.key2 = 'value2';

Хотя это способ достижения тех же результатов, это решение не изящное.
warunapww

1

push - это метод массивов, поэтому для объекта вы можете получить индекс последнего элемента и, вероятно, выполнить ту же работу, что и push для объекта, как показано ниже.

var lastIndex = Object.keys(element)[Object.keys(element).length-1];

затем добавьте объект в новый индекс элемента

element[parseInt(lastIndex) +1] = { id: id, quantity: quantity };

1

если вы не планируете делать цикл в JS, например, перейдите к PHP, чтобы сделать цикл для вас

let decision = {}
decision[code+'#'+row] = event.target.value

эта концепция может немного помочь


1

Это старый вопрос, в любом случае на сегодняшний день лучше всего использовать Object.defineProperty

const object1 = {};

Object.defineProperty(object1, 'property1', {
  value: 42,
  writable: false
});

object1.property1 = 77;
// throws an error in strict mode

console.log(object1.property1);
// expected output: 42
Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.