Category: javascript tutorials

In JavaScript, DOM events capture actions a user performs on an HTML element in a web application. Examples of user actions include clicking on a button or link, entering text into an input field or selecting an item from a list. To capture a user event, JavaScript has action listeners. Action listeners define a callback…

Understanding the this concept is essential to learning JavaScript. this is a reserved word which refers to the current scope. Scope changes based on the current context in the code. For example, inside a class, this is used to access methods and variables defined in the class. class Year { constructor(key) { this.year = 2020;…

HTTP requests are used to communicate between a client and a server. Example, a web application running in the browser communicates with a weather API running on someone else’s server using a GET HTTP request. The response data is then used to populate a widget in the web application. In JavaScript, the fetch API is…

A promise is used when making calls to a process that will take a while to execute. Instead of hanging the application and waiting for the call to return, a promise is used. The promise tells the calling function, this could take a while, I’ll send you back the result when it’s done. The calling…

In JavaScript es6, modules provide the ability to use variables, methods and classes in another JavaScript file. The following is an example to export a function from a JavaScript file for use in another JavaScript file: export function printSomething(value) { console.log(value) } The function is exported by including the export keyword. It could also export…

Since ES6, JavaScript now supports classes. They are not based on an object-oriented inheritance model. Classes are still functions. They sit on top of JavaScript’s prototype inheritance. A class contains a set of properties that define an object. The following is an example of a class in JavaScript: class Potholder { constructor(numColors) { this.numColors =…

In JavaScript, errors can be caught using exception handling. Exception handling will prevent an application from crashing and not being able to recover. Exception handling is a much cleaner way than the old fashioned way of setting up your own error codes, passing them around and doing comparisons. Exception handling is implemented using try catch…

Functions are used to enclose a block of code which performs a single task. Functions should be kept fairly small. If a function gets too large, that could be a sign it is doing more than a single task and should be broken down into multiple functions, each doing a different task that when used…

Loops are used to run a block of code multiple times. JavaScript supports while loops, do while loops and several types of for loops. While loops run a block of code until a condition is no longer true. A while loop condition needs to be carefully written. If the condition never fails, the loop will…

In JavaScript, objects contain one or more key, value pairs. The key, value pairs are enclosed in a set of curly brackets. Values may be variables, arrays, methods or even another object. The following is an example of an object: let circle = { radius: 3, color: ‘blue’, diameter: function () { return this.radius *…