Description
In this course, you will learn:
- Helps you build your understanding of JavaScript piece by piece, from core principles like variables, data types, conditionals, and functions through advanced topics including loops, closures, and DOM scripting. Along the way, you will also be introduced to some ES6 and the basics of JavaScript libraries.
Syllabus:
- Introduction
- How to use the exercise files
1. JavaScript: A Brief Introduction
- JavaScript: First contact
- Navigating the JS landscape
- Tools for working with JavaScript
- Linting and formatting
- Get to know the browser console
- JavaScript language basics
- Learning JavaScript backward
2. Up and Running with JS
- JavaScript in an HTML document
- JavaScript as an external file
- Modern JavaScript loading
- JavaScript modules
3. Objects
- Objects: A practical introduction
- JavaScript objects: The code version
- Object containers
- Object properties
- Accessing objects
- Accessing object properties
- Practice: Build a new object
- Object methods
- Practice: Build a new method
- Classes: Object blueprints
- Object constructors
- Practice: Build a new object with a constructor
- Global objects
- Challenge: Create a new object type
- Solution: Create a new object type
4. Sidebar: String Output
- Mix text and variables with template literals
- Traditional string output
5. DOM
- DOM: The Document Object Model
- Access elements with querySelector methods
- Access elements using older methods
- Practice: Find an element
- Modifying element classes
- Attributes
- Inline style
- Practice: Modify classes and attributes, and styles
- Challenge: Add a new element
- Solution: Add a new element
6. Sidebar: Variables and Data Types
- Variables: Containers for everything
- Var
- Scope
- Let
- Const
- Data types
- Assignment vs. comparison
- Math operators
7. Arrays
- Arrays explained
- Arrays in code
- Array methods
- Challenge: Build and modify an array
- Solution: Build and modify an array
8. Functions and Methods
- The real-world function
- Functions and methods
- A standard function
- The arrow function
- Arrow functions and "this"
- Practice: Build a function
- Pass data to a function with parameters
- Return values from a function
- Practice: Pass values between functions
- Callbacks
- Conditional if...else statement
- Logical operators
- Conditional switch statement
- Looping through content
- Using the map() array method
- Challenge: Build an advanced function
- Solution: Build an advanced function
9. Events
- Event listeners
- Practice: Experiment with event listeners
- Advanced event listeners and "this"
- Pass arguments through event listeners
- Challenge: Create an event listener
- Solution: Create an event listener
10. Troubleshooting and Validating JS
- Troubleshooting JavaScript in the browser
- Making sense of a React component