JavaScript Fundamentals

Course Overview
Hi everyone. My name is Mark Zamoyta and welcome to my course, JavaScript Fundamentals. I am a software developer and educator in the Tampa Bay area. JavaScript is the language of the web and you'll need a fundamental understanding of this language to create great applications and web pages on the internet. This course was developed to teach you the key JavaScript syntax and features you'll need to learn as a successful web developer. Some of the major topics that we will cover include: the latest JavaScript syntax improvements, organizing your code into classes and modules, communicating with web services, error handling and security, and much more. By the end of this course you'll know how to set up a JavaScript development environment and create great JavaScript applications for the web. Before beginning this course you should have some familiarity with JavaScript. My Pluralsight course, JavaScript: Getting Started is a good starting point of you've never used JavaScript before. I hope you'll join me on this journey to learn JavaScript programming with the JavaScript Fundamentals course at Pluralsight.

Language Features
Welcome to this module titled JavaScript Language Features. My name is Mark Zamoyta. In this module we'll cover some features of JavaScript that I didn't get to in my JavaScript: Getting Started course. Some of these features are relatively new to JavaScript and other features are just beyond the getting-started level. Let's take a look at what they are. We'll start off by looking at constants where we can declare symbols whose values cannot change. Next we'll look at the difference between the let and var keywords when we declare variables. We'll take a look at rest parameters. A rest parameter can collect up arguments and we'll look at destructuring. We can take an array and easily assign the elements of an array to variables. Likewise we can take an object and easily assign the properties of an object to variables. Next we'll look at spread syntax. That's a way of taking an array and spreading it out into its elements so that they can use it as parameters. Rest parameters and spread are opposite and we'll see that in the upcoming videos. Next we'll take a look at the built-in typeof function in JavaScript to get the type of a variable or constant or a literal. Next we'll look at common type conversions. Mainly this deals with converting from strings to numbers or any variable to a string. Finally we'll take a look at controlling loops. We'll see how we can break out of a loop or continue through a loop without executing the complete body. So let's get started and look at constants.

Operators
Hi. My name is Mark Zamoyta and welcome to this module titled Operators. By operators we mean the simple mathematical operators plus, minus, multiply, divide, that kind of thing, but there are actually many more different types of operators. Let's see what we'll cover in this module. We'll start off by looking at equality operators, comparing if two numbers are equal or unequal. We'll look a unary operators. Those are operators that work on a single value or variable. Logical operators are also sometimes called Boolean operators and they result in a true or false value. Relational operators are things such as greater-than, less-than and so on, but we need to look at how relational operators work with strings. We'll take a look at the conditional operator, which is a shortcut for an if statement, an else clause, and we'll look at assignment operators. These are shortcuts which let us easily modify a variable in a concise syntax. Finally we'll take a look at operator precedence and this is very important. We know that operators such as multiplication come before addition and not knowing that rule is the cause of many bugs. So we'll take a look at the Mozilla developer network where we can find a table of operator precedents that can be used as a reference as we code. So let's get started and look at equality operators.

Functions and Scope
Welcome to this course module, Functions and Scope. I'm Mark Zamoyta for Pluralsight. Let's see what we'll be covering in this module. We'll start off by looking at function and block scope. Block scope wasn't available in JavaScript until recently with the ES2015 release of JavaScript. So we'll take a close look at that. Next we'll look at IIFEs. IIFEs are immediately invoked function expressions and we'll see that pattern and we'll see why it's used. We'll look at closures. A closure is a function and its context that are kept around in memory. We'll see why this is important. We'll look at the this keyword. Every function has a special keyword called this, which refers to the function's context. We'll learn all about it. And there are three special functions that can be called on other functions; call, apply, and bind. These all have to do with the this keyword. Next we'll cover arrow functions which is a new concise way of declaring a function and we'll wrap up this module by looking at default parameters. That's another new feature of ES 2015. So let's get started and take a look at function scope.

Objects and Arrays
Hi. My name is Mark Zamoyta and this module is titled Objects and Arrays. I already covered objects and arrays in my JavaScript: Getting Started course so we'll go a little bit deeper here in JavaScript Fundamentals. We'll start off by looking at constructor functions and how we can instantiate new objects. We'll take a look at prototypes. A prototype is an important property of a constructor function and we'll see how to use it and we'll see how we can expand objects using prototypes. These are sometimes called polyfills. Next we'll take a look at JavaScript Object Notation, JSON. This is a way of creating objects or arrays that can be transferred over HTTP or stored in a file. And we'll wrap up this module by looking at array iteration. Commonly for loops are used to loop through an array, but we can use methods as well and we'll see how to do that. So let's start off by looking at constructor functions.

Classes and Modules
Welcome to this course module named Classes and Modules. Classes give us the new syntax in order to create constructor functions. It's more similar to Java and C++ and C# and modules is a way to organize our code. Generally we can break our source code into a set of files and each file will become a module. We'll start of by covering the class basics. How do we create a class? Next we'll look at constructors and properties. We'll see how to add these to a class. We'll look at methods for performing code on a class and we'll look at inheritance. This is a technique where classes inherit from other classes so we don't have to do duplicate code. Next we'll create our first module and a module is a file that can be shared and imported into other modules. And we'll see how to import those modules and work with index. js and organize our code properly. So let's get started and look at how we can create a class.

Programming the BOM and DOM
Welcome to this module titled Programming the BOM and DOM. My name is Mark Zamoyta. BOM refers to the Browser Object Model and that lets you access functionality in the browser. You can change the URL you're pointing at, get information on the URL, and that kind of thing. And the Document Object Model is the DOM. That's what we use to change the actual web page. These are large topics so we'll cover just the basics in this module. That'll be enough to get you started and you'll be able to work with the Mozilla developer network to find more information. We'll start off by looking at the window object, which is JavaScript's global object that we can access from anywhere. Next we'll look at timers. You use a timer to fire off a function asynchronously after a set amount of time. We'll look at the location object. That lets us access the URL that the browser is pointing at and we'll look at the document object. That's where DOM programming comes in where we can change the elements in a web page. We'll look at a few methods to select DOM objects and we'll also look at a few methods to modify DOM objects. So let's get started and look at the window object.

Promises and Error Handling
Hi. My name is Mark Zamoyta and this module is titled Promises and Error Handling. When something goes wrong in a JavaScript program we want to be in control. So we'll look at the mechanisms in place to help us handle errors and make sure everything runs smoothly. We'll start off by looking at general errors in JavaScript and how they stop execution of our code. Then we'll start handling errors with the try and catch keywords. We can specify code blocks with try and if any errors occur we can catch them with catch. We can also add a finally code block to try and catch. So we'll take a look at that. While JavaScript creates its own errors, as a developer we can create errors unique to our application. So we'll see how to do that and throw those as errors that can be caught. Next we'll take a look at promises. Promises are used with asynchronous code and you can think of a promise as a holder for a value. When an asynchronous operation finishes the promise will be notified if there is an error or if everything went smoothly and we have a value to work with. And finally we'll see how we can settle a promise. A promise can be resolved or rejected and a rejection of course is an error handler. Something's wrong and we need to handle things gracefully in our code. So let's start off and we'll look at errors in general in JavaScript.

Data Access Using HTTP
Hi. My name is Mark Zamoyta and this module is titled Data Access Using HTTP. We'll start of by looking at the HTTP protocol to request data using the XHR mechanism. XHR is very low level as we'll see and it's much more common to work with a third-party library such a jQuery for data access. So that's what we'll do next. We'll do an HTTP request using jQuery. We'll see how to load jQuery into project. json and how to import it as a module so we can use it in JavaScript. And finally we'll do an HTTP POST using jQuery. This is how we can post form data or post other information to an endpoint that's accepting data. So let's start off by looking at what XHR is.

Forms
Hi. My name is Mark Zamoyta and welcome to this module titled Forms. Forms are the key way we accept data from a user and we want to be able to access these forms in JavaScript so we'll cover that in this module. We'll start off by looking at how we can prevent the default form submission. We want to be able to look at the form data with JavaScript code before it gets posted to a server. Next we'll see how we can access form fields and we use the DOM for that and we'll see how we can show validation errors. Finally we'll look at an alternate way of posting our form data from JavaScript. This way we can bypass the browser's posting mechanism altogether and send data however we'd like to send it. So let's start off by looking at how we can prevent the default form submission.

Security and Building for Production
Welcome to this module titled Security and Building for Production. My name is Mark Zamoyta. At some point our application is going to be finished and we're going to need to make sure that our application is as secure as possible. So we'll take a look at some of the technology we can use to do that and we'll also look at how we can use webpack to make a build for production. We need to bundle a JavaScript file and an HTML file that we can send off to our server that our end users will use. So far we've only been in development mode. We'll start off by looking at the Chrome Developer Tools built into the Chrome browser and we'll see how secure our JavaScript code and global variables really are. We'll see that end users can see all our code and variables. Next we'll look at security and JavaScript's eval function. Eval lets us dynamically execute JavaScript code based on a string and by using it your code could be open to injection attacks. We'll take a look at preventing man-in-the-middle attacks and we'll take a look at cross-site scripting attacks. Finally we'll take a look at how we can build our application for production. We want to make sure that we have a JavaScript file and an HTML file that we can upload to our server for our end users to use. So let's start off by looking at the Chrome Developer Tools.