HTML DOM  provides the console object in order to use some auxiliary functions related to the browser. console.log() is one of the useful functions where it will simply print given data, integer, variable, string, JSON to the browser console.

HTML DOM提供了console对象,以便使用一些与浏览器相关的辅助功能。 console.log()是有用的功能之一,它将简单地将给定的数据,整数,变量,字符串,JSON打印到浏览器控制台。

(console.log() Syntax)

console.log() function has very simple syntax where it accepts single or multiple parameters to print their data to the browser console.

console.log()函数的语法非常简单,它接受单个或多个参数以将其数据打印到浏览器控制台。

console.log(PARAM1,PARAM2,...)

`PARAM` is used to provide the parameter which type can be anything where its data will be logged to the browser console.

(console.log() Function Use Cases)

console.log() function provides a lot of powerful use cases to make developer life easier. Here we will list some of the most popular them.

console.log()函数提供了许多功能强大的用例,以简化开发人员的生活。 在这里,我们将列出一些最受欢迎的广告。

  • Debugging the provided function or variable in real-time and an easy way.
  • Printing some error and warning related data about the web application
  • Providing a hidden user interface for experienced users from the console.从控制台为有经验的用户提供隐藏的用户界面。

(Print A Variable To The JavaScript Console)

We will start with simple examples where we will print some variables to the browser console. These variable types will be different like string, integer bool etc.

我们将从简单的示例开始,在这些示例中,我们将一些变量输出到浏览器控制台。 这些变量类型将有所不同,例如字符串,整数布尔值等。

console.log("Selam","Poftut.com")
//Output will be Selam Poftut.com

sitename="poftut.com";

console.log(sitename);
//Output will be poftut.com

username="ismail";

console.log(username);
//Output will be ismail

age=35;

exist=false;

console.log(age);
//Output will be 35

console.log(exist);
//Output will be false

JavaScript中控制台输出的语句怎么查看 js控制台打印的函数_python

Print A Variable To The JavaScript Console 将变量打印到JavaScript控制台

将字符串打印到JavaScript控制台(Print String To The JavaScript Console)

One of the most used examples of console.log() function is printing or displaying strings in the browser JavaScript console. We will provide single or multiple strings in different ways and formats to the console.

console.log()函数最常用的示例之一是在浏览器JavaScript控制台中打印或显示字符串。 我们将以不同的方式和格式向控制台提供单个或多个字符串。

console.log("poftut.com");
//Otput will be poftut.com

console.log("poftut.com","ismail baydan");
//Otput will be poftut.com ismail baydan

console.log("poftut.com","ismail baydan","ahmet ali");
//Otput will be poftut.com ismail baydan ahmet ali

console.log("poftut.com","ismail baydan","ahmet ali","Elif ecrin");
//Otput will be poftut.com ismail baydan ahmet ali Elif ecrin

console.log("poftut.com","ismail baydan","ahmet ali",9);
//Otput will be poftut.com ismail baydan ahmet ali 9

JavaScript中控制台输出的语句怎么查看 js控制台打印的函数_js_02

Print String To The JavaScript Console 将字符串打印到JavaScript控制台

将编号/整数打印到JavaScript控制台(Print Number/Integer To The JavaScript Console)

We can also print numbers, integers, floating-point numbers by using the console.log() function.

我们还可以使用console.log()函数打印数字,整数,浮点数。

console.log(0)
//Output will be 0

console.log(10)
//Output will be 10

console.log(101)
//Output will be 101

console.log(101.5)
//Output will be 101.5

console.log(-101.5)
//Output will be -101.5

console.log(-101.5987654321)
//Output will be -101.5987654321

console.log(-101.5987654321123456789)
//Output will be -101.59876543211234

JavaScript中控制台输出的语句怎么查看 js控制台打印的函数_css_03

Print Number/Integer To The JavaScript Console 将数字/整数打印到JavaScript控制台

将字符打印到JavaScript控制台(Print Char To The JavaScript Console)

String variables consist of characters where it is depicted as character data type. We can also print the chars to the browser console like below.

字符串变量由字符组成,在此将其描述为字符数据类型。 我们还可以将字符打印到浏览器控制台,如下所示。

console.log('i')
//Output will be i

console.log('i','s');
//Output will be  i s

console.log('i','s','m');
//Output will be  i s m

console.log('i','s','m','a');
//Output will be i s m a

console.log('i','s','m','a','i');
//Output will be  i s m a i

console.log('i','s','m','a','i','l');
//Output will be i s m a i l

JavaScript中控制台输出的语句怎么查看 js控制台打印的函数_字符串_04

Print Char To The JavaScript Console 将字符打印到JavaScript控制台

将数组打印到JavaScript控制台(Print Array To The JavaScript Console)

Arrays are used to store multiple values like a list. We can also print the array contents to the browser console with the  console.log() function. The array elements can be same type of different types.

数组用于存储多个值,例如列表。 我们还可以使用console.log()函数将数组内容打印到浏览器控制台。 数组元素可以是同一类型,也可以是不同类型。

names=["ismail"];
console.log(names);
//Output will be ["ismail"]

names=["ismail","elif"];
console.log(names);
//Output will be ["ismail", "elif"]

names=["ismail","elif","ahmet"];
console.log(names);
//Output will be ["ismail", "elif", "ahmet"]

numbers=[1,2,3,4];
console.log(numbers);
//Output will be [1, 2, 3, 4]

myarr=["ismail","ahmet",1,2,3];
console.log(myarr);
//Output will be ["ismail", "ahmet", 1, 2, 3]

JavaScript中控制台输出的语句怎么查看 js控制台打印的函数_javascript_05

Print Array To The JavaScript Console 将数组打印到JavaScript控制台

将JSON数据打印到JavaScript控制台(Print JSON Data To The JavaScript Console)

JSON is a popular data type or structure in order to store different types of data. We can also print the JSON type data to the browser console without any special operation just providing the JSON object name to the console.log() function.

JSON是一种流行的数据类型或结构,用于存储不同类型的数据。 我们也可以将JSON类型数据打印到浏览器控制台,而无需任何特殊操作,只需将JSON对象名称提供给console.log()函数即可。

var names = { firstname : "İsmail", lastname : "Baydan" };

console.log(names);

(Print Object To The JavaScript Console)

We can also print some object data to the browser console. But there is a trick where using some formatting and parsing function about JSON will make things cleaner. We can use the following example to print object with console.log().

我们还可以将一些对象数据打印到浏览器控制台。 但是有一个技巧,在JSON中使用一些格式化和解析功能可以使事情变得更整洁。 我们可以使用以下示例通过console.log()打印对象。

console.log(JSON.parse(JSON.stringify(obj)));

(console.log() vs console.dir())

console.dir() function provides similar functions to the  console.log(). console.dir() also prints the given data to the console. The difference between console.log() and console.dir() is the console.dir() function prints data as more formatted way like JSON-like tree but the console.log() function prints given data HTML-like tree to the browser console.

console.dir()函数提供的功能与console.log()类似。 console.dir()还将给定的数据打印到控制台。 console.log()和console.dir()之间的区别在于,console.dir()函数将数据打印为更具格式的方式(例如,类似于JSON的树),但console.log()函数将给定的数据类似于HTML的树打印至浏览器控制台。

names=["ismail","elif","ahmet"];
console.dir(names);

["ismail", "elif", "ahmet"] numbers=[1,2,3,4];
console.dir(numbers);

myarr=["ismail","ahmet",1,2,3];
console.dir(myarr);

JavaScript中控制台输出的语句怎么查看 js控制台打印的函数_js_06

console.log() vs console.dir() console.log()与console.dir()

LEARN MORE  JavaScript Console Object and Functions Tutorial with Examples

了解更多JavaScript控制台对象和函数教程以及示例

翻译自: https://www.poftut.com/javascript-console-log-function-tutorial-with-examples/