Embarking on a #100DaysofCode Journey: Diving into the JavaScript Fundamentals.

Hello, fellow coding enthusiasts! 🚀 Today marks the start of my "100 Days of Code" challenge, and I'm excited to share my journey with you all. My mission? Becoming a skilled full-stack web developer, with a strong focus on mastering the MERN stack. Join me as I dive into this exciting adventure and explore the depths of coding.

Day 1: Unveiling JavaScript's Core Concepts

As I take my first steps on this coding journey, I'm immersing myself in JavaScript—the cornerstone of modern web development. From crafting interactive user interfaces to building feature-rich web applications, JavaScript is the force that makes it all possible.

Below are the concepts that I learned on the 1st Day of My #100daysofcode journey.

Embedding JavaScript in HTML Files

By inserting <script> tags within the <head> or <body> sections, we seamlessly integrate JavaScript code into our web pages.

<!DOCTYPE html>
<html>
<head>
  <title>My JavaScript Journey</title>
  <script src="script.js"></script>
</head>
<body>
  <!-- Your HTML content here -->
</body>
</html>

Variables: Containers of Information

Variables act as containers for storing and managing data. Variables can be declared with the help of var, let, and const keywords.

// Using var (not recommended)
var name = "Alice";

// Using let (preferred for variables that change)
let age = 25;

// Using const (preferred for constants)
const isStudent = true;

Data Types: The Building Blocks

JavaScript supports seven primary data types, which serve as the foundation for working with different kinds of information:

String: Represents textual data and is enclosed in single or double quotes.
```
 let greeting = "Hello, world!";
```
Number: Handles both integer and floating-point numbers.
```
 let age = 25;
 let price = 19.99;
```
Boolean: Represents true or false values, which are fundamental for decision-making.
```
 let isCodingFun = true;
 let isRainyDay = false;
```
Undefined: Represents a variable that has been declared but not assigned a value.
```
 let myVariable;
 console.log(myVariable); // Output: undefined
```
Null: Represents the intentional absence of any value.
```
 let emptyValue = null;
```
Symbol: Generates unique identifiers, often used for object property keys.
```
 const uniqueSymbol = Symbol("description");
```

Object: Represents a collection of key-value pairs, where values can be of any data type.

 let person = {
   name: "Alice",
   age: 30,
   isStudent: false
 };

These are the basic data types in JavaScript. When declaring variables, you typically use the let or const keyword to declare a variable and assign a value to it. Use let when the value of the variable might change, and use const when the value should remain constant.

For example, you can declare a string variable like this:

let message = "Hello, JavaScript!";

Or a number variable:

const numberOfApples = 10;

JavaScript is a dynamically typed language, meaning you don't need to explicitly specify the data type when declaring a variable. The interpreter determines the data type based on the assigned value.

Strings and String Methods:

Strings offer a range of methods that allow us to manipulate and extract information from text. Let's delve into some of these methods:

String methods in JavaScript are powerful tools that allow you to manipulate and work with text data.

length: Returns the length (number of characters) of a string.

 let message = "Hello, world!";
 let length = message.length; // Output: 13

toUpperCase() and toLowerCase(): Converts a string to uppercase or lowercase.

 let text = "Hello, World!";
 let upperText = text.toUpperCase(); // Output: "HELLO, WORLD!"
 let lowerText = text.toLowerCase(); // Output: "hello, world!"

charAt(index): Returns the character at a specific index in the string.

 let word = "JavaScript";
 let character = word.charAt(2); // Output: "v"

indexOf(substring): Finds the index of the first occurrence of a substring in the string.

 let sentence = "Learning JavaScript is fun!";
 let index = sentence.indexOf("JavaScript"); // Output: 9

includes(substring): Checks if a substring exists within the string.

 let phrase = "Coding is exciting!";
 let hasCoding = phrase.includes("Coding"); // Output: true

slice(startIndex, endIndex): Extracts a portion of a string based on the specified indices.

 let originalText = "Hello, world!";
 let extractedText = originalText.slice(7, 12); // Output: "world"

trim(): Removes leading and trailing whitespace from a string.

 let textWithSpaces = "   Hello, world!   ";
 let trimmedText = textWithSpaces.trim(); // Output: "Hello, world!"

split(separator): Splits a string into an array of substrings based on a specified separator.

 let sentence = "JavaScript is awesome!";
 let words = sentence.split(" "); // Output: ["JavaScript", "is", "awesome!"]

Numbers: Crunching the Digits

When it comes to numbers, JavaScript offers various mathematical operations for us to work with.

let x = 10;
let y = 5;

let sum = x + y; // Addition
let difference = x - y; // Subtraction
let product = x * y; // Multiplication
let quotient = x / y; // Division
let remainder = x % y; // Modulus (remainder)

Loose vs. Strict Equality: Understanding Comparison

JavaScript introduces two methods of comparing values for equality: loose and strict equality.

let num1 = 5;
let num2 = "5";

console.log(num1 == num2); // Loose equality (true)
console.log(num1 === num2); // Strict equality (false)

Arrays: Managing Collections

Arrays provide a powerful way to manage collections of data within a single variable.

let fruits = ["apple", "banana", "orange"];
let numbers = [1, 2, 3, 4, 5];

Array Methods

Arrays offer a rich assortment of methods to modify, transform, and interact with array elements:

join(): Join array elements into a string.
indexOf(): Find the index of a specified element.
concat(): Merge two or more arrays together.
push(): Add elements to the end of an array.
pop(): Remove and return the last element of an array.

let fruits = ["apple", "banana", "orange"];
let joinedFruits = fruits.join(", "); // Joining elements

let numbers = [2, 4, 6, 8, 10];
let indexOfSix = numbers.indexOf(6); // Finding the index of 6

Boolean Values and Comparison Operators

Boolean values and comparison operators are fundamental tools for making decisions in programming.

let age = 18;
let isAdult = age >= 18; // true, as 18 is greater than or equal to 18

And there you have it! Day 1 of my coding journey has been enlightening. I'm eagerly looking forward to exploring more of the programming universe. Stay tuned for more exciting updates on my pursuit of learning the MERN stack and becoming a proficient full-stack web developer.

Remember, every line of code written is a step towards mastery. Happy coding! 💻🎉

Connect with me on Twitter