Learn JavaScript

1. Download Free eBook: https://codingwithbasir.com/download
2. Fork and Clone This repository
3. Code Project A1
4. Send a Pull Request
5. Let me know to review your code: [email protected]

INTRODUCTION

Project A1 Marksheet

• Console
• Comments
• Data Types
• Arithmetic Operators
• String Concatenation
• Properties
• Methods
• Built-in Objects

VARIABLES

Project B1 College Cost Calculator

• Create a Variable: var
• Create a Variable: let
• Create a Variable: const
• Mathematical Assignment Operators
• The Increment and Decrement Operator
• String Concatenation with Variables
• String Interpolation
• typeof operator

CONDITIONAL STATEMENTS

Project C1 Dog Food Recommender

• The if keyword
• If...Else Statements
• Comparison Operators
• Logical Operators
• Truthy and Falsy
• Truthy and Falsy Assignment
• Ternary Operator
• Else If Statements
• The switch keyword
• Review

FUNCTIONS

Project D1 Date Formatter

• Function Declarations
• Calling a Function
• Parameters and Arguments
• Default Parameters
• Return
• Helper Functions
• Function Expressions
• Arrow Functions
• Concise Body Arrow Functions
• Review Functions

SCOPE

Project E1 Color Picker

• Blocks and Scope
• Global Scope
• Block Scope
• Scope Pollution
• Practice Good Scoping

ARRAYS

Project F1 Shoes Shop

• Create an Array
• Accessing Elements
• Update Elements
• Arrays with let and const
• The .length property
• The .push() Method
• The .pop() Method
• More Array Methods
• Arrays and Functions
• Nested Arrays
• Review Arrays

LOOPS

Project G1 Shopping List

• Repeating Tasks Manually
• The For Loop
• Looping in Reverse
• Looping through Arrays
• Nested Loops
• The While Loop
• Do...While Statements
• The break Keyword

HIGHER-ORDER FUNCTIONS

Project H1 Functions Benchmark

• Functions as Data
• Functions as Parameters

ITERATORS

Project I1 Good Mood Actions

• The .forEach() Method
• The .map() Method
• The .filter() Method
• The .findIndex() Method
• The .reduce() Method
• Iterator Documentation
• Choose the Right Iterator

OBJECTS

Project I1 Employee

• Creating Object Literals
• Accessing Properties
• Bracket Notation
• Property Assignment
• Methods
• Nested Objects
• Pass By Reference
• Looping Through Objects

ADVANCED OBJECTS

Wil be soon

• The this Keyword
• Arrow Functions and this
• Privacy
• Getters
• Setters
• Factory Functions
• Property Value Shorthand
• Destructured Assignment
• Built-in Object Methods

CLASSES

Wil be soon

• Constructor
• Instance
• Methods
• Method Calls
• Inheritance I
• Inheritance II
• Inheritance III
• Inheritance IV
• Inheritance V
• Static Methods

BROWSER COMPATIBILITY AND TRANSPILATION

Wil be soon

• Finding browser compatibility
• Why ES6?
• Transpilation With Babel
• npm init
• Install Node Packages
• .babelrc
• Babel Source Lib
• Build

MODULES

Wil be soon

• Hello Modules
• Module.exports I
• require()
• module.exports II
• export default
• import
• Named Exports
• Named Imports
• Export Named Exports
• Import Named Imports
• Export as
• Import as
• Combining Export Statements
• Combining Import Statements

PROMISES

Wil be soon

• What is a Promise?
• Constructing a Promise Object
• The Node setTimeout() Function
• Consuming Promises
• The onFulfilled and onRejected Functions
• Using catch() with Promises
• Chaining Multiple Promises
• Avoiding Common Mistakes
• Using Promise.all()

ASYNC AWAIT

Wil be soon

• The async Keyword
• Writing async Functions
• Handling Dependent Promises
• Handling Errors
• Handling Independent Promises
• Await Promise.all()

REQUESTS

Wil be soon

• HTTP Requests
• XHR GET Requests
• XHR POST Requests

REQUESTS WITH ES6

• fetch() GET Requests
• fetch() POST Requests
• async GET Requests
• async POST Requests

THE SCRIPT ELEMENT

Wil be soon

• The <script> tag
• The src attribute
• How are scripts loaded?
• Defer attribute
• Async attribute

DOCUMENT OBJECT MODEL

Wil be soon

• The DOM as a Tree Structure
• Parent Child Relationships in the DOM
• Nodes and Elements in the DOM
• Attributes of Element Node

JAVASCRIPT AND THE DOM

Wil be soon

• The document keyword
• Tweak an Element
• Select and Modify Elements
• Style an element
• Create and Insert Elements
• Remove an Element
• Interactivity with onclick
• Traversing the DOM

DOM EVENTS

Wil be soon

• What is an Event?
• "Firing" Events
• Event Handler Registration
• Adding Event Handlers
• Removing Event Handlers
• Event Object Properties
• Event Types
• Mouse Events
• Keyboard Events