Hơn cã console.log

Trần Đức Lĩnh

Khi đã học JavaScript, thì console.log không còn quá xa lạ gì nữa rồi. Nhưng không ít bạn biết rằng, ngoài console.log ra thì có trên 20 phương thức console khác nhau.


Mục lục.

image-title-here

Các phương thức console bao gồm

  • console.assert()
  • console.clear()
  • console.count()
  • console.debug()
  • console.dir()
  • console.dirxml()
  • console.error()*
  • console.exception()
  • console.group()*
  • console.groupCollapsed()
  • console.groupEnd()*
  • console.info()
  • console.log()*
  • console.profile()
  • console.profileEnd()
  • console.table()*
  • console.time()*
  • console.timeEnd()*
  • console.timeStamp()
  • console.trace()
  • console.warn()*

1. console.log

console.log('Hello word');
  • Kết quả

image-title-here


2. console.log + CSS

console.log('%c Cảnh báo ', 'color: white; background-color: rgba(255,20,14,1);
font-size:20px; border: 1px solid red;border-radius: 999px; padding: 2px 10px',
'Lỗi...');
  • Kết quả

image-title-here


3. console.table()

const hub_1 = { id: "1d4BfD", name: "Duc Linh"};
const hub_2 = { id: "2CFf0A", name: "Somebody..."};
console.table({ hub_1, hub_2})
  • Kết quả

image-title-here


4. console.group()

console.group('Tổng quan');
console.log('Tên: Trần Đức Lĩnh');
console.log('Công việc: Front-End');

console.group('Thêm');
console.log('Địa chỉ: Ninh Hoà - Khánh Hoà');
console.groupEnd();
console.groupEnd();
  • Kết quả

image-title-here


5. console.warn() & console.error()

console.warn("Waring!!!");
  • Kết quả

image-title-here


6. console.time()

console.time("for-loop");
for(let i=0;i<4;i++){
    console.log(i);
}
console.timeEnd("for-loop");
  • Kết quả

image-title-here