js语句console.log(js语句和表达式的区别)
更新: <time datetime="2022-11-08 17:09">2022-11-08 17:09</time>
本文目录一览:
- console.log()是什么意思?
- console.log()的作用
- javascript 中的console.log有什么作用啊?是做什么的呢?谢谢大家
- JavaScript:如何使用Console.log()输出对象信息
- javascript的console.log怎么用
console.log()是什么意思?
除了一些很老版本的浏览器,现今大多数浏览器都自带调试功能;即使没有调试功能,也可以通过安装插件来进行补充。
比如,老版本的Firefox没有自带调试工具,在这种情况下可以通过安装Firebug插件来添加调试功能。在具备调试功能的浏览器上,window
对象中会注册一个名为console
的成员变量,指代调试工具中的控制台。通过调用该console
对象的log()
函数,可以在控制台中打印信息。
console.log()
可以接受任何字符串、数字和JavaScript对象。与alert()
函数类似,console.log()
也可以接受换行符\n
以及制表符\t
。console.log()
语句所打印的调试信息可以在浏览器的调试控制台中看到。不同的浏览器中console.log()
行为可能会有所不同。
console.log()的作用
主要是方便调试 JavaScript 用的,可以看到在页面中输出的内容。与 alert
相比,它能看到结构化的东西,而 alert
弹出一个对象就是 [object object]
,但 console
能看到对象的内容,console
不会打断页面的操作。
相比 alert
,它的优点是:
- 它能看到结构化的东西,如果是
alert
,弹出一个对象就是object object
,但是console
能看到对象的内容。 console
不会打断你页面的操作,如果用alert
弹出来内容,那么页面就死了,但是console
输出内容后你页面还可以正常操作。console
里面的内容非常丰富,你可以在控制台输入console
,然后就可以看到。 相关内容: 比如,老版本的Firefox没有自带调试工具,在这种情况下可以通过安装Firebug插件来添加调试功能。在具备调试功能的浏览器上,window
对象中会注册一个名为console
的成员变量,指代调试工具中的控制台。通过调用该console
对象的log()
函数,可以在控制台中打印信息。console.log()
可以接受任何字符串、数字和JavaScript对象。与alert()
函数类似,console.log()
也可以接受换行符\n
以及制表符\t
。console.log()
语句所打印的调试信息可以在浏览器的调试控制台中看到。不同的浏览器中console.log()
行为可能会有所不同。
javascript 中的console.log有什么作用啊?是做什么的呢?谢谢大家
大家都有用过各种类型的浏览器,每种浏览器都有自己的特色。本人拙见,在我用过的浏览器当中,我是最喜欢Chrome的,因为它对于调试脚本及前端设计调试都有它比其它浏览器有过之而无不及的地方。
可能大家对console.log
会有一定的了解,心里难免会想调试的时候用alert
不就行了,干嘛还要用console.log
这么一长串的字符串来替代alert
输出信息呢。下面我就介绍一些调试的入门技巧,让你爱上console.log
。
先简单介绍一下 Chrome 的控制台,打开 Chrome 浏览器,按 F12
就可以轻松地打开控制台。
大家可以看到控制台里面有一首诗还有其它信息,如果想清空控制台,可以点击左上角那个来清空,当然也可以通过在控制台输入 console.clear()
来实现清空控制台信息。如下图所示。
现在假设一个场景,如果一个数组里面有成百上千的元素,但是你想知道每个元素具体的值,这时候想想如果你用 alert
那将是多惨的一件事情,因为 alert
阻断线程运行,你不点击 alert
框的确定按钮下一个 alert
就不会出现。
下面我们用 console.log
来替换,感受一下它的魅力。
看了上面这张图,是不是认识到 log
的强大之处了。下面我们来看看 console
里面具体提供了哪些方法可以供我们平时调试时使用。
目前控制台方法和属性有:
["$$", "$x", "dir", "dirxml", "keys", "values", "profile", "profileEnd", "monitorEvents", "unmonitorEvents", "inspect", "copy", "clear", "getEventListeners", "undebug", "monitor", "unmonitor", "table", "$0", "$1", "$2", "$3", "$4", "$_"]
下面我们来一一介绍一下各个方法主要的用途。 一般情况下我们用来输入信息的方法主要是用到如下五个:
console.log
—— 用于输出普通信息console.info
—— 用于输出提示性信息console.error
—— 用于输出错误信息console.warn
—— 用于输出警示信息console.debug
—— 用于输出调试信息 用图来说话。console
对象的上面五种方法,都可以使用printf
风格的占位符。不过,占位符的种类比较少,只支持字符(%s
)、整数(%d
或%i
)、浮点数(%f
)和对象(%o
)四种。
console.log("%d年%d月%d日", 2011, 3, 26);
console.log("圆周率是%f", 3.1415926);
%o
占位符,可以用来查看一个对象内部情况:
var dog = {};
dog.name = "大毛";
dog.color = "黄色";
console.log("%o", dog);
console.dirxml
—— 用来显示网页的某个节点(node)所包含的 HTML/XML 代码
<body>
<table id="mytable">
<tr>
<td>A</td>
<td>A</td>
<td>A</td>
</tr>
<tr>
<td>bbb</td>
<td>aaa</td>
<td>ccc</td>
</tr>
<tr>
<td>111</td>
<td>333</td>
<td>222</td>
</tr>
</table>
</body>
<script type="text/javascript">
window.onload = function () {
var mytable = document.getElementById('mytable');
console.dirxml(mytable);
}
</script>
console.group
—— 输出一组信息的开头console.groupEnd
—— 结束一组输出信息 看你需求选择不同的输出方法来使用,如果上述四个方法再配合group
和groupEnd
方法来一起使用就可以输入各种各样的不同形式的输出信息。
JavaScript:如何使用Console.log()输出对象信息
有两种写法: 第一种:
console.log('my object:', obj);
第二种:
console.log('my object:');
console.log(obj);
如果使用 console.log('my object:' + obj);
就会出现问题中的那种错误,这是因为 +
是用于拼接字符串的,而此时对象的结构语法显示。
javascript的console.log怎么用
console.log(要输出的对象);
结果会在浏览器控制台显示。例如:
console.log("测试");
运行页面时会在页面控制台输出“测试”二字。