Learning JS - 2

Learning JS - 2

·

4 min read

16/06/2023

Day 2 of Coding

Day 2 of JavaScript

I'm learning JavaScript. Starting from scratch, as I'm new to JS. I'm currently a student studying Computer Science Engineering.

Feel free to discuss any topic I post. Feel free to discuss related projects/code/ideas/interesting concepts related to the topic.

I'm going to keep track of my progress here, mainly to keep track of my progress. I couldn't do much today. Got sidetracked by guests showing up at our house.

Start Date : 12/07/23

Learning from FreeCodeCamp :

Here's a summary of what I learnt today:

  • Let vs Var vs Const

KEYWORDSCOPEREDECLARATION & REASSIGNMENTHOISTING
varGlobal, Localyes & yesyes, with a default value
letGlobal, Local, Blockno & yesyes, without a default value
constGlobal, Local, Blockno & noyes, without a default value
  • Object.freeze()

    To ensure your data doesn't change, JavaScript provides a function Object.freeze to prevent data mutation.

    Any attempt at changing the object will be rejected, with an error thrown if the script is running in strict mode.

    Syntax:

    Object.freeze(obj);

  • Arrow Functions

    In JavaScript, we often don't need to name our functions, especially when passing a function as an argument to another function. Instead, we create inline functions. We don't need to name these functions because we do not reuse them anywhere else.

    Syntax:

    const myFunc = () => { const myVar = "value"; return myVar; }

    Just like a regular function, you can pass arguments into an arrow function.

    It is possible to pass more than one argument into an arrow function.

  • Default Parameters for Functions

    The default parameter is a way to set default values for function parameters. Default value is undefined. In a function, Ii a parameter is not provided, then its value becomes undefined. In this case, the default value that we specify is applied by the compiler.

  • Rest Parameter with Function Parameters

    The rest parameter for function parameters. With the rest parameter, you can create functions that take a variable number of arguments. These arguments are stored in an array that can be accessed later from inside the function.

  • Use the Spread Operator to Evaluate Arrays In-Place

    The spread operator, which allows us to expand arrays and other expressions in places where multiple parameters or elements are expected.

    ...arr returns an unpacked array. In other words, it spreads the array. However, the spread operator only works in-place, like in an argument to a function or in an array literal.

  • Destructuring Assignment to Extract Values from Objects

    Destructuring assignment is special syntax introduced in ES6, for neatly assigning values taken directly from an object.

    Syntax:

  • const { name, age } = user;

    Here, the name and age variables will be created and assigned the values of their respective values from the user object.

  • const { name: userName, age: userAge } = user;

    You may read it as "get the value of user.name and assign it to a new variable named userName" and so on.

  • Destructuring Assignment to Assign Variables from Nested Objects

    Destructuring assignment is special syntax introduced in ES6, for neatly assigning values taken directly from an object.

    Syntax:

    Here's how to extract the values of object properties and assign them to variables with the same name:

    const { johnDoe: { age, email }} = user;

    And here's how you can assign an object properties' values to variables with different names:

    const { johnDoe: { age: userAge, email: userEmail }} = user;

  • Destructuring Assignment to Assign Variables from Arrays

    One key difference between the spread operator and array destructuring is that the spread operator unpacks all contents of an array into a comma-separated list. Consequently, you cannot pick or choose which elements you want to assign to variables.

    Destructuring an array lets us do exactly that.

    Syntax:

    const [a, b] = [1, 2, 3, 4, 5, 6]; console.log(a, b);

    The console will display the values of a and b as 1, 2.

    The variable a is assigned the first value of the array, and b is assigned the second value of the array.

    We can also access the value at any index in an array with destructuring by using commas to reach the desired index:

    const [a, b,,, c] = [1, 2, 3, 4, 5, 6]; console.log(a, b, c);

    The console will display the values of a, b, and c as 1, 2, 5.