web開(kāi)發(fā)js字符串拼接占位符及conlose對(duì)象Api詳解
占位符替換
控制臺(tái)打印(conlose.log())或者拼接字符換, 可以借助占位符解決
%s 字符串
%d / %i 整數(shù)
%f 小數(shù)(整數(shù)、小數(shù)都可以, 推薦)
%o 對(duì)象
%c 后面字符串的樣式
示例代碼:
// %s示例
let s1 = '愛(ài)'
let s2 = '祖國(guó)'
console.log('001--我%s我的%s', s1, s2) // -> 我愛(ài)我的祖國(guó)
// %f 和 %i、%d示例
/*
推薦用 %f, 整數(shù)小數(shù)都沒(méi)問(wèn)題
%d只能輸出整數(shù),如果有小數(shù)會(huì)直接忽略
*/
let n1 = 100
let n2 = 5.8
console.log('002--我離考%d分還差%d分', n1, n2) // -> 我離考100分還差5分
console.log('002--我離考%i分還差%i分', n1, n2) // -> 我離考100分還差5分
console.log('003--我離考%f分還差%f分', n1, n2) // -> 我離考100分還差5.8分
// %o示例
let o = { name: '卡卡西', age: 25 }
console.log('004--執(zhí)行任務(wù)忍者的資料是%o', o) // -> 執(zhí)行任務(wù)忍者的資料是{name: "卡卡西", age: 25}
// %c示例
var str = '005--我是一個(gè)%c示例'
let st = 'color: #000; background-color: orange; padding: 5px;);'
console.log(str, st)
console.log(
'006--%c---------------我是分隔符-----------------',
'color:red;font-size:10px'
)
ript>
![[外鏈圖片轉(zhuǎn)存失敗,源站可能有防盜鏈機(jī)制,建議將圖片保存下來(lái)直接上傳(img-fHD9IthG-1627465023483)(conlose/image-20210728170625837.png)]](http://img.jbzj.com/file_images/article/202109/2021092416401144.png)
控制臺(tái)打印
在瀏覽器打印, 并不只有 conlose.log() 這一種方式;
console對(duì)象是JavaScript的原生對(duì)象, 它提供了多種方法,用來(lái)與控制臺(tái)窗口互動(dòng);
本節(jié)只列舉我認(rèn)為的常用方法.
table()
復(fù)合類型的數(shù)據(jù),console.table方法可以將其轉(zhuǎn)為表格顯示。
let o = {
username: "卡卡西",
age: 25,
skill:['千鳥(niǎo)','土流壁','寫輪眼']
}
console.table(o);
![[外鏈圖片轉(zhuǎn)存失敗,源站可能有防盜鏈機(jī)制,建議將圖片保存下來(lái)直接上傳(img-9cbDkCtF-1627465023486)(conlose/image-20210728172629214.png)]](http://img.jbzj.com/file_images/article/202109/2021092416401145.png)
log、info、warn、error
console.log('001--我是一條普通的輸出語(yǔ)句');
console.info('002--我是一條普通信息輸出語(yǔ)句');
console.warn('003--我是一條警告輸出語(yǔ)句');
console.error('004--我是一條錯(cuò)誤輸出語(yǔ)句');
![[外鏈圖片轉(zhuǎn)存失敗,源站可能有防盜鏈機(jī)制,建議將圖片保存下來(lái)直接上傳(img-jluA4C5G-1627465023487)(conlose/image-20210728172305658.png)]](http://img.jbzj.com/file_images/article/202109/2021092416401146.png)
group(),groupCollapsed(),groupend()
console.group() 和 console.groupend() 用于將顯示的信息分組, 適用于大量輸出信息的時(shí)候
console.group() 會(huì)默認(rèn)把本組輸出信息展開(kāi)
console.groupend() 會(huì)默認(rèn)把本組輸出信息收起
console.group('第一輪輸出')
console.log('我是第一輪輸出語(yǔ)句1')
console.log('我是第一輪輸出語(yǔ)句2')
console.log('我是第一輪輸出語(yǔ)句3')
console.log('我是第一輪輸出語(yǔ)句3')
console.groupEnd()
console.groupCollapsed('第一輪輸出')
console.log('又要輸出了1')
console.log('又要輸出了2')
console.log('又要輸出了3')
console.groupEnd()
console.log('最后一次輸出')
![[外鏈圖片轉(zhuǎn)存失敗,源站可能有防盜鏈機(jī)制,建議將圖片保存下來(lái)直接上傳(img-XZN4LuIZ-1627465023489)(conlose/image-20210728173352647.png)]](http://img.jbzj.com/file_images/article/202109/2021092416401147.png)
以上就是web字符串拼接占位符及conlose對(duì)象Api詳解的詳細(xì)內(nèi)容,更多關(guān)于web字符串占位符及conlose對(duì)象Api的資料請(qǐng)關(guān)注腳本之家其它相關(guān)文章!
相關(guān)文章
Openlayers實(shí)現(xiàn)點(diǎn)閃爍擴(kuò)散效果
這篇文章主要為大家詳細(xì)介紹了Openlayers實(shí)現(xiàn)點(diǎn)閃爍擴(kuò)散效果,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2020-09-09
Highcharts 非常實(shí)用的Javascript統(tǒng)計(jì)圖demo示例
官網(wǎng)實(shí)例中給出了各式各樣的demo,可以參照document修改自己需要的即可,本文實(shí)現(xiàn)的是一個(gè)學(xué)生成績(jī)走勢(shì)demo,有需求的朋友可以參考下哈,希望對(duì)大家有所幫助2013-07-07
javascript 關(guān)于# 和 void的區(qū)別分析
href 為#的跳到了自己的頁(yè)面。原來(lái)‘#’代表的是 #top ,2009-10-10
js實(shí)現(xiàn)隨機(jī)數(shù)字字母驗(yàn)證碼
這篇文章主要為大家詳細(xì)介紹了js隨機(jī)驗(yàn)證碼的實(shí)現(xiàn)代碼,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-06-06
Javascript添加監(jiān)聽(tīng)與刪除監(jiān)聽(tīng)用法詳解
這篇文章主要介紹了Javascript添加監(jiān)聽(tīng)與刪除監(jiān)聽(tīng)用法,較為詳細(xì)的分析了javascript原理與用法,并補(bǔ)充說(shuō)明了事件監(jiān)聽(tīng)的兼容性問(wèn)題,非常具有實(shí)用價(jià)值,需要的朋友可以參考下2014-12-12
使用auto.js實(shí)現(xiàn)自動(dòng)化每日打卡功能
這篇文章主要介紹了使用auto.js實(shí)現(xiàn)自動(dòng)化每日打卡,本文通過(guò)示例代碼給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2021-08-08
關(guān)于div自適應(yīng)高度/左右高度自適應(yīng)一致的js代碼
在DIV和CSS進(jìn)行網(wǎng)頁(yè)布局中,DIV的自適應(yīng)高度和自適應(yīng)寬度是一個(gè)很常見(jiàn)的問(wèn)題,本文將介紹左右自適應(yīng)高度一致的Jquery與DIV高度自適應(yīng)屏幕的js2013-03-03
window.location和document.location的區(qū)別分析
用戶不能改變document.location(因?yàn)檫@是當(dāng)前顯示文檔的位置)。但是,可以改變window.location (用其它文檔取代當(dāng)前文檔)window.location本身也是一個(gè)對(duì)象,而document.location不是對(duì)象2008-12-12
JavaScript?顯示一個(gè)倒計(jì)時(shí)廣告牌的實(shí)現(xiàn)示例
本文主要介紹了JavaScript?顯示一個(gè)倒計(jì)時(shí)廣告牌的實(shí)現(xiàn)示例,文中通過(guò)示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2022-04-04

