JavaScript&TypeScript

JavaScript console.table()

hjkang

많은 사람들이 JavaScript 코드 디버깅 할 때 console.log() 를 사용한다.

console.table()을 활용하여 좀 더 효율적으로 디버깅해보자.

 

console.table()이란?

  • 배열과 객체를 테이블 형식으로 콘솔에 출력
  • 테이블의 헤더를 클릭하여 정렬도 가능

 

 

사용 방법

 

1. 배열

const fruits = ['apple', 'banana', 'mango']
console.table(fruits)

 

 

2. 배열의 배열

const names = [['Kang', 'HyeonJi'], ['Hong', 'GilDong'], ['Kim', 'Test']]
console.table(names)

 

 

3. 객체

const user = {
    name: "Kang HyeonJi",
    age: 30,
}
console.table(user)

 

 

4. 객체의 배열

const users = [
    {
        name: "Kang",
        age: 30
    },{
        name: "Hong",
        age: 20
    },{
        name: "Kim",
        age: 10
    }
]
console.table(users)

 

 

5. 중첩 객체

const teams = {
    leader: {
        name: 'Kang',
        age: 30
    },
    manager: {
        name: 'Hong',
        age: 20
    }
}
console.table(teams)

 

두 번째 매개변수에는 출력하고 싶은 열만 지정 가능(다중 지정 가능)

console.table(teams, ["age"])

 

속성 하나만 지정하여 출력 가능

console.table(teams, "age")

 

 

 


참고

- https://sisiblog.tistory.com/m/350

 

 

 

 

'JavaScript&TypeScript' 카테고리의 다른 글

JavaScript Fetch, Axios 차이  (0) 2023.05.22
JavaScript console.time()  (0) 2023.05.12
JavaScript에서 jwt 발급  (0) 2023.05.11
JavaScript 배열 자르기  (0) 2023.03.29
JavaScript 배열 중간에 요소 추가 및 삭제  (0) 2023.03.29