편리한 콘솔.xxx
5349 단어 JavaScript
최근에 알게 된 콘솔.xxx를 소개합니다.
console.log()
누구나 할 수 있는 콘솔.log().devtools 콘솔에 매개 변수의 출력 결과를 표시합니다.
console.log()
console.error(), console.warn(), console.info()
콘솔을 나타냅니다.로그랑 똑같아요.그러나 문자색과 배경색을 대체하여 돋보이게 할 수 있다.
(왜 info와 log는 차이가 없습니까?)
console.info()
console.warn()
console.error()
console.table()
배열과 객체 데이터를 테이블 형식으로 표시합니다.
console.log, 하나하나 펼치는 것보다 보기 쉬워요.
요즘 쓸모없는 콘솔.테이블 사용 중입니다.
console.log()
console.table()
console.dir()
출력 결과를 디렉터리로 표시할 수 있는 구성원입니다.Aray와 Object 등에서 콘솔.로그와 크게 달라진 것은 없지만 DOM 트리 등이 표시될 때는 다르다.
console.log()
console.dir()
console.time(), console.timeLog()
처리 시간을 측정하기 편리하다.
console.타이머를 시간(타이머 이름)으로 설정하고 를 클릭합니다.
console.타임로그 출력을 통해 타이머 이후의 경과 시간을 설정할 수 있습니다.let timeDemo = () => {
// タイマー"demo"のセット
console.time("demo")
setInterval(()=>{
// 1000msごとに今のタイマー"demo"の経過時間を表示
console.timeLog("demo")
}, 1000)}
실행 결과
console.time(), console.timeLog()
console.trace()
console.trace () 를 호출하기 전의 경로를 출력할 수 있습니다.
이 함수는 어디에서 어떻게 호출되었는지 조사할 때 매우 편리하다.function trace() {
console.trace()
}
function c() {
trace()
}
function b() {
c()
}
function a() {
b()
}
실행 결과
console.trace()
참고 자료
콘솔을 나타냅니다.로그랑 똑같아요.그러나 문자색과 배경색을 대체하여 돋보이게 할 수 있다.
(왜 info와 log는 차이가 없습니까?)
console.info()
![](https://s1.md5.ltd/image/0517431468dc54243d97f5f265ba70d4.png)
console.warn()
![](https://s1.md5.ltd/image/0209c51348fcbb4eb244a6845cfb5119.png)
console.error()
![](https://s1.md5.ltd/image/ddfe239ea49939d328156e87d79ef783.png)
console.table()
배열과 객체 데이터를 테이블 형식으로 표시합니다.
console.log, 하나하나 펼치는 것보다 보기 쉬워요.
요즘 쓸모없는 콘솔.테이블 사용 중입니다.
console.log()
console.table()
console.dir()
출력 결과를 디렉터리로 표시할 수 있는 구성원입니다.Aray와 Object 등에서 콘솔.로그와 크게 달라진 것은 없지만 DOM 트리 등이 표시될 때는 다르다.
console.log()
console.dir()
console.time(), console.timeLog()
처리 시간을 측정하기 편리하다.
console.타이머를 시간(타이머 이름)으로 설정하고 를 클릭합니다.
console.타임로그 출력을 통해 타이머 이후의 경과 시간을 설정할 수 있습니다.let timeDemo = () => {
// タイマー"demo"のセット
console.time("demo")
setInterval(()=>{
// 1000msごとに今のタイマー"demo"の経過時間を表示
console.timeLog("demo")
}, 1000)}
실행 결과
console.time(), console.timeLog()
console.trace()
console.trace () 를 호출하기 전의 경로를 출력할 수 있습니다.
이 함수는 어디에서 어떻게 호출되었는지 조사할 때 매우 편리하다.function trace() {
console.trace()
}
function c() {
trace()
}
function b() {
c()
}
function a() {
b()
}
실행 결과
console.trace()
참고 자료
출력 결과를 디렉터리로 표시할 수 있는 구성원입니다.Aray와 Object 등에서 콘솔.로그와 크게 달라진 것은 없지만 DOM 트리 등이 표시될 때는 다르다.
console.log()
console.dir()
![](https://s1.md5.ltd/image/553fe0aa79dc925d3cf2ba34c5e18d75.gif)
![](https://s1.md5.ltd/image/a7bae743b9a87de3bc0447dc625412ce.gif)
console.time(), console.timeLog()
처리 시간을 측정하기 편리하다.
console.타이머를 시간(타이머 이름)으로 설정하고 를 클릭합니다.
console.타임로그 출력을 통해 타이머 이후의 경과 시간을 설정할 수 있습니다.let timeDemo = () => {
// タイマー"demo"のセット
console.time("demo")
setInterval(()=>{
// 1000msごとに今のタイマー"demo"の経過時間を表示
console.timeLog("demo")
}, 1000)}
실행 결과
console.time(), console.timeLog()
console.trace()
console.trace () 를 호출하기 전의 경로를 출력할 수 있습니다.
이 함수는 어디에서 어떻게 호출되었는지 조사할 때 매우 편리하다.function trace() {
console.trace()
}
function c() {
trace()
}
function b() {
c()
}
function a() {
b()
}
실행 결과
console.trace()
참고 자료
let timeDemo = () => {
// タイマー"demo"のセット
console.time("demo")
setInterval(()=>{
// 1000msごとに今のタイマー"demo"の経過時間を表示
console.timeLog("demo")
}, 1000)}
console.trace () 를 호출하기 전의 경로를 출력할 수 있습니다.
이 함수는 어디에서 어떻게 호출되었는지 조사할 때 매우 편리하다.
function trace() {
console.trace()
}
function c() {
trace()
}
function b() {
c()
}
function a() {
b()
}
실행 결과console.trace()
![](https://s1.md5.ltd/image/4a6f42163f289fb27d74b0d3ffdc642f.gif)
참고 자료
https://developer.mozilla.org/ja/docs/Web/API/console/timeLog
https://gihyo.jp/book/2019/978-4-297-10368-2
https://qiita.com/YumaInaura/items/0d8427bfe2d7be476d0d
Reference
이 문제에 관하여(편리한 콘솔.xxx), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://qiita.com/ryo2132/items/64c616a4cf0ae8770a9f텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)