[clique aqui para ler em português]

콘솔

자바스크립트로 작업하기 위해 가장 많이 사용되는 함수 중 하나는 console.log() 이지만 그 중 몇 가지가 아래에서 설명되고 자세히 설명됩니다.

콘솔이라는 로컬 객체와 혼동을 피해야 하는 경우 더 긴 명령 형식window.console.[Command]을 사용할 수 있습니다.

주장하다

브라우저에서 명령이 참인지 거짓인지 확인하는 테스트에 사용됩니다.

let x = 2;
console.assert((x == 1), "assert message: x != 1");

분명한

스크립트 오류 메시지를 포함한 콘솔 창 메시지를 지우고 콘솔 창에 표시된 스크립트도 지웁니다. 콘솔 입력 프롬프트에서 입력한 스크립트는 지우지 않습니다.

console.clear();

세다

특정 count() 호출이 호출된 횟수를 표시합니다. 이 함수는 선택적 레이블 인수를 사용합니다. console.count([label]) ;

for (let index = 0; index < 10; index++) {
    console.count('loop');
}

카운트 리셋

console.countReset() 메서드는 console.count() 와 함께 사용된 카운터를 재설정합니다.

console.countReset([label]);

오류

이 '쓰기' 오류 메시지는 웹 콘솔에 표시됩니다.

참고: console.exception()는 console.error()의 별칭입니다. 그들의 기능은 동일합니다.

console.error(msg [, subst1, ..., substN]);
console.exception(obj1 [, obj2, ..., objN]);

그룹

새 온라인 그룹을 만들고 모든 후속 메시지를 더 높은 수준의 들여쓰기로 이동합니다. 한 수준 뒤로 돌아가려면 groupEnd() 를 사용하십시오.console.group([label]) ;

console.group(‘info’);
console.log("Level 3");
console.warn("More of level 3");
console.groupEnd(‘info’);

그룹축소

콘솔 창으로 보낸 메시지 그룹화를 시작하고 선택적 제목을 그룹 레이블로 보냅니다. groupCollapsed를 사용하여 제출된 그룹은 기본적으로 축소된 보기로 표시됩니다. 그룹은 중첩되어 콘솔 창의 트리 보기에 나타날 수 있습니다.console.groupCollapsed([label]) ;

console.log("This is the outer level");
console.groupCollapsed('a');
console.log("Level 2");
console.groupCollapsed('b');
console.log("Level 3");
console.warn("More of level 3");
console.groupEnd('b');
console.log("Back to level 2");
console.groupEnd('a');
console.log("Back to the outer level");

그룹종료

현재 그룹을 닫습니다.

정보

브라우저 콘솔에 보내는 메시지를 표시합니다. Firefox 및 Chrome에서는 콘솔 로그 항목 옆에 작은 "i"아이콘이 표시됩니다.

console.info(obj1 [, obj2, ..., objN]);
console.info(msg [, subst1, ..., substN]);

통나무

일반적으로 등록 정보를 발급하는 데 사용됩니다. 이 방법으로 문자열 대체 및 기타 인수를 사용할 수 있습니다.

console.log(obj1[, obj2, ..., objN]);

테이블

테이블 형식 데이터를 테이블로 표시합니다.
이 함수는 배열 또는 객체여야 하는 필수 데이터 매개변수와 선택적 열 매개변수를 취합니다.

console.table(["apples", "oranges", "bananas"]);

시간과 시간End

작업에 걸리는 시간을 모니터링하는 데 사용할 수 있는 타이머를 시작합니다. 각 타이머에 고유한 이름을 지정하고 페이지에서 최대 10,000개가 실행되어야 합니다. 같은 이름으로 console.timeEnd()를 호출하면 브라우저는 타이머가 시작된 후 경과된 시간을 밀리초 단위로 표시합니다.

console.time("app start");
app.start();
console.timeEnd("app start");

추적하다

스택 추적을 표시합니다.

const first = () => { second(); };
const second = () => { third(); };
const third = () => { fourth(); };
const fourth = () => { console.trace(); };
first();

경고하다

경고 메시지를 보냅니다. 이 방법으로 문자열 대체 및 추가 인수를 사용할 수 있습니다.

console.warn("app start");

문자열 대체 사용

문자열 대체 사용은 콘솔(log, error, warn, info, group)에서 사용할 수 있습니다.


끈
설명


%영형
JavaScript 객체에 대한 링크를 발행합니다.

%d 및 %i
정수를 발행합니다.

%에스
문자열을 내보냅니다.

%에프
부동 소수점 숫자를 발행합니다.

%영형
물체

%비
바이너리

%엑스
16진수

%이자형
멱지수

console.log('%c Red ', 'color:#FFCCCC; background-color:#FF0000;');
console.log('%c Orange ', 'color:#ffe4b3; background-color:#ffa600;');
console.log('%c Yellow ', 'color:#b3b300; background-color:#ffff00;');
console.log('%c Green ', 'color:#33ff33; background-color:#008000;');
console.log('%c Blue ', 'color:#ccccff; background-color:#0000ff;');
console.log('%c Purple ', 'color:#ffb3ff; background-color:#800080;');
console.log('%c Black ', 'color:#cccccc; background-color:#000000;');

읽어 주셔서 감사합니다!

질문, 불만 사항 또는 팁이 있는 경우 여기에 의견을 남길 수 있습니다. 기꺼이 답변해 드리겠습니다!

😊😊 또 만나요! 😊😊