Rapid JavaScript Training

JavaScript Basics
Welcome to this module titled JavaScript Basics. My name is Mark Zamoyta. In this module we'll touch on the fundamentals of the JavaScript language. We'll go into much more detail on each item throughout the remainder of this course, but let's get a quick overview of JavaScript as a whole. In this module we'll start off by looking at the script tag, that's the HTML5 tag that lets us include JavaScript within a webpage. Then we'll look at variables and types. And again, this is at a very high level. We'll take a look at functions at a high level and we have a whole module dedicated to functions later on in this course. We'll take a look at conditionals for statements such as if and switch. We'll take a look at loops, things such as for loops or the for in loop, and while. And we'll wrap up the module with some JavaScript usage notes. This will cover things such as comments and the end of line character, the semicolon, and some other miscellaneous topics. So let's take a look at the script tag.

Variables, Types, and Scope
Hello this is Mark Zamoyta and this module is titled Variables, Types, and Scope. In our last module we went over JavaScript in high level detail, but now we're going to start to get more specific with variables and types and we'll also talk about global, function, and block scope. We'll start off this module talking about hoisting. Hoisting is rather unique to JavaScript. And it's a source of a lot of bugs, so we want to make sure we understand this thoroughly. Next we'll look at the primitive types in more detail. The key primitive types are strings, numbers, and Boolean values. We'll take a look at undefined and null and when we should use them and what the exact differences are. And then we'll start taking a look at scopes, we'll take a look at global scope in detail, we'll look at function scope, and we'll look at block scope. JavaScript doesn't have block scope in a similar way to other languages, but there is a way to simulate it in a try-catch finally construct, so we'll take a look at this as well.

Operators
This module is dedicated to operators in JavaScript. JavaScript operators are very similar to the operators found in other programming languages. However, there are a few key difference that you need to know. We're going to start off by looking at the normal operators, addition, subtraction, multiplication, division, and modulus. We'll see how the plus symbol is meant to work with strings as well as numbers and it's quite different than the minus symbol, which is designed only for numbers. And in this module we'll see how conversions take place implicitly. We'll check out JavaScript's unary operators, these are things such as plus or minus in front of a variable or literal and also the not symbol. JavaScript has bitwise operators. Normally the numbers we work with in JavaScript are seen as floating points, but if we start to use bit operators it'll convert the floating point numbers into 32 bit fields to work with and we'll see several examples of that. We'll look at Boolean operators, such as and and or, that are commonly used in conditional statements. And we'll take a look at the equality operators. We have the double equal sign, but we also have the triple equal sign, which is very commonly used in JavaScript. That doesn't only check the value, but it also checks the data type. We'll see several examples of those in action. And finally, we'll check out the relational operators. Those are things such as greater than, less than, greater than, equal to, and so on. So let's start looking at examples with the plus operator.

Arrays and Reference Types
Welcome to this module titled Arrays and Reference Types. In JavaScript there's a big distinction made between primitive types, things such as numbers, Boolean values, and strings, and reference types. Reference types include things like arrays and objects, those are the most popular ones. And in this module we'll be looking at this distinction and going over most of the reference types. We're going to start by getting a good explanation of what reference types really are and how they work with the JavaScript runtime engine. Next we'll take a look at a bunch of examples which show reference types being used in real situations. Next, we'll take one of the popular reference types, which is arrays, and we'll look at that in detail. We'll take a look at dates, which is another type of reference type, and we'll look at regular expressions. Now probably the most popular form of reference type is actually an object, and we'll dedicate a whole module on objects later in the course. So we'll just look at those briefly in this module. But let's get started and review what reference types really are.

Objects, JSON, and Prototypes
Welcome to this module titled Objects, JSON, and Prototypes. Now we're going to start looking into the extreme details of objects and as a JavaScript programmer we use objects all the time. JSON stands for JavaScript Object Notation and it's simply a way of specifying a new object within JavaScript code. And prototypes is an important aspect of objects in JavaScript. Prototypes give an object somewhat of an inheritance type of functionality. It's different than the kind of inheritance you find in C# or Java, but we'll explain that in detail in this module. So in this module we're going to cover simple objects and JSON. We'll just see how to make an object within our source code. Next we'll go over prototypes in its simplest form. As I just mentioned, prototypes add a little bit of inheritance to a JavaScript object, but we'll look at the exact mechanism that's in place for that. Next we'll see a bunch of examples using prototypes, so that we understand them fully. We'll look at the object. create function, which is important in creating objects and specifying the object's prototype, and we'll look at Object. defineProperty, that's the function that lets us put our own properties onto objects. Now there's an easy way to add a property to an object and then there's the defineProperty function, which gives us much more control over the settings of the property, and we'll look at that in detail. Finally we'll look at miscellaneous object functions and those are just functions on the object prototype that we can work with.

Functions
Welcome to this module titled Functions. My name is Mark Zamoyta. In this module we'll be looking at functions in a lot more detail than we saw earlier in the course. We'll take a look at function expressions and we'll see how we can give names to our anonymous functions so that we can get some better debugging information. We'll also look at constructor functions. These are very important if we're going to make heavy use of objects in JavaScript. JavaScript doesn't have classes, but the closest we get to a class is one of these constructor functions. One popular one that we have been using all along has been Object with a capital O, but we'll see how we can create our own and use prototypes on them, and then good news is we can directly access a prototype field on a constructor function. We'll take a look at the "this" keyword. "This" can be used in the global namespace, but mostly it's going to be used in a function context. It's important to always understand what "this" refers to because it really changes depending upon the context of the function and how the function is called. We'll look at calling functions directly using the call and apply functions. These are very useful for setting the "this" keyword within the function and also passing arguments. Next we'll take a look at closures. Functions are treated like objects in JavaScript and just like objects, functions can persist. Not only can the function persist, such as if it's assigned to a variable, but it can also access the outside context, the context outside of that function, and we'll see several examples of this. Next we'll look at IIFE's or immediately invoked function expressions. These are used a lot in modern JavaScript programming.

Programming the BOM and DOM
Welcome to this module titled Programming the BOM and DOM. BOM stands for browser object model and that's a set of objects that the browser exposes to JavaScript. Likewise, the DOM is the document object model. That represents the document that the browser is showing, and again, it exposes objects to JavaScript so we can work with the document. So in this module we'll be taking a look at the window Object. Window is the global Object in the browser that gives us information about the viewport within the browser and lots of other information. If you're using JavaScript only on Node. js, this is going to be useless, there is no browser window. Instead you'd use the global Object, and again, we're not going to be covering that in this course. We're going to be focusing on the browser in the document here. Next we're going to be taking a look at the system dialogs. These are the simple dialogs that the browser puts up that accept user input. These are styled differently in all the different major browsers, so if you wanted a consistent look across browsers, you wouldn't use these, but they are very useful for testing and utility applications and that kind of thing. Next we'll look at the location Object, which is contained in the window Object, but it lets us know the URL that we're looking at in the browser. Then we'll start looking at the HTML document. We'll see how to access it as a bunch of objects within JavaScript. And finally we'll look at query selectors, which is the most modern way of selecting elements within the HTML document. Interacting with the document object model is usually done through a library such as jQuery. But with query selectors in modern browsers, we can do away with that to some degree. So let's take a look at the window Object first.

Event Handlers
Hi this is Mark Zamoyta. This module is titled Event Handlers. Events are a big part of JavaScript. They usually fire off from some kind of user interaction or some kind of system messages from the browser or device we're working on. In this module we'll see how to write functions to handle these events when the occur. We'll start off by looking at many categories of events, there are dozens of them, and we'll briefly go over each one. Next we'll look at the event object. When an event gets fired, the JavaScript runtime engine will create an object to go along with the event and it's a pretty big object with a lot of properties and we'll take a look at some of those key properties we'll need to use. Next we'll look at handling events. Among all the major web browsers, nothing has changed as much as event handling. Standards weren't in place early on in JavaScript's development and there's just tons of legacy code and even current code that uses older techniques of event handling. We'll take a look at a few of these techniques. And then we'll take a look at the more modern way of using event listeners. This is a more powerful and simplified approach and it works well among modern browsers. Next we'll take a look at event bubbling. Bubbling has to do with parent/child relationships. Let's say we had a form and the form had a button on it, the form's the parent, the button is the child. If you click the button, who receives an event first? Does the parent receive the event or does the button receive the event? This has long been a problem with JavaScript, but we can handle it easily with modern event listeners, and we'll see how to do that. So let's get started and look at several categories of events.

Built-in Objects and Functions
Hi this Mark Zamoyta and this module is titled Built-in Objects and Functions. We're been looking at built-in objects and functions throughout the course, but a few have fallen through the cracks and we want to make sure we cover everything important. We'll start off this module by looking at global functions. These are just utility functions that we can access anywhere in JavaScript. Next we'll look at the math object. And we've already looked at the string object, but we're going to go into a lot more detail on its functions. Finally we'll look at the arguments variable. When a function is executing we have access to a special variable called arguments and this is just an alternative way to access the arguments. So let's start off by looking at global functions now.

Miscellaneous JavaScript Topics
Hi this is Mark Zamoyta and welcome to the final module is this course, Miscellaneous JavaScript Topics. It's one thing to understand the JavaScript language itself inside out, but there are a lot of tools we need to use as JavaScript developers and we'll be covering several of them in this module. We'll start off by looking at error handling and promises. JavaScript does have a try, catch, finally construct as seen in other languages. But that actually takes a smaller role in JavaScript. Usually when it comes to error handling in JavaScript, you see a lot happening with promises and a promise is simply a pattern developed upon JavaScript. Next we'll take a look at strict mode. Throughout this course we've been turning strict mode on and off to see the difference in how JavaScript handles our code and in this module we'll consolidate some of that information and look at it as a whole. There are two important tools in JavaScript to help us write better code, JSLint and JSHint. We'll take a look at these and we'll see the difference and how it can help us write better code. Finally we'll look at using modules in JavaScript. There are a few different specifications for writing modules and we'll take a look at them at a high level and we'll look at a good modern way to be writing modules and packages in JavaScript. So let's get started and take a look at error handling.