Course:

Course Description

In the Mastering JavaScript with ECMASCript 6 (ES6) and TypeScript course you’ll dive into key features of the language that will take your JavaScript skills to the next level. This includes starting out with the core concepts, manipulating the DOM and even using HTML5 APIs. In this 4-day class, you’ll discover how to work with JavaScript objects, patterns, events and functions. This includes learning the ins-and-outs of prototypical inheritance, how to create factories, the need for constructors, dealing with “this”, as well as key patterns that can be used to structure your JavaScript code such as the Revealing Module Pattern, Prototype Pattern and others. Additional topics include Data Binding techniques and how Handlebars, KnockoutJS or AngularJS templates can be used to render data in Single Page Applications (SPAs) or other application types to reduce the amount of code that is written. Finally, you’ll learn about new ECMAScript 6 (ES6) features (and how you can use them today) as well as about TypeScript and how it can be used to add strong types into code and more!

Outline

1. JavaScript Primer

The Role of JavaScript
Variables, Types and Objects
Operators, Conditionals and Loops
Working with Functions

2. JavaScript and the DOM

Locating DOM Elements
DOM Manipulation
Handling DOM Events
Manipulating Styles and CSS Classes

3. JavaScript HTML5

HTML5 JavaScript APIs
Drawing with the Canvas
Storing Data Locally
Geolocation and Mapping

4. JavaScript Objects

JavaScript Objects
Constructor
Prototypal Inheritance
Working with Properties
Creating a JavaScript Factory

5. Function Techniques

Immediately Invoked Functions
Using call(), bind(), and apply() to change Context
Async: Callbacks vs. Promises
Working with Array Functions

6. JavaScript Patterns

Pattern Enablers
Prototyping
Object Literals
Namespaces
Closures
Digging into Closures
Key Patterns
Prototype Pattern
Revealing Module Pattern
Revealing Prototype Pattern

7. Data Binding and Templates

Why DOM code is Tedious
Using Client-Side Templates
Benefits of Data Binding
Client-Side Data Binding Options:
Handlebars
KnockoutJS
AngularJS

8. Getting Started with ECMAScript 6

ECMAScript 6 tools that let you use it today!
Key ECMAScript Features
Defining Classes
Destructuring
Arrow Functions
Maps and Sets
Template Strings
Default and Rest Parameters

9. Getting Started with TypeScript

Introduction to TypeScript
TypeScript Keywords and Hierarchy
Classes, Functions and Interfaces
Working with Modules

Audience

This course is valuable for developers who are interested in building applications using the JavaScript programming language.

Prerequisites

Previous experience with JavaScript, HTML and CSS is required to get the most out of this course. Although a JavaScript primer is provided, this course dives deep into various aspects of the language and is not a beginning JavaScript course.

Recommended pre-requisite course: 20480: Programming in HTML5 with JavaScript and CSS3

What You Will Learn

Core JavaScript language concepts
How JavaScript can be used with key HTML5 APIs
The role of prototypical inheritance
How to create JavaScript factories
The role of the constructor
Prototypal Inheritance
Key JavaScript patterns that can be used to clean up your code
How to create custom JavaScript objects
Client-Side Data binding techniques that can minimize code
Key ECMAScript 6 Features
Using ECMASCript 6 Today with specialized tools
Getting Started with TypeScript

Student Comments (2)

Comments about the Instructor

"Excellent instructor"

January 20, 2017 | JS300 Student

Comments about the Courseware

"I particular liked the section about Prototype. Was excellent, and resolve many of myquestions about the subject"

January 20, 2017 | JS300 Student

JS300: Mastering JavaScript with ECMAScript 6 (ES6) and TypeScript