返回顶部
首页 > 资讯 > 前端开发 > VUE >怎么使用JS console.log函数
  • 270
分享到

怎么使用JS console.log函数

2024-04-02 19:04:59 270人浏览 安东尼
摘要

这篇文章主要讲解了“怎么使用js console.log函数”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“怎么使用JS console.log函数”吧!1.

这篇文章主要讲解了“怎么使用js console.log函数”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“怎么使用JS console.log函数”吧!

1. console.assert()

只想输出选定日志时这一指令非常实用,它将只输出错误参数,如果第一个参数正确,它就不起作用。

怎么使用JS console.log函数

断言(assertion)

2. console.group() & console.groupEnd( )

可以使用控制台将消息分组。

怎么使用JS console.log函数

将消息分组

3. console.trace()

该方法会追踪并显示代码在何时终止运行。

怎么使用JS console.log函数

追踪

4. console.count()

该函数记录count()函数的调用次数,有一个可选的参数label。

如果调用时提供了label,该函数将记录使用该特定label调用count()的次数。

如果调用时省略label,函数将记录在这一行调用count()的次数。

怎么使用JS console.log函数

计数

5. console.table ()

希望看到合适易读的JSON文本吗?

怎么使用JS console.log函数

数组进行更好的可视化处理!

6. 在控制台消息中添加样式

所有控制台消息看起来都一样吗?现在就不一样了,让调试日志中重要的部分看起来更加醒目。

怎么使用JS console.log函数

带颜色的消息

可以通过以下方式改变日志中特定单词的颜色:

怎么使用JS console.log函数

高亮显示特定单词

7. console.time()

console.time()用于跟踪操作耗时,它是跟踪javascript执行所耗费的短暂时间的好方法。

怎么使用JS console.log函数

8. 控制台中的HTML

从控制台中获取html元素,跟检查元素的方式相同。

怎么使用JS console.log函数

HTNL元素展示

9. console.dir()

输出指定对象的JSON形式。

怎么使用JS console.log函数

10. console.memory( )

想知道Javascript应用占用了多少浏览器内存?

怎么使用JS console.log函数

内存

11. 使用占位符

各种不同的占位符如下所示:

  • %o :接受一个对象,

  • %s :接受一个字符串

  • %d :接受一个小数或整数

怎么使用JS console.log函数

占位符介绍

12. console.log() | info( ) | debug( ) | warn( ) | error( )

这些语句将根据事件的类型用不同颜色标识原始字符串。

怎么使用JS console.log函数

13. console.clear( )

最后但也很重要的一点是,使用clear()命令清除所有控制台消息。

以下是要点补充。

// time and time end console.time("This"); let total =0; for (let j =0; j <10000; j++) { total += j } console.log("Result", total); console.timeEnd("This"); // Memory console.memory() // Assertion consterrORMsg='Hey! The number is not even'; for (let number =2; number <=5; number +=1) { console.assert(number %2===0, {number: number, errorMsg: errorMsg}); } // Count for (let i =0; i <11; i++) { console.count(); } // group & groupEnd console.group(); console.log('Test message'); console.group(); console.log('Another message'); console.log('Something else'); console.groupEnd(); console.groupEnd(); // Table constitems= [ { name:"chair", inventory:5, unitPrice:45.99 }, { name:"table", inventory:10, unitPrice:123.75 }, { name:"sofa", inventory:2, unitPrice:399.50 } ]; console.table(items) // Clear console.clear() // HTML Element let element =document.getElementsByTagName("BODY")[0]; console.log(element) // Dir constuserInfo= {"name":"John Miller", "id":2522, "theme":"dark"} console.dir(userInfo); // Color console.log('%cColor of the text is green plus small font size', 'color: green; font-size: x-small'); // pass object, variable constuserDetails= {"name":"John Miller", "id":2522, "theme":"dark"} console.log("Hey %s, here is your details %o in form of object", "John", userDetails); // Default console.log('console.log'); console.info('console.info'); console.debug('console.debug'); console.warn('console.warn'); console.error('console.error');

感谢各位的阅读,以上就是“怎么使用JS console.log函数”的内容了,经过本文的学习后,相信大家对怎么使用JS console.log函数这一问题有了更深刻的体会,具体使用情况还需要大家实践验证。这里是编程网,小编将为大家推送更多相关知识点的文章,欢迎关注!

--结束END--

本文标题: 怎么使用JS console.log函数

本文链接: https://lsjlt.com/news/85242.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

猜你喜欢
  • 怎么使用JS console.log函数
    这篇文章主要讲解了“怎么使用JS console.log函数”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“怎么使用JS console.log函数”吧!1....
    99+
    2024-04-02
  • js如何使用console.log()
    这篇文章主要为大家展示了“js如何使用console.log()”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“js如何使用console.log()”这篇文章吧...
    99+
    2024-04-02
  • console.log()怎么使用
    今天小编给大家分享一下console.log()怎么使用的相关知识点,内容详细,逻辑清晰,相信大部分人都还太了解这方面的知识,所以分享这篇文章给大家参考一下,希望大家阅读完这篇文章后有所收获,下面我们一起来了解一下吧。console.log...
    99+
    2023-07-04
  • JS中只会使用console.log()?你out了
    ...
    99+
    2023-06-03
  • JS中console.log的用法是什么
    console.log()是JavaScript中用于在控制台输出信息的方法。它接受一个或多个参数,并将它们打印到浏览器的控制台中。...
    99+
    2023-09-12
    JS
  • 怎么使用js中hasOwnProperty函数
    这篇文章主要介绍“怎么使用js中hasOwnProperty函数”,在日常操作中,相信很多人在怎么使用js中hasOwnProperty函数问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”怎么使用js中hasO...
    99+
    2023-06-25
  • js的Map函数怎么使用
    本文小编为大家详细介绍“js的Map函数怎么使用”,内容详细,步骤清晰,细节处理妥当,希望这篇“js的Map函数怎么使用”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习新知识吧。Map是ES2015引入的Global Obj...
    99+
    2023-06-29
  •  js中toString()函数与valueOf()函数怎么使用
    本篇内容介绍了“ js中toString()函数与valueOf()函数怎么使用”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!&n...
    99+
    2023-06-30
  • JS的递归函数怎么使用
    这篇文章主要介绍了JS的递归函数怎么使用的相关知识,内容详细易懂,操作简单快捷,具有一定借鉴价值,相信大家阅读完这篇JS的递归函数怎么使用文章都会有所收获,下面我们一起来看看吧。编程语言中,函数Func(T...
    99+
    2024-04-02
  • JS周期函数setInterval怎么使用
    setInterval函数用于按照指定的时间间隔重复执行指定的代码块或函数。它接受两个参数,第一个参数是要执行的代码块或函数,第二个...
    99+
    2023-09-28
    JS
  • vue中怎么使用console.log打印
    本篇内容主要讲解“vue中怎么使用console.log打印”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“vue中怎么使用console.log打印”吧!vue使用console.log打印使用...
    99+
    2023-06-30
  • js trim函数怎么用
    Javascript中的trim()函数用于去除字符串两端的空格或指定的字符。使用语法:string.trim(...
    99+
    2023-09-12
    js
  • js异步函数async/awit怎么使用
    异步函数(async/await) 是一种用于处理 JavaScript 异步操作的语法糖,它建立在 Promise 基础之上,使得...
    99+
    2023-09-29
    js
  • JS的Function与构造函数怎么使用
    这篇文章主要讲解了“JS的Function与构造函数怎么使用”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“JS的Function与构造函数怎么使用”吧! 1.概述Function是...
    99+
    2023-06-21
  • JS的异步函数async/await怎么使用
    这篇“JS的异步函数async/await怎么使用”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来看看这篇“JS的异步函数async/a...
    99+
    2023-07-05
  • JS中call()、apply()和bind()函数怎么使用
    今天小编给大家分享一下JS中call()、apply()和bind()函数怎么使用的相关知识点,内容详细,逻辑清晰,相信大部分人都还太了解这方面的知识,所以分享这篇文章给大家参考一下,希望大家阅读完这篇文章后有所收获,下面我们一起来了解一下...
    99+
    2023-07-04
  • 怎么用JS: 函数式array.forEach
    本篇文章给大家分享的是有关怎么用JS: 函数式array.forEach,小编觉得挺实用的,因此分享给大家学习,希望大家阅读完这篇文章后可以有所收获,话不多说,跟着小编一起来看看吧。array.forEac...
    99+
    2024-04-02
  • js构造函数怎么用
    这篇文章将为大家详细讲解有关js构造函数怎么用,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。说明构造函数名的首字母必须大写。构造函数无需return即可返回结果。调用结构函数必须使用new关键词,只需ne...
    99+
    2023-06-20
  • html怎么调用js函数
    这篇文章给大家分享的是有关html怎么调用js函数的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。html调用js函数的方法:1、用控件本身进行调用;2、通过javascript中的时间控件定时执行;3、通过get...
    99+
    2023-06-15
  • 怎么使用JS函数式编程实现XDM
    这篇文章主要讲解了“怎么使用JS函数式编程实现XDM”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“怎么使用JS函数式编程实现XDM”吧!FP 概览重要性函数式编程(FP),不是一个新的概念,...
    99+
    2023-07-02
软考高级职称资格查询
推荐阅读
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作