1. 代码规范
// 1.foo和()之间不需要有空格
// 2.多参数,后面加上一个空格
// 3.()和{之间有一个空格
// 4.{和其他函数定义在同一行中
function foo(m, n) {
}
foo(20, 30)
if (true) {
} else {
}
for (var i = 0; i < 10; i++) {
}
// 模板字符串(可以换行)
var message = `
哈哈哈哈哈${100}
`
function sum(num1, num2) {
return num1 + num2
}
2. Chrome中debug调试技巧
-
Chrome开发者工具Console区域: 可以查看代码中使用console.log() 输出的信息
-
给代码添加断点(breakpoint): 代码运行时遇到断点便会停止执行
- VSCode中,点击对应的代码行号左侧的红点即可添加断点,或者在代码上方加上 debugger
- Chrome中Source区域:找到要调试的文件,在代码左侧的行号处点击即可添加断点
-
Watch区域:输入对应的变量,可以观察代码运行过程中变量的值的变化情况
-
Breakpoints区域:可以查看js代码中所有添加的断点
-
Scope区域:查看代码生成的作用域
-
上方工具栏按钮作用(从左到由):
- 控制调试程序的暂停和恢复
- 跳过下一个函数调用,执行下一行代码
- 进入下一个函数调用,可查看函数内部执行顺序
- 跳出当前函数
- 进入下一个函数调用,不会进入setTimeout内部的函数