JavaScript 如何使用console.log()打印多个变量

在JavaScript中，console.log()是一种用于将值或任何消息输出到浏览器控制台的方法。要在浏览器中查看控制台，我们可以按F12键快捷键。此方法主要用于测试或调试目的。

在本文中，我们将讨论在控制台上显示多个变量的各种方法。

语法：

console.log(val)  

参数： 它可以接受多个参数，可以是变量、字符串或两者的组合。

返回值： 它将传递的参数打印在控制台上。

方法1：使用逗号分隔变量

• 声明变量并赋予随机值
• 调用console.log方法并传递以逗号分隔的变量

示例： 这个示例实现了上述方法。

Javascript

let var1 = 5; 
let var2 = "Hello GEEK"; 
let var3 = true; 
  
console.log(var1, var2, var3);

输出

5 Hello GEEK true

使用上述方法，可读性会降低，因为我们不知道哪个值属于哪个变量。因此，我们使用花括号的方式来解决这个问题。

方法2：使用花括号分隔的变量

• 声明变量并传递随机值
• 调用console.log方法并传递以逗号分隔的变量
• 将变量值放在花括号中

Javascript

let var1 = 5; 
let var2 = "Hello GEEK"; 
let var3 = true; 
  
console.log({var1, var2, var3});

输出

{ var1: 5, var2: 'Hello GEEK', var3: true }

如果我们想要在控制台中打印带有变量的消息，可以使用类似 %s、%f、%o 的占位符在 console.log 方法的参数中。

方法 3：使用占位符

• 声明变量并传入随机值
• 调用 console.log 方法并将消息作为字符串传入
• 在想要插入变量的位置添加占位符
• 在消息后面加上逗号，并写上变量名

Javascript

let var1 = "DSA"; 
let var2 = "Web Development"; 
  
console.log("Use GeeksforGeeks to learn %s and %s", var1, var2);

输出

Use GeeksforGeeks to learn DSA and Web Development

方法4：通过使用 模板字面量

• 声明变量并传入随机值
• 调用console.log方法并将消息作为带有反引号的字符串传递
• 在${}内添加变量名

JavaScript

let var1 = "DSA"; 
let var2 = "Web Development"; 
  
console.log(`Use GeeksforGeeks to learn {var1} and{var2}`);

输出

Use GeeksforGeeks to learn DSA and Web Development