JavaScript Your First Program: console.log Basics for Beginners
Your first JavaScript program is usually a simple console.log() call. It prints text or values so you can confirm that JavaScript is running and start learning how code produces output.
Quick answer: Use console.log() to send output to the browser console or terminal. For example, console.log('Hello, world!') prints a message and is the standard first step in JavaScript.
Difficulty: Beginner
You'll understand this better if you know: how to open a code editor, what a string is, and the basic idea that JavaScript runs statements one line at a time.
1. What Is console.log()?
console.log() is a built-in JavaScript method that writes a message to the console. The console is a developer tool in the browser or a text output area in Node.js.
- It is used to display text, numbers, variables, and objects.
- It helps you test code without building a user interface.
- It is one of the simplest ways to see what your program is doing.
- It does not show anything on the web page by itself.
For beginners, this is often the first complete program because it proves that your JavaScript file is working.
2. Why console.log() Matters
Printing output is one of the fastest ways to learn programming. With console.log(), you can check whether your code runs, inspect values, and understand how statements behave.
It matters because JavaScript often runs in places where you cannot see internal values directly. Logging gives you a simple feedback loop while you learn syntax, variables, functions, and control flow.
3. Basic Syntax or Core Idea
The simplest form
The basic pattern is a call to the console object’s log method, followed by parentheses containing the value you want to print.
console.log('Hello, world!');This example prints the text Hello, world! to the console. The quotation marks make it a string.
What each part means
- console is the built-in object that handles developer output.
- log is the method you call on that object.
- () contains the value or values to display.
- ; ends the statement in a clear, conventional way.
4. Step-by-Step Examples
Example 1: Print a simple message
This is the classic first program. It confirms that JavaScript can run and produce output.
console.log('Hello, world!');When you run this code, the console shows the message exactly as written inside the quotes.
Example 2: Print a number
You do not need quotes for numbers. JavaScript prints the numeric value directly.
console.log(42);This is useful when you want to confirm calculations or check hard-coded values.
Example 3: Print a variable
Logging a variable is one of the most common uses of console.log(). It helps you see what value the variable currently holds.
const name = 'Ava';
console.log(name);The console shows Ava, not the word name, because the variable is evaluated before printing.
Example 4: Print multiple values
You can pass more than one value to console.log(). JavaScript prints them separated by spaces in the console.
const language = 'JavaScript';
const year = 2026;
console.log(language, year);This is helpful for checking related values together during debugging.
Example 5: Print a formatted sentence
You can also combine text and variables into one message with a template literal.
const user = 'Mina';
const score = 18;
console.log(`User ${user} scored ${score} points`);This is a natural way to build readable output without string concatenation.
5. Practical Use Cases
- Checking that a script file is connected and running.
- Verifying that a browser or Node.js environment is executing your code.
- Inspecting variable values while learning or debugging.
- Tracing the order in which functions run.
- Confirming the result of a calculation before using it elsewhere.
In real projects, developers often use console.log() as a temporary debugging tool, then remove or replace it later with proper UI output or structured logging.
6. Common Mistakes
Mistake 1: Forgetting the parentheses
console.log is a function call. If you leave off the parentheses, JavaScript refers to the function itself instead of running it.
Problem: This does not print anything because the method is never called.
console.log;Fix: Add parentheses and pass the value you want to print.
console.log('Hello!');The corrected version works because the function is actually executed.
Mistake 2: Using an undefined variable
Beginners often try to print a value before creating it. In that case, JavaScript cannot find the variable and throws a reference error.
Problem: The name has not been declared, so the console reports an error like ReferenceError: message is not defined.
console.log(message);Fix: Declare the variable before logging it.
const message = 'Ready to go';
console.log(message);The fixed version works because the variable exists when console.log() runs.
Mistake 3: Expecting output on the web page
console.log() writes to the console, not to the HTML document. This is one of the most common early misunderstandings.
Problem: The code runs, but nothing appears in the page content because console output is separate from page rendering.
console.log('Visible in the console only');Fix: If you want visible page content, write to the DOM instead of the console.
const output = 'Visible on the page';
document.querySelector('#app').textContent = output;The corrected version works because it updates page content instead of logging to the console.
7. Best Practices
Use clear, descriptive messages
When logging text, make it easy to understand later. A vague message like done is less useful than a specific one.
console.log('User profile loaded');This kind of message helps you read logs quickly, especially when several statements run in sequence.
Log the value you need, not everything
It is tempting to print entire objects or many variables at once, but focused logs are easier to scan.
const total = 99;
console.log('Total price:', total);Small, targeted logs make debugging faster and reduce noise in the console.
Remove temporary logs when they are no longer needed
Logging is great during development, but too many leftover logs make real debugging harder.
// Temporary while testing
console.log('Checking step 1');Once the code is stable, delete or replace temporary logging so the output stays meaningful.
8. Limitations and Edge Cases
- console.log() does not show anything to normal users unless they open developer tools or inspect terminal output.
- Browser consoles and Node.js terminals may format objects differently.
- Some environments hide logs in production builds or filter them automatically.
- Logging does not pause code execution; it only reports values.
- Very large objects can be hard to read because consoles often show them in an expandable format.
If console.log() appears to be "not working," the most common causes are that the console is closed, the script never loaded, or the code has an earlier syntax error that stops execution.
9. Practical Mini Project
This tiny program greets a user and confirms a calculation. It shows how console.log() fits into a real script, not just a one-line example.
const firstName = 'Riya';
const items = 3;
const pricePerItem = 12;
const totalPrice = items * pricePerItem;
console.log(`Hello, ${firstName}!`);
console.log('Items:', items);
console.log('Total price:', totalPrice);Expected output:
Hello, Riya!
Items: 3
Total price: 36This example combines strings, variables, and arithmetic so you can see how a small program produces readable output.
10. Key Points
- console.log() prints output for debugging and learning.
- It works in browsers and in Node.js, but the output destination is different.
- You must call it with parentheses to run it.
- It does not display anything on the page by itself.
- It is a development tool, not usually the final way users see results.
11. Practice Exercise
Write a small JavaScript program that prints three lines to the console: your name, your favorite language, and a simple calculation result.
- Use one console.log() call for each line.
- Include at least one variable.
- Make the third line show a calculation such as 2 + 3 or 5 * 4.
Expected output:
Your Name
Favorite language: JavaScript
Calculation result: 20Hint: Store the name and language in variables first, then log them with a sentence.
Solution:
const myName = 'Sam';
const favoriteLanguage = 'JavaScript';
const calculationResult = 5 * 4;
console.log(myName);
console.log(`Favorite language: ${favoriteLanguage}`);
console.log(`Calculation result: ${calculationResult}`);12. Final Summary
Your first JavaScript program is usually a simple console.log() statement, but it teaches an important habit: run code, inspect output, and verify that your assumptions are correct. That makes it one of the most useful beginner tools in JavaScript.
As you continue learning, you will use console.log() to test variables, trace logic, and spot mistakes before they become bigger problems. The next natural step is to learn variables and expressions so you can print values that your program calculates dynamically.