新聞中心
上班寫bug,下班修bug。調(diào)試在日常開發(fā)中占大半,相信小伙伴們和我一樣,調(diào)試只會(huì)用console.log。今天我們一起學(xué)習(xí)其他js調(diào)試工具,幫忙我們提高效率。

成都創(chuàng)新互聯(lián)公司-專業(yè)網(wǎng)站定制、快速模板網(wǎng)站建設(shè)、高性價(jià)比東光網(wǎng)站開發(fā)、企業(yè)建站全套包干低至880元,成熟完善的模板庫,直接使用。一站式東光網(wǎng)站制作公司更省心,省錢,快速模板網(wǎng)站建設(shè)找我們,業(yè)務(wù)覆蓋東光地區(qū)。費(fèi)用合理售后完善,10余年實(shí)體公司更值得信賴。
首先看下console對(duì)象中有什么我們不知道的方法
哎呀,不看不知道,一看嚇一跳。簡(jiǎn)單的console居然有這么多方法!
console.log()
相信小伙伴們會(huì)拍著胸口說:不就是簡(jiǎn)單的輸出嗎?console.log("Hello World")js入門級(jí)別的代碼。
但console.log()還有其他好玩小竅門
占位符:
%s對(duì)字符串進(jìn)行占位
%o 對(duì)對(duì)象進(jìn)行占位
%d 對(duì)數(shù)字類型進(jìn)行占位,這個(gè)就不演示了
%c css占位符,利用console.log輸出內(nèi)容可以攜帶css樣式
console.dir()
console.dir與log類似,不同之處在于dir打印對(duì)象的json表示形式
console.warn()
給生活添加色,console.warn()給控制臺(tái)添一祙小黃色
console.table()
這個(gè)方法爽爽的不要不要的了,小伙伴們是否console.log輸出過json數(shù)據(jù),一長(zhǎng)串,看得是眼花瞭亂。
當(dāng)然這還沒到眼花的地步,數(shù)據(jù)多了,對(duì)象屬性多了,反正看著不爽
這點(diǎn)數(shù)據(jù)對(duì)比兩種方法誰好,還不明顯。
在看一種情況:我們只需要查看某個(gè)對(duì)象屬性,不需要對(duì)象所有的屬性都展示給我們看
console.tabel完美解決
不足之處在于:處理最多 1000 行的數(shù)據(jù)的能力,所以它可能并不適用于所有的數(shù)據(jù)集合。
console.assert()
console.assert當(dāng)做log用只輸出undefined,
assert第一個(gè)參數(shù)是一個(gè)boolean值。否則直接輸出undefined
若為true,輸出undefinend,其他參數(shù)并不鳥
若為false,輸出Assertion failed:+其他參數(shù)
console.clear()
清空控制臺(tái)
好像有點(diǎn)雞肋,目前我找不到實(shí)際的用處
console.count()
寫入count()在同一行與同一標(biāo)簽被調(diào)用的次數(shù)。
與它配套的console.countReset()重置計(jì)數(shù)
該方法可用于統(tǒng)計(jì)循環(huán)次數(shù):
- var arr = [1,2,3,2,...];
- arr.forEach(()=>{
- console.count();//不傳則默認(rèn)用default
- })
console.time()
啟動(dòng)一個(gè)新的計(jì)時(shí)器。調(diào)用console.timeEnd()停止計(jì)時(shí)器并將運(yùn)行時(shí)間在控制臺(tái)
- console.time();
- for(let i=0;i<1000;i++){}
- console.timeEnd();
console.debug()
console.debug與log一樣,但在不同瀏覽器中表現(xiàn)不同,下面是firefox與chrome中的展現(xiàn)
console.error()
將對(duì)象打印到控制臺(tái),將其格式化為錯(cuò)誤,并包括堆棧跟蹤
console.info()
與 console.log ()相同。
console.group(label)
可視化地將消息分組在一起,直到調(diào)用 console.groupEnd (label)。 當(dāng)組最初登錄到控制臺(tái)時(shí),使用 console.groupcollapped (label)將其折疊。
本文標(biāo)題:前端奇技淫巧之js調(diào)試
URL分享:http://www.dlmjj.cn/article/dhhjsid.html


咨詢
建站咨詢
