javascript

1.6 JavaScript Comments

Learn what JavaScript comments are, why they are important, and how to use single-line and multi-line comments effectively to make your code clear and understandable for yourself and others.

9 min read 8 sections Tutorial

Comments are like sticky notes you put on your code. They help you remember what your code does and explain it to other people. The computer ignores comments completely, so they do not change how your program works.

1.6 JavaScript Comments

A comment is a special line or block of text in your code that the computer ignores. It is purely for humans to read. You use comments to explain what your code does, why you wrote it a certain way, or to temporarily turn off parts of your code.

Comments are super important for making your programs easy to understand. Imagine reading a book with no chapter titles or explanations – it would be confusing! Comments do the same job for your code.

What is a Comment?

A comment is a piece of text in your code that is completely ignored by the JavaScript engine. Its purpose is to provide explanations or notes for human readers.

Single-line //

Use two forward slashes // for comments that fit on one line. Everything after // is ignored.

Multi-line /* */

Use /* to start a comment block and */ to end it. This lets comments span many lines.

Explain Code

Comments help you and others understand complex parts of your program or the reason for a specific choice.

Disable Code

You can use comments to temporarily turn off a line or block of code without deleting it.

Adding Your First Comment

Getting Started

Adding Your First Comment

Adding a comment is simple. For a single line, you just type two forward slashes // at the beginning of the line, or after some code. Everything you write after // on that line will be a comment.

For comments that need more space, you use /* to start and */ to end. Everything in between these two markers is a comment, even if it spans many lines.

javascriptUsing single-line and multi-line comments

1// This is a single-line comment. It explains the next line.
2let score = 100; // This comment is at the end of a line of code
3
4/*
5This is a multi-line comment.
6It can explain a bigger part of your code.
7It starts with /* and ends with */
8*/
9const MAX_ATTEMPTS = 3;
10
11console.log(score);      // Display the score value
12console.log(MAX_ATTEMPTS); // Display the maximum attempts

Don't forget the comment markers!

If you forget to add // or /* */ around your comments, the computer will try to read your words as code. This will cause errors and stop your program from working.

This is a comment without slashes; // ❌ SyntaxError
let value = 10;

Single-line vs. Multi-line Comments

Knowing when to use // or /* */ is important. Use // for quick notes, like explaining a single line of code or a small variable. It is perfect for short explanations.

Use /* */ for longer explanations that need multiple sentences or paragraphs. This is also great for temporarily turning off a large block of code while you are testing things.

javascriptDemonstrating both comment types

1// Define a player's starting health points
2let playerHealth = 100;
3
4/*
5This section handles player movement.
6It checks for keyboard input and updates the player's position on the screen.
7We need to make sure the player stays within the game boundaries.
8*/
9function movePlayer() {
10  // Check if 'w' key is pressed
11  // For now, just log a message to the console
12  console.log("Player is moving forward!");
13}
14
15movePlayer(); // Call the function to simulate movement

✗ BadBad — Unclear Code

let a = 10;
let b = 20;
let c = a + b;

✓ GoodGood — Clear with Comments

// Initialize the first number for calculation
let firstNumber = 10;
// Initialize the second number
let secondNumber = 20;
// Calculate the sum of the two numbers
let totalSum = firstNumber + secondNumber;

Commenting Best Practices

Good comments explain why your code does something, not just what it does. If your code is already clear, you might not need a comment. For example, let age = 25; is clear enough on its own.

But if you have a tricky calculation or a special reason for a piece of code, a comment is very helpful. Always try to write code that is easy to understand first, then add comments where extra explanation is truly needed.

Too Many Comments

Just Right Comments

Too Many Comments

// Declare a variable called 'name'
let name = 'Alice'; // Assign the string 'Alice' to 'name'

// Print the value of 'name' to the console
console.log(name); // Display 'Alice'

Just Right Comments

// Initialize the user's name
let name = 'Alice';

// Log the user's name to confirm it's set correctly
console.log(name);

// Declare a variable called 'name'
let name = 'Alice'; // Assign the string 'Alice' to 'name'

// Print the value of 'name' to the console
console.log(name); // Display 'Alice'

// Initialize the user's name
let name = 'Alice';

// Log the user's name to confirm it's set correctly
console.log(name);

Explain the 'Why'

Focus your comments on explaining the reason behind your code, or any complex logic. The 'what' should be clear from the code itself. If your code is hard to understand without comments, try making your code simpler first.

Using Comments for Debugging

Comments are super useful when your code is not working correctly. This is called debugging. If you have a bug, you can use comments to temporarily turn off parts of your code. This helps you figure out exactly which part is causing the problem.

You can comment out a line or a whole block of code to see if the error goes away. If it does, you know the problem is in the code you just commented out.

Identify a potential error

Imagine you have some code that is crashing, and you suspect a specific line or function.

javascriptIdentify a potential error

1let value = 10;
2// This line might be causing a problem
3let result = value * 'two'; // ❌ This will cause an error!
4console.log(result);

Comment out the suspicious code

Use // or /* */ to disable the code you think is causing the bug. Run your program again.

javascriptComment out the suspicious code

1let value = 10;
2// let result = value * 'two'; // Commented out to test
3console.log(value); // Now this line runs without error

Fix the problem

If the error disappears, you know the commented-out code was the issue. Now you can fix it properly.

javascriptFix the problem

1let value = 10;
2let result = value * 2; // ✅ Fixed: 'two' changed to 2
3console.log(result);

Uncomment the fixed code

Once fixed, remove the comment markers to turn the code back on.

javascriptUncomment the fixed code

1let value = 10;
2let result = value * 2; // Now the code works as expected
3console.log(result);

Remove outdated comments

Leaving old, incorrect, or confusing comments in your code can be worse than having no comments at all. Always keep your comments up-to-date with your code. If you change the code, change the comment too, or remove it.

Comment Syntax Reference

Type	Syntax	Purpose	Example
Single-line	`//`	Short notes, explaining one line, or commenting out a single line.	`// This is a note`
Multi-line	`/* ... */`	Longer explanations, block-level descriptions, or commenting out multiple lines.	`/* This is a block of text */`

Test Your Knowledge

Quick Check

Which symbol is used for a single-line comment in JavaScript?

Quick Check

How do you start and end a multi-line comment in JavaScript?

Quick Check

What happens if you forget the comment markers around your comment text?

Quick Check

What is the best practice for writing comments?

Quick Reference

Pro Tips

1Comments — text in your code that the computer ignores, used for human understanding.
2Single-line — use // to comment out everything after it on that line.
3Multi-line — use /* to start and */ to end a comment block that spans multiple lines.
4Purpose — explains code, documents reasoning, and temporarily disables code.
5Debugging — use comments to turn off parts of code to find errors.
6No performance impact — comments are removed before the code runs, so they do not slow down your program.
7Explain 'Why' — focus on explaining the reason for code choices, not just what the code does.
8Keep updated — always make sure your comments match your code. Remove or update old comments.
9Avoid clutter — do not over-comment simple code. Clear code often needs fewer comments.
10Readability — good comments make your code much easier for others (and future you!) to understand.

Code Readability

Learn more techniques to write code that is easy to read and understand without excessive comments.

Debugging Tools

Discover browser developer tools that help you find and fix errors in your JavaScript code.

Functions

Understand how comments are especially useful when explaining what a function does or how to use it.

Variables

Revisit how variables store data and how comments can help clarify their purpose in complex programs.

You now understand JavaScript Comments!

You have learned how to use single-line and multi-line comments, why they are important for explaining code, and how they can help you debug. Comments are a fundamental tool for writing clear, maintainable JavaScript.

Try it in the Javascript Compiler

Run and experiment with Javascript code right in your browser — no setup needed.

Open Javascript Compiler

Continue Learning

Previous Next