The Power of JavaScript: Day 5 - My Journey Continues
Introduction | 30 Days Of JavaScript|
So, let’s fasten our coding capes and venture forth into Day 5, where we’ll unravel the mysteries of JavaScript arrays, tap into the vast potential of objects, and weave our magic with DOM manipulation.
Section 2: Array Methods – Transforming and Manipulating Data
let numbers = [1, 2, 3, 4, 5]; let doubledNumbers = numbers.map((num) => num * 2); // Active Voice: I double each element of the array. console.log(doubledNumbers); // Output: [2, 4, 6, 8, 10]
Here, I’ve used the map method to create a new array, doubled numbers, by doubling each element of the numbers array. In the active voice, I bring clarity to the transformation process.
Section 3: Objects – Crafting Unique Entities
let person = {
name: "Alice",
age: 30,
profession: "Web Developer"
};
console.log(person.name); // Active Voice: I access the name property of the person object (Alice).
console.log(person.age); // Active Voice: I access the age property of the person object (30).Section 4: DOM Manipulation – Breathing Life into Web Pages
let heading = document.getElementById("main-heading");
heading.textContent = "Welcome to My World!"; // Active Voice: I change the text of the heading element.Section 5: Event Handling – Listening to the Call of Users
Example Code:
let button = document.getElementById("my-button");
button.addEventListener("click", () => {
alert("You clicked the button!"); // Active Voice: I respond to the user's click action with an alert.
});Section 6: Asynchronous Programming – Embracing the Promise of Non-Blocking Code
Example Code:
function fetchData() {
return new Promise((resolve, reject) => {
// Simulating data fetching with a timeout
setTimeout(() => {
let data = "Here's your data!";
resolve(data); // Active Voice: I resolve the promise with the fetched data.
}, 2000);
});
fetchData()
.then((data) => {
console.log(data); // Output: "Here's your data!"
});
}Section 7: Error Handling and Debugging – Taming the Unforeseen
try {
// Code that may throw an error
let result = someFunction();
console.log(result); // Active Voice: I display the result of the function.
} catch (error) {
console.error(error); // Active Voice: I handle any errors that occur.
}Conclusion: My Journey to JavaScript Mastery Continues
As the sun sets on Day 5 of my 30-day JavaScript course, I reflect on the beautiful journey I’ve taken. From arrays to objects, DOM manipulation to asynchronous programming, I’ve refined my coding skills and expanded my creative horizons.
My adventure, however, does not finish here. There is still much more magic to discover, obstacles to overcome, and spells to cast. I feel like a true magician when I embrace the power of JavaScript, weaving code with grace and delighting users with mesmerizing online experiences.
So, fellow coders, let us march on, for the adventure has only begun! The JavaScript course has more delights in store for us, and our code spells become more powerful with each passing day.
Read more:https://updategadh.com/javascript/30-days-of-javascript-day-3/
Youtube Video :https://www.youtube.com/watch?v=_JPsTXAAUUo&list=PL92c0di50EKCw-5ugqKhp2rOkGiBslPHI&pp=iAQB
