DEV Community

Cover image for Day 1 of the #100daysofMiva Challenge.
Damilola Oyeyipo
Damilola Oyeyipo

Posted on

Day 1 of the #100daysofMiva Challenge.

Day 1 of the 100 Days Challenge

Date: 8/21/2024

Objective: To learn and understand variables, logical operations, and data types in JavaScript, solve a mathematical problem using JavaScript, and begin learning about event listeners and conditional statements.

1. Introduction to JavaScript Variables

Today, I started my journey into JavaScript by learning about variables. A variable in JavaScript is like a container that holds data, which can be a number, a piece of text, or any other type of value. I learned how to declare a variable using the let, const, and var keywords.

  • let allows you to create a variable that can change later.
  • const creates a variable that cannot be reassigned.
  • var is an older way of declaring variables but is still used.

Image description

2. Understanding Logical Operations and Data Types

Next, I explored logical operations, which are used to make decisions in JavaScript. I learned about the basic logical operators:

I also learned about different data types such as:

Image description

3. Solving a Mathematical Problem with JavaScript

I applied my knowledge of variables and data types to solve a simple mathematical problem. The problem was to calculate the area of a rectangle given its width and height.

Image description

4. Introduction to Event Listeners

Moving on, I began learning about event listeners. An event listener is a function that waits for a specific event to occur, such as a user clicking a button, and then triggers some action.

In Simple Terms:
Event listeners allow JavaScript to respond to user actions on a webpage, like clicking a button, typing in a text box, or hovering over an element.

Image description

When not click

Image description

When it is clicked it will show loading data.. then end up showing "Data Loaded Via Callback"

Image description

This is the work of an event listener In javascript

5. Understanding Conditional Statements

I also learned about conditional statements, which allow me to make decisions in my code. A conditional statement checks whether a condition is true or false and then executes a block of code based on the result.

Image description

Image description

6 Understanding While Loops and For Loops in JavaScript

While Loop:
A while loop in JavaScript keeps executing a block of code as long as a specified condition is true. I tried hard to grasp this concept by imagining it as someone repeatedly asking a question until they got the right answer.

Simple Definition:
A while loop continues to run as long as a certain condition remains true.

Example:

let number = 1;

while (number <= 5) {
    console.log(number);
    number++;
}
Enter fullscreen mode Exit fullscreen mode

In this example, the loop starts with number = 1 and keeps running if number is less than or equal to 5. It prints the value of number and then increases it by 1 each time.

For Loop:
A for loop is similar to a while loop but is usually more concise and easier to write when you know how many times you want to run the loop.

Simple Definition:
A for loop repeats a block of code a specific number of times.

Example:

for (let i = 1; i <= 5; i++) {
    console.log(i);
}
Enter fullscreen mode Exit fullscreen mode

In this for loop, i starts at 1 and increases by 1 after each loop until it reaches 5. The loop runs 5 times, just like the while loop.

Difference Between While and For Loops:

  • While Loop: Best when you don't know how many times the loop should run, but you have a condition to check.
  • For Loop: Best when you know exactly how many times the loop should run.

Scenario:
Imagine you’re flipping a coin. You want to keep flipping until you get heads. Since you don’t know how many flips it will take, you’d use a while loop to keep flipping until you get heads.

Now, if you want to flip the coin exactly 5 times, you’d use a for loop because you know you need exactly 5 flips, no matter the outcome.

In summary:

  • While Loop: Keeps flipping until you get heads.
  • For Loop: Flips the coin exactly 5 times.

Understanding loops took some effort, but this exercise helped me see how they are useful in repeating tasks efficiently in my code.

Image description

My Experience

I was so frustrated and stressed out. It was really getting to me, to the point where I almost felt like smashing my PC. It was just so overwhelming! Can you please help me figure out where it all went wrong?....πŸ€¦β€β™‚οΈπŸ€¦β€β™‚οΈπŸ€¦β€β™‚οΈπŸ€¦β€β™‚οΈ, I had to deal with so many bugs, and debugging it was just adding to my stress. But I decided to take a break, reset my mind, and finally figured out the problem. I kept telling myself that I could be the best version of myself, no matter what.

But javascript...πŸ˜“πŸ˜“πŸ˜“πŸ˜’

Image description

Image description

Conclusion

Day 1 was productive as I laid a solid foundation in JavaScript by learning about variables, logical operations, data types, and conditional statements. I also started exploring how JavaScript interacts with user actions through event listeners. I'm excited to continue this journey and deepen my understanding of JavaScript in the future.

Image description

Please like, share, subscribe, and follow up for more, and also comment on what drink I should take for this javascript hamburger...lolπŸ˜‚πŸ˜‚πŸ€²

Top comments (7)

Collapse
 
marvellye profile image
Ezekiel Marvellous

This is well detailed πŸ‘πŸ»
Your tour made JS sound fun. I'm looking forward to Day 2

Collapse
 
damilola_oyeyipo_1348716f profile image
Damilola Oyeyipo

Thank you sir

Collapse
 
mayowakalejaiye profile image
mayowa-kalejaiye

Maybe I’ll even start mine (python) today lol

Collapse
 
damilola_oyeyipo_1348716f profile image
Damilola Oyeyipo

Lolz πŸ˜‚

Collapse
 
mayowakalejaiye profile image
mayowa-kalejaiye

Super

Collapse
 
tobidelly profile image
TD!

Well done

Collapse
 
damilola_oyeyipo_1348716f profile image
Damilola Oyeyipo

Thank you sir