how to access array of objects in javascript

1//Creating a list
2var fruits = ["Apple", "Banana", "Cherry"];
3
4//Creating an empty list
5var books = [];
6
7//Getting element of list
8//Lists are ordered using indexes
9//The first element in an list has an index of 0, 
10//the second an index of 1,
11//the third an index of 2,
12//and so on.
13console.log(fruits[0]) //This prints the first element 
14//in the list fruits, which in this case is "Apple"
15
16//Adding to lists
17fruits.push("Orange") //This will add orange to the end of the list "fruits"
18fruits[1]="Blueberry" //The second element will be changed to Blueberry
19
20//Removing from lists
21fruits.splice(0, 1) //This will remove the first element,
22//in this case Apple, from the list
23fruits.splice(0, 2) //Will remove first and second element
24//Splice goes from index of first argument to index of second argument (excluding second argument)

1//create an array like so:
2var colors = ["red","blue","green"];
3
4//you can loop through an array like this:
5for (var i = 0; i < colors.length; i++) {
6    console.log(colors[i]);
7}

1var widgetTemplats = [
2    {
3        name: 'compass',
4        LocX: 35,
5        LocY: 312
6    },
7    {
8        name: 'another',
9        LocX: 52,
10        LocY: 32
11    }
12]

1var events = [
2  {
3    userId: 1,
4    place: "Wormholes Allow Information to Escape Black Holes",
5    name: "Check out this recent discovery about workholes",
6    date: "2020-06-26T17:58:57.776Z",
7    id: 1
8  },
9  {
10    userId: 1,
11    place: "Wormholes Allow Information to Escape Black Holes",
12    name: "Check out this recent discovery about workholes",
13    date: "2020-06-26T17:58:57.776Z",
14    id: 2
15  },
16  {
17    userId: 1,
18    place: "Wormholes Allow Information to Escape Black Holes",
19    name: "Check out this recent discovery about workholes",
20    date: "2020-06-26T17:58:57.776Z",
21    id: 3
22  }
23];
24console.log(events[0].place);

1// The user object will be the test data for the notes taken below, 
2// ALL NOTE ARE AND INFO CAN BE FOUND AT HACKERNOON! 
3// THIS IS NOT MY WORK, I AM ONLY POSTING IT TO GREPPER FOR EASE OF USE OF FINDING THIS 
4// MATERIAL LATER IF NEED BE!
5// With that said enjoy the notes :D
6
7
8const user = {    
9  id: 101,    
10  email: 'jack@dev.com',    
11  personalInfo: {        
12    name: 'Jack',        
13    address: {            
14      line1: 'westwish st',            
15      line2: 'washmasher',            
16      city: 'wallas',            
17      state: 'WX'        
18    }    
19  }
20}
21
22// To access the name of our user we will write:
23const name = user.personalInfo.name;
24const userCity = user.personalInfo.address.city;
25
26// This is the easy and straight-forward approach
27
28// But for some reason, if our user's personal info is not available, the object structure 
29// will be like this:
30const user = {
31  id: 101,
32  email: 'jack@dev.com'
33}
34
35// Now if you try to access the name, you will be thrown "Cannot read property 'name' 
36// of undefined"
37const name = user.personalInfo.name; // Cannot read property 'name' of undefined
38
39//This is because we are trying to access the name key from an object that does not exist
40
41// The usual way how most devs deal with this scenario is
42const name = user && user.personalInfo ? user.personalInfo.name : null;
43// Undefined error will NOT be thrown as we check for existence before access
44
45// This is okay if your nested structure is simple, but if you have your data nested 
46// 5 or 6 levels deep, then your code will look really messy like this:
47
48let city;
49if (    
50  data && data.user && data.user.personalInfo &&    
51  data.user.personalInfo.addressDetails &&    
52  data.user.personalInfo.addressDetails.primaryAddress   
53  ) {    
54    city = data.user.personalInfo.addressDetails.primaryAddress;
55}
56
57// for more information please visit:
58// https://hackernoon.com/accessing-nested-objects-in-javascript-f02f1bd6387f

1Accessing nested data structures
2A nested data structure is an array or object which refers to other arrays or objects, i.e. its values are arrays or objects. Such structures can be accessed by consecutively applying dot or bracket notation.
3
4Here is an example:
5
6const data = {
7    code: 42,
8    items: [{
9        id: 1,
10        name: 'foo'
11    }, {
12        id: 2,
13        name: 'bar'
14    }]
15};
16Let's assume we want to access the name of the second item.
17
18Here is how we can do it step-by-step:
19
20As we can see data is an object, hence we can access its properties using dot notation. The items property is accessed as follows:
21
22data.items
23The value is an array, to access its second element, we have to use bracket notation:
24
25data.items[1]
26This value is an object and we use dot notation again to access the name property. So we eventually get:
27
28const item_name = data.items[1].name;
29Alternatively, we could have used bracket notation for any of the properties, especially if the name contained characters that would have made it invalid for dot notation usage:
30
31const item_name = data['items'][1]['name'];