Chendi Wu

Appearance

console ​

  1. console.log
javascript
// 使用 JavaScript 代码块标记
console.log('Hello, world!')
  1. console.info
javascript
// 使用 JavaScript 代码块标记
console.info('This is an informational message.')
  1. console.error
javascript
// 使用 JavaScript 代码块标记
console.error('An error has occurred.')
  1. console.warn
javascript
// 使用 JavaScript 代码块标记
console.warn('Warning: This is a warning message.')
  1. console.time & console.timeEnd
javascript
// 使用 JavaScript 代码块标记
console.time('timer')
// Code to measure execution time
console.timeEnd('timer')
  1. console.count
javascript
// 使用 JavaScript 代码块标记
const fruits = ['apple', 'banana', 'orange', 'banana']
fruits.forEach((fruit) => {
  console.count(fruit)
})
  1. console.table
javascript
// 使用 JavaScript 代码块标记
const data = [
  { name: 'Alice', age: 26 },
  { name: 'Bob', age: 27 },
  { name: 'Carl', age: 30 },
]
console.table(data)
  1. console.group, console.groupCollapsed, console.groupEnd
javascript
// 使用 JavaScript 代码块标记
console.group('Group 1')
console.log('Hello, world!')
console.groupEnd()

console.groupCollapsed('Group 2')
console.info('This is some info.')
console.warn('This is a warning.')
console.groupEnd()
  1. console.trace
javascript
// 使用 JavaScript 代码块标记
function foo() {
  console.trace()
}

function bar() {
  foo()
}

bar()
  1. console.assert
javascript
// 使用 JavaScript 代码块标记
const num1 = 5
const num2 = 10
console.assert(num1 === num2, 'The two numbers are not equal!')
  1. console.clear
javascript
// 使用 JavaScript 代码块标记
console.log('This message will not be visible after calling console.clear().')
console.clear()
  1. console 设置 style
javascript
// 使用 JavaScript 代码块标记
console.log(
  '%c My custom message',
  'background-color: #f00; color: #fff; font-size: 20px;'
)