The console.log function is a crucial feature in JavaScript that is used to display output in the console.
Syntax:
console.log("");
Arguments: The console.log function accepts a parameter that can be a message, an object, an array, or any other data type.
Output: This function returns a value that is provided as an argument.
We can utilize the console.log method in many ways:
- Giving a message as an argument
- Giving a string as an argument
- Giving a char as an argument
- Giving a number as an argument
- Giving a string with the message as an argument
- Giving a number with the message as an argument
- Giving a char with the message as an argument
- Giving a function as an argument
- Giving an object as an argument
- Giving an array as an argument
Let's explore each of them by using demonstrations as a guide.
Giving a message as an argument
When a message is passed as an argument to the console.log method, it will be displayed in the console.
Demo:
console.log("Welcome to my website");
Output:
The message can be observed in the console.
Welcome to my website
Giving a string as an argument
When a string is provided as an argument to the console.log method, the string will be displayed in the console.
Demo:
let st = "Hello, how are you?";
console.log(st);
Output:
We can witness the string to the console.
Hello, how are you?
Giving a char as an argument
When a character is provided as an argument to the console.log method, it will be displayed in the console output.
Demo:
let chr = "%";
console.log(chr);
Output:
We can witness the character on the console.
Giving a number as an argument
When a number is passed as an argument to the console.log method, it will be displayed in the console.
Demo:
let n = 10;
console.log(n);
Output:
We can witness the number to the console.
Giving a string with the message as an argument
When a string is passed as an argument to the console.log method, the method will display the string along with any accompanying message.
Demo:
let st= "How are you?";
console.log("Hi dear, " +st);
Output:
We can display the string containing the message on the console.
Hi dear, How are you?
Giving a number with the message as an argument
When a number is provided as an argument to the console.log method, the method will display the number along with any accompanying message.
Demo:
let a = 4;
lt b = 11;
let sum = a+b;
console.log("The sum of a and b is " +sum);
Output:
We can display the value along with a message on the console.
The sum of a and b is 15
Giving a char with the message as an argument
When a character is passed as an argument to the console.log method, the method will display the character along with the message.
Demo:
let chr = '&';
console.log("The ampersand symbol looks like this: " +chr);
Output:
It is possible to observe the character along with a message being displayed on the console.
The ampersand symbol looks like this: &
Giving a function as an argument
When a function is passed as an argument to the console.log method, the method will display the output produced by the function.
Demo:
function func() {return (105+4);}
console.log(func());
Output:
The output of the function can be displayed on the console for observation.
Giving an object as an argument
When an object is passed as an argument to the console.log method, it will display the object in the console.
Demo:
var obj = {
Website: "Example",
Domain: "www.logic-practice.com",
Description: "This website provides online learning tutorials."
};
console.log(obj);
Output:
We can witness the object to the console.
{
Website: 'Example',
Domain: 'www.logic-practice.com',
Description: 'This website provides online learning tutorials.'
}
Giving an array as an argument
When an array is passed as an argument to the console.log method, it will display the contents of the array on the console.
Demo:
let cars = ["BMW", "Skoda", "Hyundai", "Mahindra", "Honda", "Volkswagen"];
console.log(cars);
Output:
We can witness the object to the console.
[ 'BMW', 'Skoda', 'Hyundai', 'Mahindra', 'Honda', 'Volkswagen' ]
Following are the browsers that support the console.log method:
- Google Chrome
- Safari
- Mozilla Firefox
- Microsoft Edge
- Opera
Conclusion:
In this tutorial, we have explored the JavaScript console.log function. Through practical examples, we have gained an understanding of various techniques for leveraging the console.log function.