addEventListener – Introduction to Native JavaScript Event Handlers


JavaScript addEventListenerAll JavaScript libraries and frameworks provide abstraction for event handlers. But it is important to know how how the addEventListener method works and how to use it

In this article, you will learn about the JavaScript addEventListener method. This isn’t an in-depth discussion but a way for you to get started using this method. Continue reading “addEventListener – Introduction to Native JavaScript Event Handlers”

Angular CLI For Beginners – Your First Angular Application


Angular CLI for beginnersAssuming you have the Angular CLI installed, this Angular CLI for beginners guide will get you up-and-running with your first “hello World” application.

In this guide to Angular CLI for beginners, we are going to go over setting up your first Angular project using the Angular CLI for the first time. Continue reading “Angular CLI For Beginners – Your First Angular Application”

Angular CLI Installation Basics


Angular CLI installation basicsBefore you dive into your new application, here are some Angular CLI installation basics. This tool simplifies the process of scaffolding out your base code and new components.

This article provides a high-level introduction to Angular CLI installation basics. The Angular CLI is a powerful tool that can dramatically reduce the amount of time you spend coding, while improving the quality of the code. Continue reading “Angular CLI Installation Basics”

Javascript E164 Phone Number Validation


JavaScript E164 phone number validationWhen you need to ensure that the user inputs an E164 compliant phone number, JavaScript E164 phone number validation helps to minimize errors.

I this article you will learn how to set up a JavaScript E164 phone number validation system for your forms. E.164 is the international telephone numbering plan, and it ensures each device has a unique number. This system allows you to phone or send text messages anywhere in the world. Continue reading “Javascript E164 Phone Number Validation”

jQuery getScript Alternatives


jQuery getScript alternativesjQuery is aweseome, and the getScript even more so. But, consider some jQuery getScript alternatives in case you have to load a script file asynchronously without any help.

Today we’re going to talk about some jQuery getScript alternatives that you can use in your code. The jQuery getScript() allows you to get and execute external JavaScripts utilizing a type of AJAX HTTP GET request. Get requests can get any response, including JavaScripts, XML, and HTML, while getScript is limited to JavaScripts. The getScript method dynamically executes external JavaScript while Get receives data according to parameters.

The jQuery getScript Good

The Jquery getScript alternatives method is an extremely efficient way to load external code into your program at runtime. It allows us to write a piece of code once and use it in an unlimited amount of applications. We can also use code written by others in this way, and there is a vast amount of code snippets already available for you to use. If you are doing something common, like working with a form, you may not need to write any new code at all.

The jQuery getScript Bad

Unfortunately, any time you use external scripts, you will experience a slowdown as the program waits for the information to fetch. If you are using a code with a lot of external scripts, you will experience a reduced execution speed, especially if there are a lot of images loading as well.

You also need to load the jQuery library before you can access the getScript method. This extensive library will also slow down your code slightly, as it requires a download of a little under 250kb, depending on which version you are using.

The jQuery getScript Alternatives

Sometimes the code we are working on is not significant enough to warrant loading the entire jQuery library to access one or two external files, and in that case, we will need an alternative.

Let’s go step-by-step to arrive at a few Javascript getScript alternatives. We have created an object called myData, which has three properties. The properties of myData are FOO, BAR, and BAZ. We have placed this object in an external file at, along with a console warning that tells us if we have successfully loaded the script. Let’s try to access this object from our code.

Example 1

In Example 1, we are asking the console to print out the properties of the object myData, but since we never tell the console where to find the object, the process fails and returns the error myData is not defined.

Example 2

In Example 2, we show you how we would typically access the myData object in the external file by using a jQuery getScript. You can see in this example that we first tell the code where to find the file.

As the file is downloading, it will come across the javaScript console warning and immediately print it to the screen. When it’s done loading, we use console.log to output the message that it has finished, and we use console.dir to display the properties of the object myData to the screen.

Example 3

In Example 3, we can see how to create a getScript function from scratch and eliminate the need for jQuery. The getScript function that we are creating takes two parameters, scriptUrl and callback.

We enter the scriptUrl directly as, but our callback is going to be another function called onScriptLoad. The onScriptLoad function takes care of using the console to let us know that the script has loaded and to show us the properties of the myData object we saw in the last example.

Here’s what’s happening:

  • The getScript function creates a new script document element.
  • It assigns scriptUrl as the source of the script and downloads the contents into the constant named script.
  • When the script named script finishes loading it calls the callback function onScriptLoad.
  • The onScriptLoad function uses console.log to tell us the script is loaded.
  • The onScriptLoad function uses console.dir to tell us the properties of myData.

Example 4

In Example 4, we show you two more ways to do pretty much the same thing we do in Example 3, but in a more precise way.

Example 4a

In the first part of this example, we show we can use an anonymous function as our call back instead of creating a separate named function for the task. This method allows us to embed the anonymous function in the calling statement and use one function and the calling statement instead of two functions and a calling statement. Fewer functions save us a bit of typing, and your code will be a little bit easier to read and follow.

Example 4b

In the second part of the example, we use an arrow function to take the place of the anonymous function and reduce the amount of typing necessary even further. This method is the preferred way to accomplish loading external scripts in most cases that do not use jQuery.


As you can see, you are not limited to using jQuery for loading external scripts into your program. In most cases, jQuery will be the answer because there is so much more you can do with it, and you are likely to take advantage of the library in many ways if you are developing a website or application. If you are doing something small, though, and there is no reason to load the library, you can take advantage of these examples to avoid using the library.

We hope that you have enjoyed reading over these examples and have learned something new. If these examples have improved your understanding and your coding skills, please share these jQuery getScript alternatives on Facebook and Twitter.

Validating a JavaScript Array


validating a JavaScript arrayIf you have a function that takes one more more arrays as arguments, don’t assume arrays are what you will get. Validating a JavaScript array can help prevent unexpected errors in your code.

In this article you will learn how about validating a JavaScript array. There are many times when you only want code to execute on an array that is holding one or more values. To prevent any non-arrays from entering your code, we must implement some validation techniques. Continue reading “Validating a JavaScript Array”