位置: IT常识 - 正文

前端小知识:控制台打印(console)- 模拟Java日志打印、表格形式打印美化输出对象、代码运行时间统计(前端控制台)

编辑:rootadmin
前端小知识:控制台打印(console)- 模拟Java日志打印、表格形式打印美化输出对象、代码运行时间统计 文章目录6. 控制台打印(Console)模拟Java日志打印格式美化对象打印(表格形式打印输出)日志等级输出(让其在控制台显示时有颜色提示)代码运行时间统计打印输出

推荐整理分享前端小知识:控制台打印(console)- 模拟Java日志打印、表格形式打印美化输出对象、代码运行时间统计(前端控制台),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:前端控制台怎么调试,控制力强的前端,前端控制,前端控制台,前端控制原则是指,前端控制原则是指,前端控制理论,前端控制,内容如对您有帮助,希望把文章链接给更多的朋友!

6. 控制台打印(Console)前端小知识:控制台打印(console)- 模拟Java日志打印、表格形式打印美化输出对象、代码运行时间统计(前端控制台)

官方文档: https://developer.mozilla.org/zh-CN/docs/Web/API/Console#用法

模拟Java日志打印格式替换字符作用%o对象(可看到内部结构)%s字符串<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body></body><script> let people = { name: "lrc", year: 18 } let article = { id: "423432431sfsdf", content: "测试控制台接口" } //不建议:这样打印不出对象内部结构 console.log("people:" + people + " article: " + article) console.log("people:%s article: %s", people, article) //建议 == 下面两种是一样的 console.log("people:", people, "article: ", article) console.log("people:%o article:%o", people, article)</script></html>

美化对象打印(表格形式打印输出)<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body></body><script> let people = { name: "lrc", year: 18 } let article = { id: "423432431sfsdf", content: "测试控制台接口" } console.table(people) console.table(article) let arrays = [people,article] console.table(arrays)</script></html>

日志等级输出(让其在控制台显示时有颜色提示)<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body></body><script> console.error("错误日志哦!!!") console.warn("警告日志哦!!!") console.log("普通日志哦!!!")</script></html>

代码运行时间统计打印输出<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><body></body><script> console.time("代码时间统计"); let people = { name: "lrc", year: 18 } let article = { id: "423432431sfsdf", content: "测试控制台接口" } console.timeLog("代码时间统计"); //不建议:这样打印不出对象内部结构 console.log("people:" + people + " article: " + article) console.log("people:%s article: %s", people, article) //建议 == 下面两种是一样的 console.log("people:", people, "article: ", article) console.log("people:%o article:%o", people, article) console.timeLog("代码时间统计"); console.table(people) console.table(article) let arrays = [people,article] console.table(arrays) console.timeLog("代码时间统计"); console.error("错误日志哦!!!") console.warn("警告日志哦!!!") console.log("普通日志哦!!!") console.timeEnd("代码时间统计");</script></html>

本文链接地址:https://www.jiuchutong.com/zhishi/292412.html 转载请保留说明!

上一篇:【CSS扩展】VUE如何使用或修改element plus中自带的CSS全局变量来定义样式(vue添加css)

下一篇:新闻发布及管理系统的设计与实现(论文+PPT+源码)(新闻发布管理系统)

  • 公司利润税怎么交
  • 印花税会计分录怎么做
  • 安家费需要缴纳个税吗
  • 个体户4年不注销的后果消
  • 财务报表中负债率怎么算
  • 会计凭证可分为哪三类
  • 已认证的红字发票怎么退
  • 收发差错率
  • 预售房提前还款需要去解押吗
  • 免税的投资收益需要调整利润表吗
  • 企业所得税减免税额包括哪些
  • 小规模纳税人餐饮业税率是多少
  • 金税控系统发票打印设置
  • 增值税在免税范围内,附加税怎么做
  • 费用类有什么科目
  • 股份有限公司发行的股票溢价
  • 统一社会信用代码证
  • 应交增值税是总额吗
  • 工资上浮20%怎么算
  • 发票冲红可以冲红数量不变金额减少
  • 收到电子银行承兑汇票怎么做账务处理
  • 华为p60pro上市时间是几月
  • 房地产企业人防工程计入什么科目
  • 主板外部接口是用来连接
  • macos monterey值得安装吗
  • 合同印花税会计分录
  • 分期购车的会计分录
  • 入账价值是啥
  • 财务费用冲销怎样做分录
  • php登录注册
  • 使用mac什么意思
  • 圣伊利亚斯山
  • PHP:mb_convert_case()的用法_mbstring函数
  • php array数组
  • 最小的摄像头是多大
  • 一只正在树上吃的苹果
  • 个体工商户减免个人所得税政策
  • php正则函数内容匹配
  • 出口退税需要提供什么
  • 账本过次页的视频
  • java幂等性是什么
  • 二手车价格网站
  • 融资租赁固定资产不属于筹资活动
  • python生成器定义
  • 免费学电脑的网站
  • 固定资产折旧如何进行会计处理
  • mysql5.7.23安装配置教程
  • 自定义函数是啥
  • 企业工会经费计提标准
  • 存货和固定资产一经计提减值以后期间不得转回
  • mysql中游标的作用
  • 增值税留抵税额是什么意思
  • 确认委托代销手续费的会计分录
  • 预收账款和应收账款的转换
  • 年底存货反映了什么
  • 个人咨询费发票怎么开
  • 货物抵货款的账务处理
  • 库存现金管理是财务分析的吗
  • “财务报表分析”
  • 招待费住宿费专票可以抵扣吗
  • 财务费用利息收入怎么记账
  • 公司收到劳务发票交个税吗
  • 有奖销售增值税处理
  • MySQL数据库索引设计
  • sqlserver数据库和mysql区别
  • sqlserver日志恢复数据
  • 安装Win8 64位旗舰版系统提示“windows无法安装到这个磁盘”的故障分析及解决方法
  • cf游戏截图在哪个文件夹
  • ubuntu 命令行修改用户密码
  • centos安装软件教程
  • linux的安装教程
  • qt pro load
  • linux中mysql备份shell脚本代码
  • 手机关卡类游戏
  • 12366纳税服务热线
  • 地域税收收入增长原因
  • 大同地税局地址
  • 进项税额包括哪些项目
  • 烟叶进口关税
  • 税务系统全面从严
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设