版权声明:本文版权归作者所有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出 原文链接 如有问题, 可发送邮件咨询. https://blog.csdn.net/weixin_37865166/article/details/89303378
➢
网易云课堂
视频链接: console基本操作和使用技巧
➢
基本输出
开发人员使用最多的就是console.log()
但是最基本的console.log
配合chrome
控制台也有很多需要注意的地方和值得学习的小技巧.
可以让我们在调试中更加快速准确的定位错误,达到同时提升效率和质量的效果.
➢ 数据类型
js
中有六种数据类型.
五种基本数据类型:
-
Number
-
String
-
Boolean
-
Undefined
-
Null
一种复杂数据类型:
-
Object
JS
函数:
-
Function
其他类型:
在前端除了js
数据类型,还存在存储数据的格式类型:
-
XML
-
JSON
tips:
JSON
是一种轻量级的数据交换格式,全称——JavaScript
对象表示法(JavaScript Object Notation
)。
类比XML,你可以把JSON
看作是一种存储数据的格式类型,一种数据规范.
DOM
结构:
DOM
是javascript
操作网页的接口,全称为文档对象模型(Document Object Model
)
ES6
新增:
-
Symbol
(原始数据类型) -
Set
(数据结构) -
Map
(数据结构)
➢ 默认输出
定义以上所有基本数据的内容,依次打印默认效果
在chrome
控制台调制默认输入的效果.
-
未定义变量但是直接
console
-
let/var
定义变量但是未定义值,然后console
-
// 常见类型和字符串序列化后的对比 console.log({},{},0,0,false,false,undefined,undefined,null,null,NaN,NaN,``,)
-
// 同一个类型不同写法的不同输出形式(注意颜色和字符串符号) console.log(false) console.log(`false`) console.log(false,`false`)
-
// 控制台Ctrl+F检索关键字 大师兄 (可以检索) let names={name1: `大师兄`,name2: `二师兄`,name3: `三师兄`,} console.log(names) console.log(JSON.stringify(names)) // 控制台Ctrl+F检索关键字 大师兄 (只能检索字符串中的文字,object中不行,因为内容过多被折叠) let nameMore={ name1: `大师兄`, name2: `二师兄`, name3: `三师兄`, name4: `四师兄`, name5: `小师弟`, name6: `小师妹`, name7: `师姐`, name8: `掌门师兄`, name9: `师叔`, name10: `长老` } console.log(nameMore) console.log(JSON.stringify(nameMore))
-
DOM
和XML
和JSON
的打印<div id="dom">console</div> let dom = document.getElementById(`dom`); console.log(dom);
XML
和JSON
使用node
和express
本地项目返回文件http
接收然后打印