codedamn logo
codedamn

JavaScript void(0)

  • Vishnupriya's profile image
    Vishnupriya
    Team codedamn
JavaScript void(0)

Hey readers, in this article we will be learning about what is JavaScript void(0). If you’re new to JavaScript, do check out the JavaScript fundamentals course on Codedamn. Topics that we will be covering in this article are the Introduction to JavaScript void(0) and its uses. After this, in order to understand these concepts more clearly, we will be taking an example of with and without the use of JavaScript void(0). So now that we understood what are we going to learn, let’s get started with the article.

Introduction to JavaScript

Because it allows developers to wrap HTML and CSS code in it, JavaScript is one of the most popular languages for constructing interactive online applications. Users can interact with the online application. It’s also used to make website animations and has a strong GitHub community. There are many libraries for JavaScript, including React, which we will discuss later in this post. JavaScript does not require any libraries because it is a scripting language. JavaScript language code can be written anywhere and executed in the browser. JavaScript has no structure; the browser runs each line of code from top to bottom.

Use cases: 

  • Constructing a web server and its interactive features
  • Adding extra effects to web components with animations and visuals
  • Form validation and exception errors
  • Adding functionality and behavior to web pages

What is JavaScript void(0)?

The void word generally means that the function returns nothing. This is like a JavaScript function that implicitly or explicitly returns “undefined”.

The following code can help you understand this.

A function that returns explicitly example 

function und() {
return undefined
}
und()

A function that returns implicitly example

function und() {
}
und()

Where is JavaScript void(0) used?

It is commonly used in HTML documents with hyperlinks for inserting an expression in a web application page which can produce an unwanted effect. In order to remove the effect, JavaScript void(0) is used. The output of this is often an undefined primitive value. 

Whenever a link is clicked, the page refreshes or loads a new page on the application due to the function inside the link. But sometimes, the refreshing of the page is to be avoided, especially when a JavaScript function is hooked up to that link. During this case, when the refreshing is to be avoided, JavaScript void(0) is used.

Let’s look at an example to better grasp this.

Example without JavaScript void(0)

<!DOCTYPE html>
<html>
<head>
<title>without JavaScript:void(0)</title>
</head>
<body>
<center>
<h1 style="color:yellow">Codedamn</h1>
<h3>This is an example without JavaScript:void(0)</h3>
<a href="#"
ondblclick="alert('Welcome to Codedamn')">
Double click on this button</a>
</center>
</body>
</html>

In this example, # is used in an anchor tag. In this code, the web page is refreshed after the alert message is shown. 

Example with JavaScript void(0)

<!DOCTYPE html>
<html>
<head>
<title>Example using JavaScript:void(0)</title>
</head>
<body>
<center>
<h1 style="color:yellow">Codedamn</h1>
<h3>Example using JavaScript:void(0)</h3>
<a href="javascript:void(0);"
ondblclick="alert('Welcome to Codedamn')">
Double click on this button</a>
</center>
</body>
</html>

In this, an anchor tag JavaScript void(0) is used. This prevents the re-loading of a page and functions of JavaScript can be called with a double or single click.

Conclusion

This was about the void(0) method in JavaScript; if you want to learn more about JavaScript, check out Codedamn course. I hope you enjoyed it;  if you have any questions or recommendations, please let us know in the comments section. Join the codedamn community, read other programming and development articles on the site, and subscribe to our newsletter to stay up to date on new programs and upgrades.

User avatar