Spring 2.1 - JavaScript Exercises

A collection of JavaScript exercises focused on arrow functions, ternary operators, and callbacks. This project demonstrates modern JavaScript ES6+ features through interactive examples.

Live Demo

🔗 View Live Demo

📋 Description

This project contains a series of exercises covering fundamental JavaScript concepts:

• Arrow Functions: Converting traditional functions to arrow functions, understanding this context
• Ternary Operators: Using conditional (ternary) operators for cleaner code
• Callbacks: Understanding and implementing callback functions

Each exercise includes:

• Code implementation
• Interactive buttons to test the functionality
• Visual output display
• Syntax highlighting with Prism.js

🚀 Features

• Interactive Navigation: Navigate through exercises using Previous/Next buttons
• Real-time Results: Execute functions and view results directly on the page
• Code Examples: Syntax-highlighted code snippets for each exercise
• Input Validation: Helper functions to validate numeric inputs and arrays
• Clean UI: Simple and intuitive interface for testing JavaScript concepts

📁 Project Structure

spring2_1/
├── index.html      # Main HTML file with exercise descriptions and UI
├── main.js         # JavaScript implementations of all exercises
├── helpers.js      # Utility functions (validation, result display, navigation)
├── styles.css      # Styling for the application
└── README.md       # Project documentation

🛠️ Technologies Used

• HTML5
• CSS3
• JavaScript (ES6+)
• Prism.js - Syntax highlighting library

💻 Getting Started

1. Clone or download this repository
2. Open index.html in your web browser
3. Navigate through exercises using the Previous/Next buttons
4. Click the test buttons to execute functions and see results

No build process or dependencies installation required!

📚 Exercises Included

1.1 Arrow Functions

• 1.1.1: Converting traditional functions to arrow functions
• 1.1.2: Arrow functions without parameters
• 1.1.3: Using this in arrow functions with classes
• 1.1.4: Arrow functions within loops

1.2 Ternary Operators

• 1.2.1: Basic ternary operator usage
• 1.2.2: Ternary operators with comparison operations
• 1.2.3: Chained ternary operators
• 1.2.4: Ternary operators inside loops

1.3 Callbacks

• 1.3.1: Basic callback implementation
• 1.3.2: Callbacks with mathematical operations
• (Additional callback exercises available in main.js)

🔧 Key Functions

Helper Functions (helpers.js)

• isArryNum(array) - Validates if input is an array of numbers
• showResult(result) - Displays results in the output div
• showExercise(index) - Controls exercise navigation

Error Handling

The project includes validation for:

• Non-numeric inputs
• Invalid array inputs
• Edge cases (negative numbers, equal values, etc.)

👨‍💻 Author

Carlos Ramirez

📝 License

This is an educational project for IT Academy specialization course.

🎯 Learning Objectives

This project helps understand:

• Modern JavaScript syntax (ES6+)
• Functional programming concepts
• Code organization and structure
• Input validation and error handling
• Interactive web applications

---

Note: This project is part of the IT Academy specialization curriculum and focuses on practical JavaScript exercises.