objectxarray.html arrays.

js

1
2
3
4
Objects and Arrays{
5
6
[in JavaScript]
7
8
9 Echo ‘Who the heck are Objects and Arrays?!!’;
10
11
12
13 }
14

JavaScript Objects and Arrays

 objectxarrays.html arrays.js

1
2
Arrays
3 An array is a type off data-type that holds an
4 ordered list of values, of any type:
5
6 I can store strings:
7
8
9
Even number:
10
11
12
13 I can also store both at the same time:
14

JavaScript Variables
 objectxarrays.html arrays.js

1
2
3
4
5
6
7
8 What can we do with those data?
9
10
11
12
13
14

JavaScript Variables
 objectxarrays.html arrays.js

1
2
We can get size of an array
3
4
5
6
7
8 By using:
9
10
11
12
13
14

JavaScript Variables
 objectxarrays.html arrays.js

1
2
3
4
5
6
7
8 But how can we access the data?
9
10
11
12
13
14

JavaScript Variables
 objectxarrays.html arrays.js

1
2
We can access the data by…
3
4 Using bracket notation:
5
6
7
8
9
10 The 0 inside bracket is the index of a value you are
11 trying to access
12
13
14

JavaScript Variables
 objectxarrays.html arrays.js

1
2
3
4
5
6
7
8 But how can we edit existing data?
9
10
11
12
13
14

JavaScript Variables
 objectxarrays.html arrays.js

1
2
We can change existing data by…
3
4 Using bracket notation again, but this time we use
5
an assignment operator.
6
7
8
9
10
11
12
13
14

JavaScript Variables
 objectxarrays.html arrays.js

1
2
3
4
5
6
7
8 Hmm… I want to add data to an array,
9
10
how can I do that?
11
12
13
14

JavaScript Variables
 objectxarrays.html arrays.js

1
2
We can add data to an array by…
3
4 Using bracket notation again and again, but this
5
time make sure that the index you are going to put
6
7
is not yet taken.
8
9 Here is our array:
10
11
12 With this we can add value to the array
13
14

JavaScript Variables
 objectxarrays.html arrays.js

1
2
3
4
5
6
7
8 But how can we get the last data?
9
10
11
12
13
14

JavaScript Variables
 objectxarrays.html arrays.js

1
2
By doing this…
3
4
5
6
7
8
9
10
11
12
13
14

JavaScript Variables
 objectxarrays.html arrays.js

1
2
But wait, there are other ways…
3
4 Using the push method
5
6
7
8
9
10 See? It’s much easier than that bracket notation
11
12
13
14

JavaScript Variables
 objectxarrays.html arrays.js

1
2
3
4
5
6
7
8 Now let’s move on, but don’t forget our
9
10
past.
11
12
13
14

JavaScript Variables
 objectxarrays.html arrays.js

1
2
Using for loop in an Array
3 In this array:
4
5
6
7
8 We use for loop:
9
10
11
12
13
14

JavaScript Variables
 objectxarrays.html object.js

1
2
3
4
5
6
7
8 Now we proceed with Object…
9
10
11
12
13
14

JavaScript Variables
 objectxarrays.html object.js

1
2
Object
3 Object are data type that let us store a collection of
4 properties and methods.
5
6 Here is the syntax:
7
8
9
10
11
12
13
14

JavaScript Variables
 objectxarrays.html object.js

1
2
3
4
5
6
7
8 Pretty easy right? Now we apply real
9
10 data
11
12
13
14

JavaScript Variables
 objectxarrays.html object.js

1
2
Object
3
4
5
6
7
8
9
10
11
12 Property value are also strings and, they are key value pair
13
14

JavaScript Variables
 objectxarrays.html object.js

1
2
3
4
5
6
7
8 But how can access the property
9
10 value?
11
12
13
14

JavaScript Object
 objectxarrays.html object.js

1
2
We can access them by
3 (Again) using bracket notation
4
5 If you want to access “Angeles City” do this:
6
7
8
9
10 Or using dot notation:
11
12
13
14

JavaScript Object
 objectxarrays.html object.js

1
2
3
4
5
6
7
8 Objects can do what arrays can but in
9
10 better ways
11
12
13
14

JavaScript Object
 objectxarrays.html object.js

1 You can add new properties in an Object

2
3
4 Using bracket notation:
5
6
7
8 Or using dot notation:
9
10
11
12 Note that if property name exist, it will just replace that
13
current value of that property
14

JavaScript Object
 objectxarrays.html object.js

1 You can delete properties in an object

2
3
4
5
6
7
Just as simple as this
8
9
10
11
12
13
14

JavaScript Object
 objectxarrays.html object.js

1
2
3
4
5
6
7
8 Can we combine arrays and objects?
9
10
11
12
13
14

JavaScript Object
 objectxarrays.html objectxarrays.js

1
2
3 Yes of course…
4
5
6
7
8
9
10
11
12
13
14

JavaScript Object x Arrays

 objectxarrays.html object.js

1
2
3
4
5
6
7
8 Can we combine arrays, objects and
9
10 functions?
11
12
13
14

JavaScript Object
 objectxarrays.html objectxarrays.js

1
2
3 Yes of course…
4
5
6
7
8
9
10
11
12
13
14

JavaScript Object x Arrays

 objectxarrays.html object.js

1
2
3
4
5
6
7
8 Now can we combine objects and
9
10 functions?
11
12
13
14

JavaScript Object
 objectxarrays.html objectxarrays.js

1
2
3 Yes of course…
4
5
6
7
8
9
10
11
12
13
14

JavaScript Object x Arrays

 objectxarrays.html object.js

1
2
3
4
5
6
7
8 We can even parametrize the function
9
10
11
12
13
14

JavaScript Object
 objectxarrays.html objectxarrays.js

1
2
3 Here’s how…
4
5
6
7
8
9
10
11
12
13
14

JavaScript Object x Arrays

 objectxarrays.html object.js

1
2
3
4
5
6
7
8 Also, we can make them return a value
9
10
11
12
13
14

JavaScript Object
 objectxarrays.html objectxarrays.js

1
2
3 Here’s how…
4
5
6
7
8
9
10
11
12
13
14

JavaScript Object x Arrays

 objectxarrays.html object.js

1
2
3
4
5
6
7
8 Loopings
9
10
11
12
13
14

JavaScript Object
 objectxarrays.html objectxarrays.js

1
2
3 For loop
4
5
6
7
8
9
10
11
12
13
14

JavaScript Object x Arrays

 objectxarrays.html objectxarrays.js

1
2
3 While loop
4
5
6
7
8
9
10
11
12
13
14

JavaScript Object x Arrays

 objectxarrays.html object.js

1
2
3
4
5
6
7
8 For loops can do that too…
9
10
11
12
13
14

JavaScript Object
 objectxarrays.html objectxarrays.js

1
2
3 Here’s how
4
5
6
7
8
9
10
11
12
just surround the condition with semicolon
13
14

JavaScript Object x Arrays

 objectxarrays.html objectxarrays.js

1
2
3 Do…while
4
5
6
7
8
9
10
11
12
13
14

JavaScript Object x Arrays

 objectxarrays.html object.js

1
2
3
4
5
6
7
8 What is the difference between do…
9
10 while and while?
11
12
13
14

JavaScript Object
 objectxarrays.html objectxarrays.js

1
2
3 Do…while vs while
4
5
Do…while – executes the loop body before checking
6
7
the condition
8
9 while – checks the condition first before executing the
10 loop body.
11
12
13
14

JavaScript Object x Arrays

 objectxarrays.html object.js

1
2
3
4
5
6
7
8 ForEach()
9
10
11
12
13
14

JavaScript Object
 objectxarrays.html object.js

1
2
3
4
5
6
7
8
9
10
11
12
13
14

JavaScript Object
 objectxarrays.html objectxarrays.js

1
2
3
4
5
6
7
8
9
10
11 Those who have dollar signs are just template
12
13
literals.
14

JavaScript Object x Arrays

 objectxarrays.html object.js

1
2
3
4
5
6
7
8 ForEach() for objects…
9
10
11
12
13
14

JavaScript Object
 objectxarrays.html objectxarrays.js

1
2
3
4
5
6 Unfortunately, foreach wasn’t made for
7
8
objects
9
10
11
12
13
14

JavaScript Object x Arrays

 objectxarrays.html objectxarrays.js

1
2 But we are programmers, so we can always
3 find a way.
4
5
6
7
8
9
10
11
12
13
14

JavaScript Object x Arrays

 objectxarrays.html objectxarrays.js

1
2
3
4
5
6 Objects keys, values and entries
7
8
9
10
11
12
13
14

JavaScript Object x Arrays

 objectxarrays.html objectxarrays.js

1
2 Keys
3
4
5
6 Values
7
8
9
10 Entries
11
12
13
14

JavaScript Object x Arrays

 dacalasalamat.html thankyouall.js

1
2
3
4
5
6
7
8
9
Thank you Again!
10
11
12
13
14

Salamat