While learning JavaScript, one of the first things that you will learn about is JavaScript comments. Comments are not part of the actual execution of your program. They are basically notes that are added to your code to explain what is actually happening. They allow you to understand the code later. In this blog, we will discuss what comments are in JavaScript, the types of comments that you can use, and also include examples of both single-line and multi-line comments in JavaScript. So let’s get started!
Table of Contents
A comment in JavaScript is basically a piece of text inside your code that is ignored by the JavaScript engine when you run the program. These comments are only meant for humans to read. JavaScript comments can be useful in the following cases:
- When you want to explain what a section of your code does.
- When you want to make temporary notes while debugging your code.
- When you want to make your code easier to read and understand for others.
A sample code is given below for your understanding:
Code:
Output:
Explanation: As you can see above, for single-line comments ( // ) is used, and for multi-line comments ( /* . . . */ ) is used.
Master Full Stack Development from Scratch
Master web development, deployment, and application management from the ground up.
In JavaScript, comments can be written in two ways:
1. Single-line comments
2. Multi-line comment in JavaScript
Let’s explore the two types of comments in detail:
In JavaScript, you can use // to create a single-line comment. Anything you write after // on that line will be ignored by JavaScript.
Example:
Output:
Explanation: In the above JavaScript code, you can see that the single-line comments are written using //. Both comments are ignored by JavaScript during execution.
In JavaScript, you write multi-line comments when you have to explain something in detail or write notes that contain multiple lines. You do this with / * . . . * / . A sample code is given below for your reference:
Example:
Output:
Explanation: In the above JavaScript, you can see that the multi-line comments are written inside /* */. Everything written inside it is ignored by JavaScript.
Get 100% Hike!
Master Most in Demand Skills Now!
While writing JavaScript inside an HTML file, you can still use JavaScript comments just like you do in a separate .js file. These comments are only for humans to read and will be ignored by the browser when the page runs. This means that you can use / / for single-line comments, and /* … */ for multi-line comments.
These comments help you to read and understand each part of your code.
Example:
Output:
Explanation: The above HTML code uses a JavaScript single-line comment, which explains the step. After that, it prints “Hello World” on the webpage.
Sometimes, while testing or fixing your code, you might want some parts of your JavaScript code to stop running temporarily, without deleting them. This is where you can use JavaScript comments. By converting a code into a comment, you can prevent the code from getting executed.
When you add / / in front of a line (single-line comment) or write multiple lines inside /* … */ (multi-line comment), JavaScript completely ignores that code. This technique can be helpful while debugging, experimenting, or when you want to keep your code for later use.
A sample code is given below for your reference:
Example: For a single-line comment
Output:
Explanation: The above JavaScript code is used to add two numbers. After that, it uses a comment that prevents one console output, while it still shows the result with another console.log().
Code: For multi-line comments
Output:
Explanation: The above JavaScript code uses a multi-line comment to prevent the extra part of the code from getting executed. Instead of that, it executes the subtraction and prints result.
1. JavaScript comments help to make your code easier to understand.
2. Comments in JavaScript help you to debug your code by disabling certain parts of your code.
3. They also help your teammates while working on a project.
4. JavaScript comments help remind you why you wrote a piece of code.
5. Comments also help you save time when you are updating your code later.
1. Too many comments in JavaScript can make your code look messy.
2. Use of outdated comments can confuse you rather than help.
3. Overuse of comments makes it hard for you to understand the code.
4. Comments in JavaScript can slow you down if they repeat the obvious things in the code.
5. Large blocks of comments can distract from the actual code.
1. You should use single-line comments for short notes.
2. You should use the multi-line comments for explaining complex logic.
3. Always write comments to explain “why” and not “what”.
4. You should always keep your comments clear, simple, and easy to read.
5. You should always update or remove your comments every time you change your code.
Conclusion
JavaScript comments are small but powerful elements that help make your code easier to read, understand, debug, and share. With the help of single-line comments for quick notes and multi-line comments for detailed explanations, you can keep your code clean and easier to understand. While working alone or with a team, it is good to have the habit of commenting to prevent any confusion. Therefore, you should always remember to use your comments carefully so that your JavaScript code looks more friendly and future-proof.
Upskill today by enrolling in our Full Stack Development Course. Prepare for your next interview with our JavaScript Interview Questions.
Q1. Do JavaScript comments affect performance?
No, comments don’t affect the performance as they are ignored by the browser.
Q2. Can I use emojis or symbols inside JavaScript comments?
Yes, you can use or write anything inside the comments, as they are ignored by JavaScript and are not executed.
Q3. Are comments visible to users on a webpage?
No, users can only see the output of your code and not the comments.
Q4. Can Comments be nested in JavaScript?
No, you cannot nest comments one inside another in JavaScript.
Q5. Should I write comments for every line of code?
No, it is not necessary. You can add comments where an explanation is required.