網站搜尋

javascript - 追加到物件


我有一個物件,裡面保存著警報以及一些相關資訊:

var alerts = { 
    1: { app: 'helloworld', message: 'message' },
    2: { app: 'helloagain', message: 'another message' }
}

除此之外,我有一個變數表示有多少個警報,alertNo。我的問題是,當我去新增一個警報時,有沒有辦法將警報附加到 alerts 物件上?

答案#1

如何將警報儲存為陣列中的記錄,而不是單一物件的屬性?

var alerts = [ 
    {num : 1, app:'helloworld',message:'message'},
    {num : 2, app:'helloagain',message:'another message'} 
]

然後要新增一個,只需使用 push:

alerts.push({num : 3, app:'helloagain_again',message:'yet another message'});

答案#2

你可以用 Object.assign() 來做到這一點。有時你需要一個陣列,但當處理需要單一 JSON 物件的函數時,例如 OData 呼叫,我發現這種方法比先建立一個陣列再解開它來得簡單。

var alerts = { 
    1: {app:'helloworld',message:'message'},
    2: {app:'helloagain',message:'another message'}
}

alerts = Object.assign({3: {app:'helloagain_again',message:'yet another message'}}, alerts)

//Result:
console.log(alerts)
{ 
    1: {app:'helloworld',message:'message'},
    2: {app:'helloagain',message:'another message'}
    3: {app: "helloagain_again",message: "yet another message"}
} 

編輯:針對關於獲取下一個鍵的評論,你可以使用 Object.keys() 函數獲取鍵的陣列——參見 Vadi 的回答,了解如何增加鍵的範例。同樣地,你可以使用 Object.values() 獲取所有值,使用 Object.entries() 獲取鍵值對。

var alerts = { 
    1: {app:'helloworld',message:'message'},
    2: {app:'helloagain',message:'another message'}
}
console.log(Object.keys(alerts))
// Output
Array [ "1", "2" ]

答案#3

jQuery $.extend(obj1, obj2) 會幫你合併兩個對象,但你真的應該使用陣列。

var alertsObj = {
    1: {app:'helloworld','message'},
    2: {app:'helloagain',message:'another message'}
};

var alertArr = [
    {app:'helloworld','message'},
    {app:'helloagain',message:'another message'}
];

var newAlert = {app:'new',message:'message'};

$.extend(alertsObj, newAlert);
alertArr.push(newAlert);

答案#4

你可以如下使用展開語法。

var alerts = { 
1: { app: 'helloworld', message: 'message' },
2: { app: 'helloagain', message: 'another message' }
 }

alerts = {...alerts, 3: {app: 'hey there', message: 'another message'} }

答案#5

現在有了 ES6,我們有一個非常強大的展開運算符(...Object),它可以讓這個工作變得非常簡單。可以這樣完成:

let alerts = {
  1: {
    app: 'helloworld',
    message: 'message'
  },
  2: {
    app: 'helloagain',
    message: 'another message'
  }
}
console.log("----------------before----------------");
console.log(alerts);
//now suppose you want to add another key called alertNo. with value 2 in the alerts object. 

alerts = {
  ...alerts,
  alertNo: 2
}

console.log("----------------After----------------");
console.log(alerts);
.as-console-wrapper {
  max-height: 100%!important;
}

就是這樣。它會添加你想要的鍵。希望這有幫助!!

答案#6

正如其他答案所指出的,你可能會發現使用陣列會比較容易。

如果不是:

var alerts = { 
    1: {app:'helloworld',message:'message'},
    2: {app:'helloagain',message:'another message'}
}

// Get the current size of the object
size = Object.keys(alerts).length

//add a new alert 
alerts[size + 1] = {app:'Your new app', message:'your new message'}

//Result:
console.log(alerts)
{ 
    1: {app:'helloworld',message:'message'},
    2: {app:'helloagain',message:'another message'}
    3: {app: "Another hello",message: "Another message"}
}      

試試看:

https://jsbin.com/yogimo/edit?js,console

答案#7

你真的應該遵循各種警示建議,但否則向你提到的對象添加內容會看起來像這樣:

alerts[3]={"app":"goodbyeworld","message":"cya"};

但是由於你不應該使用字面數字作為名稱,所以請引用所有內容並繼續

alerts['3']={"app":"goodbyeworld","message":"cya"};

或者你可以把它做成一個物件陣列。

看起來正在訪問它

alerts['1'].app
=> "helloworld"