An essential point to remember a training course is to take notes and discuss the subject with others. That's why every day I will post on dev.to the concepts and notes that I learned the day before.
If you want to miss nothing click follow and you are welcome to comments and discuss with me.
Without further ado here is a summary of my notes for day 5.
Array
An array is a data structure that contains a group of elements. Arrays are commonly used to organize data so that a related set of values can be easily sorted or searched.
// Data store one by one
name1 = 'Mike'
name2 = 'Paul'
name3 = 'John'
// More efficiently store in a array
names = ['Mike', 'Paul', 'John']
// Alternative declaration
names = new Array('Mike', 'Paul', 'John')
// Accessing a specific array element
console.log(names[0]) // Mike
console.log(names[1]) // Paul
console.log(names[2]) // John
// Number of entry in array
console.log(names.length)) // 3
// Get array last element
console.log(names[names.length-1])
// Modify a specific element
names[0] = 'Jack' // replace first entry (Mike) with Jack
//
Array basic methods
names = ['Mike', 'Paul', 'John']
// Add a element to array
names.push('Simon') // ['Mike', 'Paul', 'John', 'Simon']
// Add a element to the beginning
names.unshift('Jack') // ['Jack', 'Mike', 'Paul', 'John', 'Simon']
// Remove last element
names.pop() // ['Jack', 'Mike', 'Paul', 'John']
// Remove first element
names.shift() // ['Mike', 'Paul', 'John']
names = ['Mike', 'Paul', 'John']
// Find element index position
names.indexOf('Paul') // 1
// If elements includes in array
names.includes('Paul') // true
Objects
JavaScript objects are containers for named values, called properties and methods.
// Object declaration
const customer = {
firstName: 'Mike', // String
lastName: 'Tailor', // String
emails: ['mike@exemple.com', 'mike2@gmail.com'], //Array
creditLimit: 2500 // Number
}
// Access object property
console.log(customer.firstName) // Mike
// or
console.log(customer['firstName']) // Mike
// Add property
customer.phone = "800-828-1240"
// or
customer['phone'] = "800-828-1240"
Objects functions
const phone = {
number: '819-204-5678',
extension: '2010',
}
const customer = {
firstName: 'Mike',
lastName: 'Tailor',
phone: phone,
// or short hand (if property same name as value)
phone,
fullName: function() {
// this keyword reference the object calling the method
return this.firstName + ' ' + this.lastName
}
// or the short hand syntax
fullName() {
// this keyword reference the object calling the method
return this.firstName + ' ' + this.lastName
}
}
customer.firstName = 'Mike'
customer.lastName = 'Taylor'
console.log(customer.fullName()) // Mike Taylor
// or
console.log(customer['fullName']() // Mike Taylor
// object keys
const keys = Object.keys(customer)
console.log(keys) // firstName, lastName, phone, fullName
// object values
const values = Object.values(customer)
console.log(keys) // 'Mike', 'Taylor', {number: '819-243-4554', extension: '20'}, function fullName()
Loop
// For Loop keep running until condition is true
for (let i = 1;i <= 10; i++) {
console.log(i)
}
// For Loop : Break and Continue keyword
for (let i = 1;i <= 10; i++) {
if (i === 1) continue // go directly to next interation
if (i === 5) break // stop and exit loop
console.log(i)
}
// Loop within a Array
names = ['Mike', 'Paul', 'John']
for (let i = 0;names.length - 1; i++) {
console.log(names[i])
}
// While loop
let count = 1
while (count <= 10) {
count++
console.log(count)
}
// For of loop
names = ['Mike', 'Paul', 'John']
for (const name of names) {
console.log(name)
}
// For of loop with index (destructuring)
for (const [name, index] of names.entries()) {
console.log(name) // 'Mike'
console.log(index) // 0
}
// Object: keys and values (destructuring)
for (const [key, value] of Object.entries(customer)) {
console.log(key) // firstName
console.log(value) // Mike
}
Conclusion
That's it for part 5. Next day will cover DOM manipulation.
Top comments (0)