Add comprehensive code examples for JavaScript concepts

HACKTOBERFEST_CONTRIBUTION.md

@@ -0,0 +1,242 @@
+# Hacktoberfest 2024 Contribution - Code Examples
+
+## 🎯 Contribution Summary
+
+This contribution addresses **Issue #618: Add Examples** by creating comprehensive, runnable JavaScript code examples for the 33 JavaScript concepts.
+
+### What Was Added
+
+#### 📁 New Directory Structure
+```
+examples/
+├── README.md                      # Examples documentation
+├── CONTRIBUTING_EXAMPLES.md       # Contribution guidelines
+├── 01-call-stack.js              # Call stack examples
+├── 02-primitive-types.js         # Primitive types examples
+├── 03-value-vs-reference.js      # Value vs reference examples
+├── 04-type-coercion.js           # Type coercion examples
+├── 05-equality-comparison.js     # Equality operators examples
+├── 06-scope.js                   # Scope examples
+├── 07-expression-vs-statement.js # Expression vs statement examples
+├── 08-iife-modules.js            # IIFE and modules examples
+├── 09-event-loop.js              # Event loop examples
+├── 10-timers.js                  # Timer functions examples
+├── 21-closures.js                # Closures examples
+├── 25-promises.js                # Promises examples
+└── 26-async-await.js             # Async/await examples
+```
+
+### 📊 Statistics
+
+- **Total Files Created**: 16
+- **Total Lines of Code**: ~2,500+
+- **Concepts Covered**: 13 out of 33
+- **Examples Per File**: 8-13 examples each
+- **Total Examples**: ~130+ practical examples
+
+### 🎓 What Each File Contains
+
+#### Fundamental Concepts (1-10)
+
+1. **Call Stack** (`01-call-stack.js`)
+   - Basic call stack visualization
+   - Stack overflow demonstration
+   - Error stack traces
+   - LIFO behavior
+
+2. **Primitive Types** (`02-primitive-types.js`)
+   - All 7 primitive types (string, number, bigint, boolean, undefined, symbol, null)
+   - Immutability demonstrations
+   - Type checking
+   - Auto-boxing
+
+3. **Value vs Reference** (`03-value-vs-reference.js`)
+   - Value type copying
+   - Reference type behavior
+   - Function parameters
+   - Shallow vs deep copying
+
+4. **Type Coercion** (`04-type-coercion.js`)
+   - Implicit coercion
+   - Explicit conversion
+   - Truthy/falsy values
+   - Duck typing examples
+
+5. **Equality Comparison** (`05-equality-comparison.js`)
+   - == vs === operators
+   - typeof operator usage
+   - Object comparison
+   - Special cases (NaN, null, undefined)
+
+6. **Scope** (`06-scope.js`)
+   - Global, function, and block scope
+   - Lexical scope
+   - Scope chain
+   - Hoisting and TDZ
+
+7. **Expression vs Statement** (`07-expression-vs-statement.js`)
+   - Expressions that produce values
+   - Statements that perform actions
+   - Function declarations vs expressions
+   - IIFE patterns
+
+8. **IIFE & Modules** (`08-iife-modules.js`)
+   - Basic IIFE patterns
+   - Module pattern
+   - Revealing module pattern
+   - Namespace pattern
+   - Singleton pattern
+
+9. **Event Loop** (`09-event-loop.js`)
+   - Call stack vs task queue
+   - Microtasks vs macrotasks
+   - Promise execution order
+   - Async/await behavior
+
+10. **Timers** (`10-timers.js`)
+    - setTimeout and setInterval
+    - Clearing timers
+    - Debouncing and throttling
+    - Timing accuracy
+
+#### Advanced Concepts
+
+21. **Closures** (`21-closures.js`)
+    - Basic closure patterns
+    - Private variables
+    - Function factories
+    - Memoization
+    - Module pattern
+
+25. **Promises** (`25-promises.js`)
+    - Creating promises
+    - Promise chaining
+    - Error handling
+    - Promise.all, Promise.race
+    - Promise.allSettled, Promise.any
+    - Promisifying callbacks
+
+26. **Async/Await** (`26-async-await.js`)
+    - Basic async/await syntax
+    - Error handling with try/catch
+    - Sequential vs parallel execution
+    - Async loops
+    - Best practices
+
+### 🎨 Code Quality Features
+
+#### ✅ Well-Structured
+- Clear section headers for each example
+- Consistent formatting throughout
+- Progressive complexity (basic → advanced)
+
+#### ✅ Educational
+- Detailed comments explaining concepts
+- Expected output shown
+- Common pitfalls highlighted
+- Best practices demonstrated
+
+#### ✅ Runnable
+- All examples can be executed with Node.js
+- No external dependencies required
+- Clear console output for learning
+
+#### ✅ Comprehensive Documentation
+- **examples/README.md**: Overview and usage instructions
+- **examples/CONTRIBUTING_EXAMPLES.md**: Detailed contribution guidelines
+- Code comments in every file
+
+### 🚀 How to Use These Examples
+
+#### Run Individual Examples
+```bash
+node examples/01-call-stack.js
+node examples/21-closures.js
+node examples/25-promises.js
+```
+
+#### Run All Examples
+```bash
+# On Unix/Mac
+for file in examples/*.js; do node "$file"; done
+
+# On Windows PowerShell
+Get-ChildItem examples\*.js | ForEach-Object { node $_.FullName }
+```
+
+### 📝 Example Format
+
+Each file follows this structure:
+
+```javascript
+/**
+ * [Concept Name] Examples
+ * Brief description of the concept
+ */
+
+// Example 1: [Description]
+console.log('=== Example 1: [Description] ===');
+// Code demonstrating the concept
+console.log('Output');
+
+// Example 2: [Description]
+console.log('\n=== Example 2: [Description] ===');
+// More code examples
+```
+
+### 🎯 Impact
+
+This contribution helps developers:
+- **Learn by doing** with practical, runnable examples
+- **Understand concepts** through progressive examples
+- **Avoid common pitfalls** with highlighted gotchas
+- **Follow best practices** with recommended patterns
+
+### 🔄 Future Contributions
+
+The remaining 20 concepts still need examples:
+- JavaScript Engines
+- Bitwise Operators
+- DOM and Layout Trees
+- Factories and Classes
+- this, call, apply, bind
+- Prototype Inheritance
+- Object.create and Object.assign
+- map, reduce, filter
+- Pure Functions
+- High Order Functions
+- Recursion
+- Collections and Generators
+- Data Structures
+- Big O Notation
+- Algorithms
+- Inheritance and Polymorphism
+- Design Patterns
+- Currying and Compose
+- Clean Code
+
+### 📚 Related Files
+
+- **Issue**: #618 - Add examples
+- **Main README**: Updated with link to examples
+- **Contributing Guide**: examples/CONTRIBUTING_EXAMPLES.md
+
+### 🏆 Hacktoberfest Compliance
+
+- ✅ Meaningful contribution
+- ✅ Addresses an open issue
+- ✅ High-quality code
+- ✅ Well-documented
+- ✅ Follows repository guidelines
+- ✅ Ready for review
+
+### 🙏 Acknowledgments
+
+This contribution is part of Hacktoberfest 2024, helping developers worldwide learn JavaScript concepts through practical examples.
+
+---
+
+**Created by**: Sangeeth Karunakaran  
+**Date**: October 2024  
+**Issue**: #618  
+**Repository**: leonardomso/33-js-concepts