2. Object
Objects are variables too. But objects can contain
many values.
Objects store a collection of key-value pairs: each
item in the collection has a name that we call
the key and an associated value
An object's keys are strings or symbols, but the
values can be any type, including other objects
We can create an object using object
literal syntax:
let person = {
name: 'Jane',
age: 37,
hobbies: ['photography', 'genealogy'],
};
3. This code shows an object named person that has 3
key-value pairs:
i) The name of the person, a string, defined by
the name key.
ii) The age of the person, a number, defined by
the age key.
iii) A list of the person's hobbies, an array of strings,
defined by the hobbies key.
Braces ({}) delimit the list of key-value pairs
contained by the object. Each key-value pair ends
with a comma (,), and each pair has a key, a colon
(:), and a value. The comma that follows the last
pair is optional. Though the keys are strings, we
typically omit the quotes when the key consists
entirely of alphanumeric characters and
underscores. The values of each pair can be any
type.
4. We can access a specific value in an object in two
ways: 1) dot notation and 2) bracket notation
Person.name= 'Jane‘ //dot notation
person['age'] =37 // bracket notation
Let's add some more key-value pairs to
the person object:
person= { name: 'Jane', age: 37, hobbies:
['photography', 'genealogy'], height: '5 ft',
gender: 'female' }
To remove something from an existing object, you
can use the delete keyword
delete person.age = true
5.
6. JAVASCRIPT ARRAY
An array is a set of variables (e.g., strings or
numbers) that are grouped together and given a
single name.
Creating Arrays
To create an array, a new Array object must be
declared. This can be done in two ways:
var myArray = new
Array("Sarah","Patrick","Jane","Tim");
Or
var myArray =
["Sarah","Patrick","Jane","Tim"];
7. POPULATING ARRAY WITH DATA
Syntax
arrayName[index] = value;
arrayName: The name of the array variable
index: The array index number where you want
the value stored
value: The value you’re storing in the array
Example
var dogPhotos = new Array(5);
dogPhotos[0] = "dog-1";
dogPhotos[1] = "dog-2";
dogPhotos[2] = "dog-3";
8. Using a loop to populate an array
var dogPhotos = new Array(5);
for (var counter = 0; counter < 5; counter++) { dogPhotos[counter] =
"dog-" + (counter + 1);
}
Full code
// Declare the array
var dogPhotos = new Array(5);
// Initialize the array values using a loop
for (var counter = 0; counter < 5; counter++) {
dogPhotos[counter] = "dog-" + (counter + 1);
}
// Get the photo number
var promptNum = prompt("Enter the dog you want to see (1-5):", "");
if (promptNum !== "" && promptNum !== null) {
// Construct the primary part of the filename var promptDog = "dog-
" + promptNum;
// Work with the array values using a loop
for (counter = 0; counter < 5; counter++) {
9. if (promptDog === dogPhotos[counter] {
document.body.style.backgroundImage =
"url('/images/" + dogPhotos[counter] + ".png')";
break; }
} }
Creating Multidimensional Arrays
A multidimensional array is one where two or more
values are stored within each array element
// define array
var myArray = [ ['apple', 'orange', 'mango'],
['rose', 'lotus', 'lily'], ['cabbage', 'carrot',
'beans'] ];
Access elements of the array
console.log(myArray[0][1]); // orange
console.log(myArray[1][0]); // rose
console.log(myArray[2][2]); // beans
10. Get key by value
var position = myArray[0].indexOf('mango');
console.log(position); // 2
Get position of element in the array
console.log(myArray[0].indexOf('mango')); // 2
Get size of the array
console.log(myArray.length); // 3
11. Using for loop
for (i = 0; i < myArray.length; i++) {
console.log(i, myArray[i]);
}
//0 ["apple", "orange", "mango"]
//1 ["rose", "lotus", "lily"]
//2 ["cabbage", "carrot", "beans"]
for (i = 0; i < myArray.length; i++) {
for (j = 0; j < myArray[i].length; j++) {
console.log(i, j, myArray[i][j]);
} }
// 0 0 "apple"
// 0 1 "orange"
// 0 2 "mango"
12. Add item at the end of the array
myArray[2].push('potato');
console.log(myArray[2]); // ["cabbage", "carrot",
"beans", "potato"]
Add item at the beginning of the array
myArray[2].unshift('tomato');
console.log(myArray[2]);
// ["tomato", "cabbage", "carrot", "beans", "potato"]
Remove item from end of the array
myArray[2].pop();
console.log(myArray[2]); // ["tomato", "cabbage",
"carrot", "beans"]
Remove item from the beginning
myArray[2].shift();
console.log(myArray[2]); // ["cabbage", "carrot",
"beans"]