Arif Iqbal

Posted on

# Week 2 of 100DaysOfCode JavaScript Challenge

### Day 7: Nov 29, 2021. Monday

• Build JavaScript Objects
• Accessing Object Properties: dot notation (`.`) and bracket notation (`[]`)
• Add new properties to JavaScript objects
• Delete Properties from a JavaScript Object using the `delete` keyword
• Using objects for lookup. Convert a switch case statement to a lookup object.
• Testing objects for properties using the `.hasOwnProperty("PROPERTY_NAME")` method
• JavaScript Object Notation (JSON)
• Accessing Nested Objects and Nested Arrays
• Tweet

### Day 8: Nov 30, 2021. Tuesday

• Iterate with JavaScript While Loops
• Iterate with JavaScript For Loops
• Iterate Odd Numbers With a For Loop
• Count Backwards With a For Loop
• Iterate Through an Array with a For Loop
• Nesting For Loops
• Iterate with JavaScript Do...While Loops
• Replace Loops using Recursion
• Tweet

### Day 9: Dec 1, 2021. Wednesday

• Generate Random Fractions with JavaScript: JavaScript's function `Math.random()` can return a random number between `0` (inclusive) and `1` (exclusive). Random numbers are useful for creating random behavior.
• Generate Random Whole Numbers with JavaScript: `Math.random()` will never give you a number greater than or equal to `1`. So, how would you generate random whole numbers? See below
``````Math.floor(Math.random() * 15);
``````

The above code will generate a random whole number between `0` (inclusive) and `15` (exclusive). Here `15` is exclusive because `Math.random()` never returns `1`.

• Generate Random Whole Numbers within a Range: generate a random whole number between `0` and `max - min` and add `min` to it.
• Use the parseInt Function: The `parseInt()` function takes a string and converts it to a number. If the first character of the string can't be converted to a number, then it returns `NaN`. Example
• Use the parseInt Function with a Radix: The `parseInt(Str, Radix)` function can accept a second argument that represent the Raxix or the base of the provided number. Example
• Use the Conditional (Ternary) Operator: The Conditional or Ternary operator is a short-hand form of the `If Else` Block. Example
• Use Multiple Conditional (Ternary) Operators: Like we can chain If Else statements, in the same fashion, we can extend the Ternary operator for multiple conditions. Example
• Use Recursion to Create a Countdown: Keywords: Base Case, Recursive Case, and Callstack
• Use Recursion to Create a Range of Numbers
• Tweet

### Day 10: Dec 02, 2021. Thursday

ES5 (2009) => ES6 (2015)

• Arrow functions, Promises, Modules, and Classes

• Compare Scopes of the `var` and `let` Keywords: `var` scope is global, or local if declared within a function. The `let` keyword has some more features.

• Mutate an Array Declared with `const`: The keyword `const` means you can't reassign a value to the variable declared with the `const`. However, the content of the variable is still mutable. Example (array)

• Prevent Object Mutation: `Object.freeze` strict mode. `const` just stops reassignment. If you want your object to be immutable, pass it to the function `Object.freeze()`

• Use Arrow Functions to Write Concise Anonymous Functions: Simplicity, omit the `function` keyword, omit `return` keyword, omit brackets.

• Write Arrow Functions with Parameters: Simplicity at its peek, omit the parenthesis if only one parameter.

• Set Default Parameters for Your Functions:

• Use the Rest Parameter with Function Parameters

• Tweet

### Day 11: Dec 03, 2021. Friday

• Use the Rest Parameter with Function Parameters:

Rest parameter enables us to pass a variable number of parameters to a functions. the parameters are stored in an array, which later can be used in the function.

We can use the `map()`, `filter()`, `reduce()` methods on the `args`.

The rest parameter (...) eliminates the need for checking the `args` first.

• Use the Spread Operator to Evaluate Arrays In-Place:

The spread operator ...arr works only in-place, meaning in function parameter or in array literal. It unpacks an array elements into a comma separated list

• Use Destructuring Assignment to Extract Values from Objects:

You can consider it as the JavaScript's equivalent of the PHP's `extract(SOME_ASSOC_ARRAY)` function. `const {key1, key2} = SOME_OBJECT;`

• Use Destructuring Assignment to Assign Variables from Objects:

`const {key1: newName, key2: newName2} = SOME_OBJECT;`

• Use Destructuring Assignment to Assign Variables from Nested Objects
• Tweet

### Day 12: Dec 04, 2021. Saturday

• Use Destructuring Assignment to Assign Variables from Arrays:

The difference between the spread operator and array restructuring is that the spread operator unpacks array elements into a comma separated list. So you can't pick an element from that list and assign to a variable. Array destructing does exactly that.

`const [a, b] = [1, 2, 3, 4, 5];`

will assign 1 to a, and 2 to b;

`const [a, b, , , c] = [1, 2, 3, 4, 5];`

will assign 1 to a, 2 to b, and 5 to c. Note that we used commas to skip some elements and reach the desired index.

• Use Destructuring Assignment with the Rest Parameter to Reassign Array Elements

const [a, b, ...arr] = [1, 2, 3, 4, 5]

console.log(a, b); // 1, 2
console.log(arr); // [3, 4, 5]

• Use Destructuring Assignment to Pass an Object as a Function's Parameters
``````const half = ({min, max}) => (min + max) / 2;
``````
• Create Strings using Template Literals:
``````const person = {
name: "Arif",
age: 35
}
console.log(`Hello, my name is \${person.name}!
and I am \${person.age} years old`);
``````
• Write Concise Object Literal Declarations Using Object Property Shorthand
• Tweet

`const mousePosition = (x, y) => ({x, y})`

Thank you for following along with me. Any suggestions/advice for improvement will be appreciated.

~ Happy Coding