We Keep Coding

AngularJS: Object manipulation: flattening object in js

I have an object received in response from backend, and would like to extract elements of object and attach them to scope to make it available in the View.
Following is the structure of the object:
{
"Name": {
"S": "Jon Snow"
},
"Location": {
"S": "Winterfell"
},
"Details": {
"M": {
"Parents": {
"M": {
"mother": {
"S": "Lynna Stark"
}
}
},
"Dog": {
"N": "Ghost Snow"
}
}
}
}
Since I have received it from backend, I don't know what kind of object is this, and I want to convert it to a plain JSON object which should be looking something like this:
{
"Name": "Jon Snow",
"Location": "Winterfell",
"Details": {
"Parents": {
"mother": "Lynna Stark"
},
"Dog": "Ghost Snow"
}
}
Help is appreciated, as I am a beginner in AngularJS and also It would be good if someone elaborates what kind of Object did I receive? Thanks in advance.
Update 1:
Thanks for the responses. Now I have got the idea. Now the question is how to I flatten the object by one level? And If I do flatten does it tamper the original response as it is received from the backend, it may be different every time.

const data = {
"Name": {
"S": "Jon Snow"
},
"Location": {
"S": "Winterfell"
},
"Details": {
"M": {
"Parents": {
"M": {
"mother": {
"S": "Lynna Stark"
}
}
},
"Dog": {
"N": "Ghost Snow"
}
}
}
}
const flatten = (data) =>{
if(typeof data === "string") return data;
for(let key in data){
for(let deep in data[key]){
if(deep.length === 1){
const temp = data[key]
data[key] = flatten(temp[deep])
}
}
}
return data;
}
console.log( JSON.stringify(flatten(data), null, "\t"))
JS bin

Angular 7, create new object with some values from object

I have object like this
const Obj =
"Value1": {
"value1value": "1"
},
"Value2": {
"value2value": "2"
},
"Value3": {
"value3value": "3"
},
"BTest": {
"1": "1",
"2": "2"
},
"Value4": {
"value4value": "value4value"
},
"ATest": {
"1": "1",
"2": "2"
},
"Value5": {
"value5value": "value5value",
"value6value": "value6value"
},
"TestA": {
"1": "1",
"2": "2"
};
What i need is to create new object that will look like this
cont newObject =
"Value1": {
"value1value": "1"
},
"Value2": {
"value2value": "2"
},
"Value3": {
"value3value": "3"
},
"Value4": {
"value4value": "value4value"
},
"Value5": {
"value5value": "value5value",
"value6value": "value6value"
};
Some values are removed, i have tried with like
const newObject = Obj.map(o => {
return { };
});
But i had no luck, does somebody knows what has to be done, thanks in advance

Looks like you want to extract keys which starts with specific value so you can do something like
var obj={"Value1": {
"value1value": "1"
},
"Value2": {
"value2value": "2"
},
"Value3": {
"value3value": "3"
},
"BTest": {
"1": "1",
"2": "2"
},
"Value4": {
"value4value": "value4value"
},
"ATest": {
"1": "1",
"2": "2"
},
"Value5": {
"value5value": "value5value",
"value6value": "value6value"
},
"TestA": {
"1": "1",
"2": "2"
}}
let newObj={};
Object.keys(obj).forEach(k=>{
if(k.startsWith('Value')){
newObj[k]=obj[k];
}
})
console.log(newObj)

If you do not want to use startwith etc and want to use full names how about this, You create an array with the names that you want to remove and than simply check add keys that are not in that array to new object. Something like this
const removeableItems = ["TestA", "BTest", "ATest"]
let newObj = {}
for (var key in obj) {
if (obj.hasOwnProperty(key) && !removeableItems.includes(key)) {
newObj[key] = obj[key];
}
}
Here is a blitz showing this.

You can use Object.assign() and Spread syntax combined with Object.keys(), Array.prototype.filter(), Array.prototype.map() and String.prototype.startsWith():
const Obj = {"Value1": {"value1value": "1"},"Value2": {"value2value": "2"},"Value3": {"value3value": "3"},"BTest": {"1": "1","2": "2"},"Value4": {"value4value": "value4value"},"ATest": {"1": "1","2": "2"},"Value5": {"value5value": "value5value","value6value": "value6value"},"TestA": {"1": "1","2": "2"}};
const result = Object.assign(
{},
...Object.keys(Obj)
.filter(k => k.startsWith('Value'))
.map(k => ({ [k]: Obj[k] }))
);
console.log(result);

Order in which properties are added to array.reduce() return object

Can anyone explain why the final output is the same in different uses of array.reduce() function?
In the first instance, the sample array is reduced directly whereas, in the second example, the sample array is first reversed and then reduced.
var array = [{
"Id": "1",
"Week": "2019-01-13"
},
{
"Id": "2",
"Week": "2019-01-20"
},
{
"Id": "3",
"Week": "2019-01-27"
}
];
array.reduce(function (acc, curr) {
acc[curr.Id] = curr.Week;
console.log(acc);
return acc;
}, {});
//Output
/*{ "1": "2019-01-13" }
{ "1": "2019-01-13", "2": "2019-01-20" }
{ "1": "2019-01-13", "2": "2019-01-20", "3": "2019-01-27" }*/
array.reverse().reduce(function (acc, curr) {
acc[curr.Id] = curr.Week;
console.log(acc);
return acc;
}, {});
//Output
/*{ "3": "2019-01-27" }
{ "2": "2019-01-20", "3": "2019-01-27" }
{ "1": "2019-01-13", "2": "2019-01-20", "3": "2019-01-27" }
*/
I would like the output to appear as
{ "3": "2019-01-27", "2": "2019-01-20", "1": "2019-01-13" }.
If I use non numeric keys, the reduce function output in both scenarios are as expected(in the same order elements are passed).

As already mentioned in the comments object prop order is not guaranteed in JS which is why you get that output. If you want order to matter you need to use Map as your reduce accumulator.
The Map object holds key-value pairs and remembers the original
insertion order of the keys.
With that said here is some sample code to illustrate it better:
var array = [{ "Id": "1", "Week": "2019-01-13" }, { "Id": "2", "Week": "2019-01-20" }, { "Id": "3", "Week": "2019-01-27" } ];
let r1 = array.reduce(function(acc, curr) {
acc.set(curr.Id, curr.Week);
return acc;
}, new Map());
let r2 = array.reverse().reduce(function(acc, curr) {
acc.set(curr.Id, curr.Week);
return acc;
}, new Map());
console.log('r1:')
r1.forEach(x => console.log(x))
console.log('r2:')
r2.forEach(x => console.log(x))
console.log('fromEntries:')
console.log(Object.fromEntries(r1))
console.log(Object.fromEntries(r2))
Notice how the order is different when we loop through the entries of the two maps (r1 & r2). Also notice however that the moment you convert the maps to object literals the order is now the same since JS prop order is not guaranteed.

How do i iterate through this JSON object using javascript [duplicate]

This question already has answers here:
How can I access and process nested objects, arrays, or JSON?
(31 answers)
Closed 8 years ago.
How do I pull out ColumnValues[i] using javascript from this JSON sample using two instances with keys = "1" and "2" as shown below. This is just a sample my original JSON object has 500+ entries like this with key = "1", "2", "3", "4", etc. When I retrieve the length of the object the value that is returned equals 1 so using for loop does not work with the length property. Appreciate any help.
JSON object below
[
{
"1": {
"ChildCount": 0,
"ColumnIndentLevel": 0,
"DescendantCount": 0,
"IndentLevel": 0,
"IsCategory": false,
"IsConflict": false,
"IsDocument": true,
"IsTotal": false,
"IsValid": true,
"NoteID": "3962",
"SiblingCount": 2,
"UniversalID": "E8D5D7E88B08CBD686257CD6007470E5",
"ColumnValues": {
"0": "03297",
"1": "Amelia Tang",
"2": "NBK3456",
"3": "FHA",
"4": "2008/10/03 00:00:00 UTC-0000",
"5": "Withdrawn by SASE Administration",
"6": "Approver Level 2",
"7": "Reinstatement"
}
},
"2": {
"ChildCount": 0,
"ColumnIndentLevel": 0,
"DescendantCount": 0,
"IndentLevel": 0,
"IsCategory": false,
"IsConflict": false,
"IsDocument": true,
"IsTotal": false,
"IsValid": true,
"NoteID": "7972",
"SiblingCount": 2,
"UniversalID": "4CEE012B8D60A86A86257CD6007657B0",
"ColumnValues": {
"0": "20004484",
"1": "Anthony Susino",
"2": "",
"3": "Conventional",
"4": "2009/05/11 00:00:00 UTC-0000",
"5": "Withdrawn by SASE Administration",
"6": "",
"7": ""
}
}
}]

Use this:
for (var key in yourObject) { // key will be "1", "2", ...
var value = yourObject[key];
// do something
}

var ColumnValues = /* that object */,
i = 0; //this makes sure the object is iterated in an ascending order
while(i++ in ColumnValuesd){ //and ignores irrelevant properties that are
var item = ColumnValues[i]; //inherited from Object's prototype.
//do something
}
Same goes for the most-top level keys.

Javascript Sort key value pair object based on value

I have an object like below. Trying to rearrange it in ascending order based on value. Similar to Javascript array sort method.
var masterList = {
"1": "google",
"2": "yahoo",
"3": "msn",
"4": "stackoverflow",
"5": "github",
"6": "jsfiddle",
"7": "amazon",
"8": "ebay"
}
Please let me know the better solution...

JavaScript objects have no order. Even though most browsers do iterate in the same order the properties were created, there's no guarantee, so sorting is not supported on objects.
See here for more info: Does JavaScript Guarantee Object Property Order?
You might also be interested in what John Resig has got to say on the matter.
If you need a sort-able list, you'll have to store it as an array of objects:
var masterList = [
{ key: 1, val: "google" },
{ key: 2, val: "yahoo" },
{ key: 3, val: "msn" },
{ key: 4, val: "stackoverflow" },
{ key: 5, val: "github" },
{ key: 6, val: "jsfiddle" },
{ key: 7, val: "amazon" },
{ key: 8, val: "ebay" }
];
Then, to sort them, just use the regular array's sort method:
masterList = masterList.sort(function (a, b) {
return a.val.localeCompare( b.val );
});
Here's the fiddle: http://jsfiddle.net/ASrUD/

var obj = {
"1": "google",
"2": "yahoo",
"3": "msn",
"4": "stackoverflow",
"5": "github",
"6": "jsfiddle",
"7": "amazon",
"8": "ebay"
};
var arr = [];
for (var key in obj) {
if (obj.hasOwnProperty(key)) {
arr.push(obj[key]);
}
}
alert(arr.sort());
This will sort your values in ascending order. let me give sometime will revert you with how to convert that to an object.

var masterList = {
"2": "yahoo",
"3": "msn",
"4": "stackoverflow",
"5": "github",
"6": "jsfiddle",
"7": "amazon",
"8": "ebay",
"1": "google",
}
var masterList_ = {}
Object.keys(masterList).sort().forEach(a=>masterList_[a]=masterList[a])
console.log(masterList_)