理解 堆栈中 JS 执行过程
通过上图可以很明确的知道,在执行左侧代码时:
- 在存储空间内开辟一个执行栈
- 其中对应的顺序为 EC(全局)执行上下文储存 基本类型值 a ,由于函数为引用类型,所以在堆上开辟地址为:AB1的储存空间,存放foo函数
- 遇到fn的执行,于是开辟一个新的EC(foo)上下文 其中会存储对应的参数和变量,有涉及 baz函数的定义,于是开启新的地址为: AB2的存储空间,并返回BAZ
- 在fn(3)调用时,开启新的执行上下文 EC(baz) 并得出相应的 结果为 7
- 在代码执行完成,EC(baz)由于没有对应的调用,于是会被回收(出栈)
减少判断层级
// 代码模块 1
function doSomething (part, chapter) {
const parts = ['ES2016', '工程化', 'Vue', 'React', 'Node']
if (part) {
if (parts.includes(part)) {
console.log('属于当前课程')
if (chapter > 5) {
console.log('您需要提供 VIP 身份')
}
}
} else {
console.log('请确认模块信息')
}
}
doSomething('ES2016', 6)
// 代码模块 2
function doSomething (part, chapter) {
const parts = ['ES2016', '工程化', 'Vue', 'React', 'Node']
if (!part) return console.log('请确认模块信息')
if (!parts.includes(part)) return console.log('属于当前课程')
if (chapter > 5) console.log('您需要提供 VIP 身份')
}
doSomething('ES2016', 6)
- 比较代码模块1,代码模块2。很容易发现代码2的,逻辑思路更加清晰,语句更简洁。在JSBench中比较,模块2的性能也是更高,因为不用多层嵌套的判断。
- 在书写判断条件时,可以采用反向判断的方式