Super useful console usage collection

Are there any front-end friends like me who have been console.log() printing information (🙋…)? Recently, I saw a foreign article about several common console methods, super practical, I hope you can improve the development efficiency after reading.

Posts are posted on Github first

JS source

1.Congsole.log (), console.error(), console.warn(), console.info()

Recommended index: ⭐️⭐️ ️

These methods can take multiple arguments

 const json = {a: 1, b: 2}

 console.log("log ==> ", json, new Date())
 console.error("error ==> ", json, new Date())
 console.warn("warn ==> ", json, new Date())
 console.info("info ==> ", json, new Date())

Copy the code

2,console.group()

Recommended index: ⭐️⭐️ disk ⭐ password

Console.group () prints a series of console.logs

 function doSomething(obj) {
  console.group('doSometing... ')
  const _data = new Date();
  console.log('evauating data ==>', _data);
  const _fullName = `${obj.fistName} ${obj.lastName}`;
  console.log('fullName ==>', _fullName);
  const _id = Math.random(1)
  console.log('id ==> ', _id);
  console.groupEnd();
 }

 doSomething({'firstName': 'hank'.'lastName': 'zhuo'})

Copy the code

3,console.table()

Recommended index: ⭐️⭐ 100 ⭐ ⭐️⭐️

Console.table () is nice to print arrays and objects

 const typeOfConsole = [
   {name: 'log'.type: 'standard'},
   {name: 'info'.type: 'standard'},
   {name: 'table'.type: 'standard'}
 ]

 console.table(typeOfConsole)

 const mySocial = {
   faceboo: true,
   linkedin: true,
   instagram: true,
   twitter: false
 }

 console.table(mySocial)
Copy the code

4,Console.count (), console.time(), console.timeend ()

Recommended index: ⭐️⭐️⭐ ⭐️⭐️

• 1.console.count()Count and print the number of times of the same type,
• 2,The console. Time (), the console. TimeEnd ()The time taken to calculate the program */

 console.time('total');
 console.time('init arr');
 const arr = new Array(20);
 console.timeEnd('init arr');

 for (var i = 0; i < arr.length; i++) {
   arr[i] = new Object();
   console.log(i)
   const _type = (i % 2 === 0) ? 'even' : 'odd'
   console.count(_type + 'added');
 }

 console.timeEnd('total')

Copy the code

5,The console. The assert (), the console. The trace ()

Recommended index: ⭐️⭐️ disk ⭐ password

• 1.console.assert()Conditional printing, as long as the incoming conditions are satisfactory to print
• 2,console.trace()Print the tracking

function lesserThan(a, b) {
   console.assert(a < b, {'message': 'a is not lesser than b'.'a': a, 'b': b})
 }

lesserThan(6, 5);

function foo() {
  function bar() {
    console.trace();
  }
  bar();
}

foo();

Copy the code