Додавання нового елемента масиву до об’єкта JSON


120

У мене є об'єкт формату JSON, який я читаю з файлу JSON, який у мене є в змінній під назвою teamJSON, що виглядає приблизно так:

 {"theTeam":[{"teamId":"1","status":"pending"},{"teamId":"2","status":"member"},{"teamId":"3","status":"member"}]}

Я хочу додати новий масив до масиву, наприклад

{"teamId":"4","status":"pending"}

закінчити

{"theTeam":[{"teamId":"1","status":"pending"},{"teamId":"2","status":"member"},{"teamId":"3","status":"member"},{"teamId":"4","status":"pending"}]}

перед тим як записати назад у файл. Який хороший спосіб додати новий елемент? Я наблизився, але всі подвійні цитати уникли. Я шукав гарну відповідь на ТА, але жоден не повністю висвітлює цю справу. Будь-яка допомога вдячна.


6
yourObj.theTeam.push({"teamId":"4","status":"pending"});
PSL

2
"JSON" не є об'єктом - це позначення.
Бред Крісті,

1
Читаючи об'єкт JSON з файлу, чи трактується він як JSON або рядок? Якщо його рядок, вам потрібно спершу проаналізувати рядок як JSON, тоді ви можете робити те, що пропонують інші коментарі та відповіді.
Марк

3
@Charles прочитайте вашу назву, а потім перегляньте ваш коментар.
Бред Крісті,

1
@ CharlesWyke-Smith Який тип вашої teamJSONзмінної? Це рядок JSON, тобто '{"theTeam":[...]}'чи фактичний буквальний об'єкт? Підказка: використанняconsole.log(typeof teamJSON)
Філ

Відповіді:


233

JSON - це лише позначення ; щоб внести потрібні зміни, ви parseзможете застосувати зміни до рідного об’єкта JavaScript , а потім stringifyповернутися до JSON

var jsonStr = '{"theTeam":[{"teamId":"1","status":"pending"},{"teamId":"2","status":"member"},{"teamId":"3","status":"member"}]}';

var obj = JSON.parse(jsonStr);
obj['theTeam'].push({"teamId":"4","status":"pending"});
jsonStr = JSON.stringify(obj);
// "{"theTeam":[{"teamId":"1","status":"pending"},{"teamId":"2","status":"member"},{"teamId":"3","status":"member"},{"teamId":"4","status":"pending"}]}"

16
+1 для вказівки на це потрібно проаналізувати об'єкт, яким спочатку потрібно маніпулювати.
Бред Крісті

3
Він сказав, що у нього вже є об'єкт у змінній з назвою teamJSON. Ні в якому разі не згадується рядок
Філ

6
@Phil: Якщо це JSON, це рядок. Якщо це не так, це не JSON.
користувач2736012

1
Втечені котирування насправді змушують мене замислитися, чи JSON був закодований двічі.
користувач2736012

24
Павло, це дуже конструктивна відповідь. Він вирішує недолік у постановці проблеми, не принижуючи оригінальний плакат. Він більш чітко окреслює межі між операціями на об’єктах javascript та текстовим поданням цих JSON цих об'єктів. Я думаю, що важливо розуміти, що після розбору JSON ми працюємо на чистих об’єктах JavaScript - той факт, що вони спочатку походили з JSON, не має значення. У будь-якому разі, читання вашої відповіді було подихати свіжим повітрям після всіх зневажливих коментарів, завдяки яким ОП почувалася ідіоткою.
Ларрі Гектор,

20
var Str_txt = '{"theTeam":[{"teamId":"1","status":"pending"},{"teamId":"2","status":"member"},{"teamId":"3","status":"member"}]}';

Якщо ви хочете додати останню позицію, використовуйте це:

var parse_obj = JSON.parse(Str_txt);
parse_obj['theTeam'].push({"teamId":"4","status":"pending"});
Str_txt = JSON.stringify(parse_obj);
Output //"{"theTeam":[{"teamId":"1","status":"pending"},{"teamId":"2","status":"member"},{"teamId":"3","status":"member"},{"teamId":"4","status":"pending"}]}"

Якщо ви хочете додати на першій позиції, тоді використовуйте наступний код:

var parse_obj = JSON.parse(Str_txt);
parse_obj['theTeam'].unshift({"teamId":"4","status":"pending"});
Str_txt = JSON.stringify(parse_obj);
Output //"{"theTeam":[{"teamId":"4","status":"pending"},{"teamId":"1","status":"pending"},{"teamId":"2","status":"member"},{"teamId":"3","status":"member"}]}"

Усі, хто хоче додати до певного положення масиву, спробуйте це:

parse_obj['theTeam'].splice(2, 0, {"teamId":"4","status":"pending"});
Output //"{"theTeam":[{"teamId":"1","status":"pending"},{"teamId":"2","status":"member"},{"teamId":"4","status":"pending"},{"teamId":"3","status":"member"}]}"

Вище кодовий блок додає елемент після другого елемента.


1

Спочатку нам потрібно розібрати об'єкт JSON, а потім ми можемо додати елемент.

var str = '{"theTeam":[{"teamId":"1","status":"pending"},
{"teamId":"2","status":"member"},{"teamId":"3","status":"member"}]}';

var obj = JSON.parse(str);
obj['theTeam'].push({"teamId":"4","status":"pending"});
str = JSON.stringify(obj);

Нарешті , ми JSON.stringify в OBJ назад в формат JSON


Що робити, якщо наш JSON не має такої назви, як Theeam, а замість цього містить лише вузли з елементами teamId & status? так моє виглядатиме так: var str = '[{"teamId": "1", "status": "очікує"}, {"teamId": "2", "status": "member"}, {"teamId ":" 3 "," статус ":" член "}] ';
Шафік

0

Наприклад, ось такий елемент, як кнопка для додавання елемента до кошика та відповідних атрибутів для збереження в localStorage.

'<a href="#" cartBtn pr_id='+e.id+' pr_name_en="'+e.nameEn+'" pr_price="'+e.price+'" pr_image="'+e.image+'" class="btn btn-primary"><i class="fa fa-shopping-cart"></i>Add to cart</a>'

var productArray=[];


$(document).on('click','[cartBtn]',function(e){
  e.preventDefault();
  $(this).html('<i class="fa fa-check"></i>Added to cart');
  console.log('Item added ');
  var productJSON={"id":$(this).attr('pr_id'), "nameEn":$(this).attr('pr_name_en'), "price":$(this).attr('pr_price'), "image":$(this).attr('pr_image')};


  if(localStorage.getObj('product')!==null){
    productArray=localStorage.getObj('product');
    productArray.push(productJSON);  
    localStorage.setObj('product', productArray);  
  }
  else{
    productArray.push(productJSON);  
    localStorage.setObj('product', productArray);  
  }


});

Storage.prototype.setObj = function(key, value) {
    this.setItem(key, JSON.stringify(value));
}

Storage.prototype.getObj = function(key) {
    var value = this.getItem(key);
    return value && JSON.parse(value);
}

Після додавання об'єкта JSON до масиву результат (у LocalStorage):

[{"id": "99", "nameEn": "Назва продукту1", "ціна": "767", "зображення": "1462012597217.jpeg"}, {"id": "93", "nameEn" : "Назва продукту2", "ціна": "76", "зображення": "1461449637106.jpeg"}, {"id": "94", "nameEn": "Назва продукту3", "ціна": "87" , "image": "1461449679506.jpeg"}]

після цієї дії ви можете легко надіслати дані на сервер у вигляді списку на Java

Повний приклад коду тут

Як зберігати простий кошик за допомогою localStorage?


0

У моєму випадку в моєму об'єкті JSON в ньому не було жодного наявного масиву, тому я спершу повинен був створити елемент масиву, а потім повинен був натиснути елемент.

  elementToPush = [1, 2, 3]
  if (!obj.arr) this.$set(obj, "arr", [])
  obj.arr.push(elementToPush)  

(Ця відповідь може не стосуватися конкретного питання, але може допомогти іншому)


0

Припустимо, у нас вже є дані в змінній alreadyData;

var alreadyData=[{"id":"99","nameEn":"Product Name1","price":"767","image":"1462012597217.jpeg"},{"id":"93","nameEn":"Product Name2","price":"76","image":"1461449637106.jpeg"},{"id":"94","nameEn":"Product Name3","price":"87","image":"1461449679506.jpeg"}];

var fields = []; //new array
var json = JSON.parse(alreadyData); //just parse in one variable
var json = JSON.parse(tableColumns);
for (var i = 0; i < json.length; i++) {
    fields.push(json[i]);//push data in fields
} 
fields.push({ 'id':33, 'nameEn': 'Singh', 'price': '222','image': '1462012597217.jpeg' }); // its new data
Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.