console在开发中用的是比较多的,用的最多的应该就是log方法,打印一些信息。还有一些别的方法,也挺好用。
-
log、warn、error这是最常用的3个方法
console.info('info')
console.warn("warn message");
console.error("Error message");
-
table方法
const dogs = [ { name: "Yoshi", color: "Black", personality: "Calm" }, { name: "Melanie", color: "Brown", personality: "Hyperactive" }, { name: "Peppers", color: "white", personality: "Unpredictable" }, ]; console.table(dogs);
该方法会把返回的数据按照表格的方式来展示。结果如下:
-
count方法
const cpm = () => { console.count("count") } cpm() cpm() cpm() // setInterval(()=>{ // cpm() // },1000)
该方法会进行计数,每执行一次,就会自动+1。count方法中填写的名称就是打印台显示的用于计数的名称。结果如下:
-
time和timeEnd方法
const start = () => { console.log('开始'); console.time("timer") console.timeLog("timer") } const end = () => { console.log('结束'); console.log(startTime, endTime); console.timeEnd("timer") } start() setTimeout(() => { end() }, 3000)
如果需要打印当前time的值,需要用timeLog方法来实现。但这3个方法中的名称必须是一致的
注意:开始下面的timer是timeLog打印的,而不是time打印的,time只是标志的开始。
此方法只能用来测试某一个方法从开始到结束执行了多长时间,而且返回结果是无法编辑和操作的。比如说有的需求需要用到返回来的结果来进行下一步操作(比如计算差值来进行下一步操作),可以用 performance.now() 方法来实现。
let startTime = ""
let endTime = ""
const start = () => {
startTime = performance.now()
}
const end = () => {
endTime = performance.now()
console.log(startTime, endTime);
}
start()
setTimeout(() => {
end()
}, 3000)
结果如下:performance.now() 获取的值是以毫秒为单位,取值基于浏览器的内部时钟,所以每次获取的值会有差异,但是精度是对的。
-
group和groupCollapsed方法
console.group("Grouped Logs"); console.log("Log 1"); console.log("Log 2"); console.groupEnd(); console.groupCollapsed("Collapsed Group"); console.log("Log 3"); console.log("Log 4"); console.groupEnd();
两个方法都是创建可以折叠的日志组,区别是:group创建的日志组默认是展开的;groupCollapsed默认是折叠的。结果如下:
-
trace方法
const currentSeconds = new Date().getSeconds(); const condition = currentSeconds % 2 === 0; function one() { example(); } function two() { example(); } function randomChoice() { if (!condition) { one(); } else { two(); } } function example() { console.trace("Trace from example() function"); } randomChoice();
该方法会追踪到某一个具体的方法。结果如下:
-
clear方法
setTimeout(() => { console.clear() }, 5000)
会清除控制台所有打印,结果如下: