JavaScript Alert…Debugging Tool

In JavaScript, like many languages, there are built in functions/methods to make the developer’s job easier. One that is highly useful is the alert() method. First, let me say that I do not typically use this method in production code because it tends to annoy end users (think pop-ups). With that said, it is highly useful during development to see how your code is functioning. So, let’s dive in and take a look at how alert() works…


All the alert() function does is create a pop-up window with whatever information you pass to the alert function. You can explicitly put content into the alert function or alert the value of a variable in the function. Here is the basic syntax…

[code lang=”js”]
// alert() function hello world example
alert(‘Hello, World!’);

The aforementioned code yields the following results (in FireFox)…



So, as you can see, you can type text directly into the alert function and have it display that text in a message window. You can also do the same with variables…


[code lang=”js”]
// Variables section
// Declare variable to utilize in alert function example
var helloWorld = "Hello, World!";
// Output section
// Use alert function to display value of variable

The code above will return the same results as the earlier screenshot. The difference is that this time, we are alerting a variable and not the text directly. This allows us to see what values are in the variables.

Here is an example where this might be useful in a development environment…

Imagine you have a loop that is changing the value of a variable, then you are outputting that variable to the screen. When you run your code, the out put you are expecting is not what displays. You can use an alert to watch your variable value change while it is looping.

[code lang=”js”]
// Processing and output section
// Use alert function to display value of variable within a loop
for(firstNum = 0;firstNum < 3; firstNum++){

The aforementioned code should loop three times and output the value of the firstNum variable. Since it runs three times, it will alert three times. The first alert displays ‘0’ because the value of the firstNum variable is ‘0’. We are adding one (1) to it each loop. So the second alert displays ‘1’. The third time through, it displays ‘2’.

So the alert function is a very useful function to be able to watch your variables and output the data within them so you can see how your code is functioning. Just a quick side note on using alerts in loops like I demonstrated…do not use it on large loops, unless you like clicking a lot! There are better ways to output that data (hint: console).

Happy Coding!

Clay Hess

More To Explore


Exploring the Broadcast Channel API: Inter-Tab Communication

Intercommunication between different contexts (like tabs, iframes or workers) of the same origin has often been a challenge. With the Broadcast Channel API, developers now have a powerful tool to easily communicate between browsing contexts. In this blog post, we’ll dive deep into the capabilities of the Broadcast Channel API, exploring its features, use cases, and how it can be effectively implemented in your projects.

computer, laptop, work place-2982270.jpg

Unlocking Wireless Communication: A Dive into the Bluetooth API

Wireless communication has become an integral part of our daily lives, and Bluetooth technology is at the forefront of this revolution, enabling devices to exchange data over short distances and creating a world more interconnected than ever before. At the heart of this technology lies the Bluetooth Application Programming Interface (API), a powerful tool for developers looking to harness the capabilities of Bluetooth in their applications. In this blog post, we’ll explore what the Bluetooth API is, how it works, and the possibilities it opens up for innovation in wireless communication.

Share This Post


Need help?

Let's have a chat...


Jump Back In!

Here at Webolution Designs, we love to learn. This includes sharing things we have learned with you. 


Begin Your Learning Journey Today!

Come back inside to continue your learning journey.