Audience
This course is intended for both novice and experienced programmers. Some experience in C++, C# or Java is helpful.
Prerequisites
Before attending this course, students must have:
- Previous programming experience using C, C# or Java.
- HTML and CSS web development.
Duration
5 days. Hands on.
Course Objectives
This five-day instructor-led course is an in depth hands-on study of JavaScript. The course includes detailed hands-on labs and Q&A labs. The labs include multiple projects that update an existing web site.
After completing this course, students will be able to:
- Write and test JavaScript code in modern browsers.
- Understand and work with the browser’s Document Object Model (DOM).
- Work DOM objects and write code to respond to events.
- Add jQuery to their projects and use jQuery to manipulate the DOM and to make Ajax calls.
- Understand Ajax and Web Services, including HTTP Verbs and asynchronous Ajax calls.
- Work with XML and JSON data formats.
- Understand and use RESTful Web Services including ODATA queries.
- Work with Anonymous Functions, Self-Invoking Functions and Closures.
- Understand the role of the Window and Navigator objects.
- Describe and understand variables, “variable hoisting”, and JavaScript objects.
Course Content
Module 1: Basic Scripting
JavaScript Basics
JavaScript or ECMAScript?
Which Version of JavaScript am I Using?
Shims, Shivs, and Polyfills
Writing and Testing JavaScript
Editors and the F12 Tools
Key Parts of a Script
Lab : Basic Scripting
After completing this module, students will be able to:
• Add basic scripts to a web page.
• Use the F12 tools to explore pages.
Module 2: The Document Object Model
The DOM
Accessing Objects from the DOM
Responding to Events
Adding Elements to the DOM
Lab : The Document Object Model
After completing this module, students will be able to:
• Describe the DOM and Elements.
• Write JavaScript code to search and update the DOM.
• Write code to respond to DOM object events.
• Add and remove Elements to and from the DOM.
Module 3: Introduction to jQuery
jQuery
Downloading the jQuery Library
jQuery Versions
Linking to the Library
Selecting Elements using jQuery
Working with the Data Returned by jQuery
Setting CSS Properties
Running a Function Against the jQuery Return Set
Lab : jQuery
After completing this module, students will be able to:
• Describe the role of libraries like jQuery in JavaScript and web development.
• Add the jQuery library to a project.
• Find and retrieve, update and create new elements in the DOM.
Module 4: Ajax and Web Services
Web Services
HTTP Verbs
Data Formats – XML and JSON
Ajax
RESTful Web Services
OData
OData Queries
OData Updates
Lab : Ajax and Web Services
After completing this module, students will be able to:
• Describe web services and how to interact with them from JavaScript and jQuery.
• Work with XML and JSON data.
• Create queries and update data using REST and OData.
Module 5: Diving in Deeper
Is JavaScript Compiled?
Data Types and Objects
Extending Data Types
Variables, Scopes and Hoisting
Functions
The “this” Keyword
Errors
Recursion
Lab : Diving in Deeper
After completing this module, students will be able to:
• Describe how JavaScript variables are used, stored, and manipulated.
• Understand how JavaScript variables and functions are scoped, and occasionally “hoisted”.
• Create functions, anonymous functions and Closures.
• Describe and use the “this” keyword in functions.
• Create try-catch blocks and handle errors.