Personal learning reference and code repository for Osama Elzero's comprehensive JavaScript course.
This repository contains structured practice files, notes, and examples for all 188 lessons of the course.
Click any section below to jump to its lessons:
| # | Section | Lessons | Quick Link |
|---|---|---|---|
| 01 | Introduction & Syntax | 9 lessons | 01-Introduction-And-Syntax/ |
| 02 | Data Types & Variables | 8 lessons | 02-Data-Types-And-Variables/ |
| 03 | Operators | 5 lessons | 03-Operators/ |
| 04 | Number & String | 8 lessons | 04-Number-And-String/ |
| 05 | Conditions & Switch | 9 lessons | 05-Conditions-And-Switch/ |
| 06 | Arrays & Methods | 8 lessons | 06-Arrays-And-Methods/ |
| 07 | Loops | 9 lessons | 07-Loops/ |
| 08 | Functions & Parameters | 7 lessons | 08-Functions-And-Parameters/ |
| 09 | Functions & Scopes | 7 lessons | 09-Functions-And-Scopes/ |
| 10 | Higher Order Functions | 8 lessons | 10-Higher-Order-Functions/ |
| 11 | Objects & Methods | 7 lessons | 11-Objects-And-Methods/ |
| 12 | DOM | 16 lessons | 12-DOM/ |
| 13 | BOM | 9 lessons | 13-BOM/ |
| 14 | Local Storage | 4 lessons | 14-Local-Storage/ |
| 15 | Destructuring | 8 lessons | 15-Destructuring/ |
| 16 | Map & Set | 11 lessons | 16-Map-And-Set/ |
| 17 | Regular Expression | 13 lessons | 17-Regular-Expression/ |
| 18 | OOP | 12 lessons | 18-OOP/ |
| 19 | Date, Generators, Modules | 10 lessons | 19-Date-Generators-Modules/ |
| 20 | AJAX & JSON | 10 lessons | 20-AJAX-And-JSON/ |
| 21 | Promises | 10 lessons | 21-Promises/ |
Each lesson folder contains:
script.js- Practice file with code examples and exercisesREADME.md- Lesson notes, concepts, and personal insights
JavaScript-Course-Reference/
├── 📂 01-Introduction-And-Syntax/
│ ├── 📂 01-Introduction-And-What-Is-JavaScript/
│ │ ├── 📄 script.js
│ │ └── 📄 README.md
│ ├── 📂 02-How-To-Study-The-Course/
│ └── ...
├── 📂 02-Data-Types-And-Variables/
├── 📂 03-Operators/
└── ... (21 sections total)
9 Lessons | Folder: 01-Introduction-And-Syntax/
| # | Lesson | Folder |
|---|---|---|
| 01 | Introduction And What Is JavaScript | 01-Introduction-And-What-Is-JavaScript/ |
| 02 | How To Study The Course | 02-How-To-Study-The-Course/ |
| 03 | Setting Up Environment And Tools | 03-Setting-Up-Environment-And-Tools/ |
| 04 | Work With Chrome Developer Tools | 04-Work-With-Chrome-Developer-Tools/ |
| 05 | Where To Put The Code | 05-Where-To-Put-The-Code/ |
| 06 | Comments And Bad Practice | 06-Comments-And-Bad-Practice/ |
| 07 | Output To Screen | 07-Output-To-Screen/ |
| 08 | Console Methods And Styling And Web API | 08-Console-Methods-And-Styling-And-Web-API/ |
| 09 | What Is ECMAScript | 09-What-Is-ECMAScript/ |
8 Lessons | Folder: 02-Data-Types-And-Variables/
| # | Lesson | Folder |
|---|---|---|
| 10 | Data Types And typeof Operator | 01-Data-Types-And-typeof-Operator/ |
| 11 | Variables Introduction | 02-Variables-Introduction/ |
| 12 | Identifiers Name Conventions And Rules | 03-Identifiers-Name-Conventions-And-Rules/ |
| 13 | Var Let Const Compare | 04-Var-Let-Const-Compare/ |
| 14 | String Syntax And Character Escape Sequences | 05-String-Syntax-And-Character-Escape-Sequences/ |
| 15 | Concatenation | 06-Concatenation/ |
| 16 | Template Literals (Template Strings) | 07-Template-Literals-Template-Strings/ |
| 17 | Variables And Concatenation Challenge | 08-Variables-And-Concatenation-Challenge/ |
5 Lessons | Folder: 03-Operators/
| # | Lesson | Folder |
|---|---|---|
| 18 | Arithmetic Operators | 01-Arithmetic-Operators/ |
| 19 | Unary Plus And Negation Operators | 02-Unary-Plus-And-Negation-Operators/ |
| 20 | Type Coercion | 03-Type-Coercion/ |
| 21 | Assignment Operators | 04-Assignment-Operators/ |
| 22 | Operators Challenges | 05-Operators-Challenges/ |
8 Lessons | Folder: 04-Number-And-String/
| # | Lesson | Folder |
|---|---|---|
| 23 | Number | 01-Number/ |
| 24 | Number Methods | 02-Number-Methods/ |
| 25 | Math Object | 03-Math-Object/ |
| 26 | Number Challenge | 04-Number-Challenge/ |
| 27 | String Methods Part 1 | 05-String-Methods-Part-1/ |
| 28 | String Methods Part 2 | 06-String-Methods-Part-2/ |
| 29 | String Methods Part 3 | 07-String-Methods-Part-3/ |
| 30 | String Challenge | 08-String-Challenge/ |
9 Lessons | Folder: 05-Conditions-And-Switch/
| # | Lesson | Folder |
|---|---|---|
| 31 | Comparison Operators | 01-Comparison-Operators/ |
| 32 | Logical Operators | 02-Logical-Operators/ |
| 33 | If Condition | 03-If-Condition/ |
| 34 | Nested If Condition | 04-Nested-If-Condition/ |
| 35 | Conditional Ternary Operator | 05-Conditional-Ternary-Operator/ |
| 36 | Nullish Coalescing Operator | 06-Nullish-Coalescing-Operator/ |
| 37 | If Condition Challenge | 07-If-Condition-Challenge/ |
| 38 | Switch Statement | 08-Switch-Statement/ |
| 39 | Switch And If Condition Challenge | 09-Switch-And-If-Condition-Challenge/ |
8 Lessons | Folder: 06-Arrays-And-Methods/
| # | Lesson | Folder |
|---|---|---|
| 40 | Array Big Introduction | 01-Array-Big-Introduction/ |
| 41 | Using Length With Array | 02-Using-Length-With-Array/ |
| 42 | Add And Remove From Array | 03-Add-And-Remove-From-Array/ |
| 43 | Searching Array | 04-Searching-Array/ |
| 44 | Sorting Array | 05-Sorting-Array/ |
| 45 | Slicing Array | 06-Slicing-Array/ |
| 46 | Joining Arrays | 07-Joining-Arrays/ |
| 47 | Array Challenge | 08-Array-Challenge/ |
9 Lessons | Folder: 07-Loops/
| # | Lesson | Folder |
|---|---|---|
| 48 | Loop For And Concept Of Loop | 01-Loop-For-And-Concept-Of-Loop/ |
| 49 | Looping On Sequences | 02-Looping-On-Sequences/ |
| 50 | Nested Loops And Trainings | 03-Nested-Loops-And-Trainings/ |
| 51 | Loop Control - Continue, Break, Label | 04-Loop-Control-Continue-Break-Label/ |
| 52 | Loop For Advanced Examples | 05-Loop-For-Advanced-Examples/ |
| 53 | Practice - Add Products To Page | 06-Practice-Add-Products-To-Page/ |
| 54 | Loop - While | 07-Loop-While/ |
| 55 | Loop - Do, While | 08-Loop-Do-While/ |
| 56 | Loop Challenge | 09-Loop-Challenge/ |
7 Lessons | Folder: 08-Functions-And-Parameters/
| # | Lesson | Folder |
|---|---|---|
| 57 | Function Intro And Basic Usage | 01-Function-Intro-And-Basic-Usage/ |
| 58 | Function Advanced Examples | 02-Function-Advanced-Examples/ |
| 59 | Function Return Statement And Use Cases | 03-Function-Return-Statement-And-Use-Cases/ |
| 60 | Function Default Parameters | 04-Function-Default-Parameters/ |
| 61 | Function Rest Parameters | 05-Function-Rest-Parameters/ |
| 62 | Function Ultimate Practice | 06-Function-Ultimate-Practice/ |
| 63 | Random Arguments Function Challenge | 07-Random-Arguments-Function-Challenge/ |
7 Lessons | Folder: 09-Functions-And-Scopes/
| # | Lesson | Folder |
|---|---|---|
| 64 | Anonymous Function And Practice | 01-Anonymous-Function-And-Practice/ |
| 65 | Return Nested Function | 02-Return-Nested-Function/ |
| 66 | Arrow Function Syntax | 03-Arrow-Function-Syntax/ |
| 67 | Scope - Global And Local | 04-Scope-Global-And-Local/ |
| 68 | Scope - Block | 05-Scope-Block/ |
| 69 | Scope - Lexical (Static) | 06-Scope-Lexical-Static/ |
| 70 | Arrow Function Challenge | 07-Arrow-Function-Challenge/ |
8 Lessons | Folder: 10-Higher-Order-Functions/
| # | Lesson | Folder |
|---|---|---|
| 71 | Higher Order Functions - Map | 01-Higher-Order-Functions-Map/ |
| 72 | Higher Order Functions - Map Practice | 02-Higher-Order-Functions-Map-Practice/ |
| 73 | Higher Order Functions - Filter | 03-Higher-Order-Functions-Filter/ |
| 74 | Higher Order Functions - Filter Practice | 04-Higher-Order-Functions-Filter-Practice/ |
| 75 | Higher Order Functions - Reduce | 05-Higher-Order-Functions-Reduce/ |
| 76 | Higher Order Functions - Reduce Practice | 06-Higher-Order-Functions-Reduce-Practice/ |
| 77 | Higher Order Functions - ForEach & Practice | 07-Higher-Order-Functions-ForEach-And-Practice/ |
| 78 | Higher Order Functions - Challenge | 08-Higher-Order-Functions-Challenge/ |
7 Lessons | Folder: 11-Objects-And-Methods/
| # | Lesson | Folder |
|---|---|---|
| 79 | Object - Introduction | 01-Object-Introduction/ |
| 80 | Dot Notation vs Bracket Notation | 02-Dot-Notation-vs-Bracket-Notation/ |
| 81 | Nested Object And Advanced Examples | 03-Nested-Object-And-Advanced-Examples/ |
| 82 | Create Object With New Keyword | 04-Create-Object-With-New-Keyword/ |
| 83 | This Keyword | 05-This-Keyword/ |
| 84 | Create Object With Create Method | 06-Create-Object-With-Create-Method/ |
| 85 | Create Object With Assign Method | 07-Create-Object-With-Assign-Method/ |
16 Lessons | Folder: 12-DOM/
| # | Lesson | Folder |
|---|---|---|
| 86 | What Is DOM And Select Elements | 01-What-Is-DOM-And-Select-Elements/ |
| 87 | Get, Set Elements And Attributes | 02-Get-Set-Elements-And-Attributes/ |
| 88 | Check Attributes And Examples | 03-Check-Attributes-And-Examples/ |
| 89 | Create And Append Elements | 04-Create-And-Append-Elements/ |
| 90 | Product With Title And Description Practice | 05-Product-With-Title-And-Description-Practice/ |
| 91 | Deal With Children | 06-Deal-With-Children/ |
| 92 | DOM Events | 07-DOM-Events/ |
| 93 | Validate Form And Prevent Default | 08-Validate-Form-And-Prevent-Default/ |
| 94 | Event Simulation - Click, Focus, Blur | 09-Event-Simulation-Click-Focus-Blur/ |
| 95 | ClassList Object And Methods | 10-ClassList-Object-And-Methods/ |
| 96 | CSS Styling And Stylesheet | 11-CSS-Styling-And-Stylesheet/ |
| 97 | Before, After, Prepend, Append, Remove | 12-Before-After-Prepend-Append-Remove/ |
| 98 | DOM Traversing | 13-DOM-Traversing/ |
| 99 | DOM Cloning | 14-DOM-Cloning/ |
| 100 | AddEventListener | 15-AddEventListener/ |
| 101 | DOM Challenge | 16-DOM-Challenge/ |
9 Lessons | Folder: 13-BOM/
| # | Lesson | Folder |
|---|---|---|
| 102 | What Is BOM | 01-What-Is-BOM/ |
| 103 | Alert, Confirm, Prompt | 02-Alert-Confirm-Prompt/ |
| 104 | setTimeout And clearTimeout | 03-setTimeout-And-clearTimeout/ |
| 105 | setInterval And clearInterval | 04-setInterval-And-clearInterval/ |
| 106 | Window Location Object | 05-Window-Location-Object/ |
| 107 | Window Open And Close | 06-Window-Open-And-Close/ |
| 108 | Window History Object | 07-Window-History-Object/ |
| 109 | Scroll, ScrollTo, ScrollBy, Focus, Print, Stop | 08-Scroll-ScrollTo-ScrollBy-Focus-Print-Stop/ |
| 110 | Scroll To Top Using ScrollY | 09-Scroll-To-Top-Using-ScrollY/ |
4 Lessons | Folder: 14-Local-Storage/
| # | Lesson | Folder |
|---|---|---|
| 111 | Local Storage | 01-Local-Storage/ |
| 112 | Local Storage Color App Practice | 02-Local-Storage-Color-App-Practice/ |
| 113 | Session Storage And Use Cases | 03-Session-Storage-And-Use-Cases/ |
| 114 | BOM Challenge | 04-BOM-Challenge/ |
8 Lessons | Folder: 15-Destructuring/
| # | Lesson | Folder |
|---|---|---|
| 115 | Destructuring Arrays Part 1 | 01-Destructuring-Arrays-Part-1/ |
| 116 | Destructuring Arrays Part 2 | 02-Destructuring-Arrays-Part-2/ |
| 117 | Destructuring Arrays Part 3 Swapping Variables | 03-Destructuring-Arrays-Part-3-Swapping-Variables/ |
| 118 | Destructuring Objects Part 1 | 04-Destructuring-Objects-Part-1/ |
| 119 | Destructuring Objects Part 2 | 05-Destructuring-Objects-Part-2/ |
| 120 | Destructuring Function Parameters | 06-Destructuring-Function-Parameters/ |
| 121 | Destructuring Mixed Content | 07-Destructuring-Mixed-Content/ |
| 122 | Destructuring Challenge | 08-Destructuring-Challenge/ |
11 Lessons | Folder: 16-Map-And-Set/
| # | Lesson | Folder |
|---|---|---|
| 123 | Set Data Type And Methods | 01-Set-Data-Type-And-Methods/ |
| 124 | Set vs WeakSet And Garbage Collector | 02-Set-vs-WeakSet-And-Garbage-Collector/ |
| 125 | Map Data Type vs Object | 03-Map-Data-Type-vs-Object/ |
| 126 | Map Methods | 04-Map-Methods/ |
| 127 | Map vs WeakMap | 05-Map-vs-WeakMap/ |
| 128 | Array.from Method | 06-Array-from-Method/ |
| 129 | Array.copyWithin Method | 07-Array-copyWithin-Method/ |
| 130 | Array.some Method | 08-Array-some-Method/ |
| 131 | Array.every Method | 09-Array-every-Method/ |
| 132 | Spread Syntax And Use Cases | 10-Spread-Syntax-And-Use-Cases/ |
| 133 | Map And Set Challenge | 11-Map-And-Set-Challenge/ |
13 Lessons | Folder: 17-Regular-Expression/
| # | Lesson | Folder |
|---|---|---|
| 134 | Intro And What Is Regular Expression | 01-Intro-And-What-Is-Regular-Expression/ |
| 135 | Regular Expression - Modifiers | 02-Regular-Expression-Modifiers/ |
| 136 | Regular Expression - Ranges Part 1 | 03-Regular-Expression-Ranges-Part-1/ |
| 137 | Regular Expression - Ranges Part 2 | 04-Regular-Expression-Ranges-Part-2/ |
| 138 | Regular Expression - Character Classes Part 1 | 05-Regular-Expression-Character-Classes-Part-1/ |
| 139 | Regular Expression - Character Classes Part 2 | 06-Regular-Expression-Character-Classes-Part-2/ |
| 140 | Regular Expression - Quantifiers Part 1 | 07-Regular-Expression-Quantifiers-Part-1/ |
| 141 | Regular Expression - Quantifiers Part 2 | 08-Regular-Expression-Quantifiers-Part-2/ |
| 142 | Regular Expression - Quantifiers Part 3 | 09-Regular-Expression-Quantifiers-Part-3/ |
| 143 | Regular Expression - Replace With Pattern | 10-Regular-Expression-Replace-With-Pattern/ |
| 144 | Regular Expression - Form Validation | 11-Regular-Expression-Form-Validation/ |
| 145 | Test Your Regular Expression | 12-Test-Your-Regular-Expression/ |
| 146 | Regular Expression - Challenge | 13-Regular-Expression-Challenge/ |
12 Lessons | Folder: 18-OOP/
| # | Lesson | Folder |
|---|---|---|
| 147 | OOP Introduction | 01-OOP-Introduction/ |
| 148 | Constructor Function Introduction | 02-Constructor-Function-Introduction/ |
| 149 | Constructor Function New Syntax | 03-Constructor-Function-New-Syntax/ |
| 150 | Deal With Properties And Methods | 04-Deal-With-Properties-And-Methods/ |
| 151 | Update Properties And Built In Constructors | 05-Update-Properties-And-Built-In-Constructors/ |
| 152 | Class Static Properties And Methods | 06-Class-Static-Properties-And-Methods/ |
| 153 | Class Inheritance | 07-Class-Inheritance/ |
| 154 | Class Encapsulation | 08-Class-Encapsulation/ |
| 155 | Prototype Introduction | 09-Prototype-Introduction/ |
| 156 | Add To Prototype Chain | 10-Add-To-Prototype-Chain/ |
| 157 | Object Meta Data And Descriptor Part 1 | 11-Object-Meta-Data-And-Descriptor-Part-1/ |
| 158 | Object Meta Data And Descriptor Part 2 | 12-Object-Meta-Data-And-Descriptor-Part-2/ |
10 Lessons | Folder: 19-Date-Generators-Modules/
| # | Lesson | Folder |
|---|---|---|
| 159 | Date And Time Introduction | 01-Date-And-Time-Introduction/ |
| 160 | Get Date And Time | 02-Get-Date-And-Time/ |
| 161 | Set Date And Time | 03-Set-Date-And-Time/ |
| 162 | Formatting Date And Time | 04-Formatting-Date-And-Time/ |
| 163 | Tracking Operations Time | 05-Tracking-Operations-Time/ |
| 164 | Generator Function Introduction | 06-Generator-Function-Introduction/ |
| 165 | Delegate Generator Function | 07-Delegate-Generator-Function/ |
| 166 | Generate Infinite Numbers | 08-Generate-Infinite-Numbers/ |
| 167 | Module Import And Export | 09-Module-Import-And-Export/ |
| 168 | Named vs Default Export And Import All | 10-Named-vs-Default-Export-And-Import-All/ |
10 Lessons | Folder: 20-AJAX-And-JSON/
| # | Lesson | Folder |
|---|---|---|
| 169 | What Is JSON | 01-What-Is-JSON/ |
| 170 | JSON Syntax And Compare With JS Object | 02-JSON-Syntax-And-Compare-With-JS-Object/ |
| 171 | What Is API | 03-What-Is-API/ |
| 172 | Parse And Stringify | 04-Parse-And-Stringify/ |
| 173 | Asynchronous vs Synchronous Programming | 05-Asynchronous-vs-Synchronous-Programming/ |
| 174 | Call Stack And Web API | 06-Call-Stack-And-Web-API/ |
| 175 | Event Loop And Callback Queue | 07-Event-Loop-And-Callback-Queue/ |
| 176 | What Is AJAX And Network Informations | 08-What-Is-AJAX-And-Network-Informations/ |
| 177 | Request And Response From Real API | 09-Request-And-Response-From-Real-API/ |
| 178 | Loop On Data | 10-Loop-On-Data/ |
10 Lessons | Folder: 21-Promises/
| # | Lesson | Folder |
|---|---|---|
| 179 | Callback Hell Or Pyramid Of Doom | 01-Callback-Hell-Or-Pyramid-Of-Doom/ |
| 180 | Promise Intro And Syntax | 02-Promise-Intro-And-Syntax/ |
| 181 | Promise - Then, Catch And Finally | 03-Promise-Then-Catch-And-Finally/ |
| 182 | Promise And XHR | 04-Promise-And-XHR/ |
| 183 | Fetch API | 05-Fetch-API/ |
| 184 | Promise - All, All Settled And Race | 06-Promise-All-All-Settled-And-Race/ |
| 185 | Async And Trainings | 07-Async-And-Trainings/ |
| 186 | Await And Trainings | 08-Await-And-Trainings/ |
| 187 | Try, Catch, Finally With Fetch | 09-Try-Catch-Finally-With-Fetch/ |
| 188 | The End And Advices | 10-The-End-And-Advices/ |
- Navigate to the section you want to study
- Open the lesson folder
- Read the
README.mdfor concepts and notes - Practice in the
script.jsfile - Add your own examples and experiments
- Use Ctrl+F (or Cmd+F) to search for specific topics
- Check the Quick Navigation table above
- Each lesson is numbered to match the course
- Each
script.jscontains space for your code - Modify examples to test your understanding
- Build upon the provided exercises
Each lesson's README.md includes:
- Concepts Covered - Bullet list of key topics
- Explanation - Detailed explanation of the concepts
- Example Code - Code examples from the lesson
- Notes - Personal notes and key takeaways
- Course Playlist: Elzero Web School - JavaScript Playlist
- Elzero Website: Elzero.org
- Instructor: Osama Elzero
- 01-Introduction-And-Syntax (9/9)
- 02-Data-Types-And-Variables (8/8)
- 03-Operators (5/5)
- 04-Number-And-String (8/8)
- 05-Conditions-And-Switch (9/9)
- 06-Arrays-And-Methods (8/8)
- 07-Loops (9/9)
- 08-Functions-And-Parameters (7/7)
- 09-Functions-And-Scopes (7/7)
- 10-Higher-Order-Functions (8/8)
- 11-Objects-And-Methods (7/7)
- 12-DOM (16/16)
- 13-BOM (9/9)
- 14-Local-Storage (4/4)
- 15-Destructuring (8/8)
- 16-Map-And-Set (11/11)
- 17-Regular-Expression (13/13)
- 18-OOP (12/12)
- 19-Date-Generators-Modules (10/10)
- 20-AJAX-And-JSON (10/10)
- 21-Promises (10/10)
This is a personal learning repository, but if you find any issues or improvements:
- Fork the repository
- Create a feature branch
- Submit a pull request
This repository is for educational purposes. Course content belongs to Elzero Web School.
Happy Learning! 🚀
Tip: Bookmark this README and use it as your learning dashboard!