变量提升函数提升
vue-纯前端实现懒加载
·
1、 变量提升
变量 声明 提升
通过var定义(声明)的变量,在定义语句之前就可以访问到
值:undefined
// fn() 输出undefined
var a = 3
function fn (){
console.log(a) // 下方使用var声明了a,出现变量提升,故此时的a是可以找到的,只不过a的值为undefined
var a = 4 // var定义声明的变量会提升,最终相当于下方效果
// var a
// console.log(a)
// a = 4
}
fn() // undefined
// 为什么不是3,在fn执行的时候会优先从自己的作用域中寻找是否有a,发现下面定义声明了var a = 4,故不会跳出该作用域寻找var a = 3,且由于是var定义出现变量提升,如上方所示
2、 函数提升
函数 声明 提升
通过function定义(声明)的函数,在之前就可以调用
值:函数定义(对象)
// fn2() 可以调用执行,下方已声明,会出现函数提升
fn2()
function fn2 (){
console.log("fn2()")
}
3、 表达式定义的不遵循函数提升
通过function定义(声明)的函数,在之前就可以调用,不是函数声明的方式定义的函数不遵循函数提升
值:函数定义(对象)
// fn3() 不可以调用执行,下方是通过var声明变量的方式定义变量,不关心值是多少,遵循的的是变量提示
// 此时fn3还是undefined 并不是可以执行的函数
fn3()
var fn3 = function(){
console.log("fn3")
}
注:
function add(){}这种写法叫做函数声明
var add=function(){}这种写法叫做函数表达式
function(){}这种是匿名函数
f1();//输出结果:123
f2();//Uncaught TypeError: f2 is not a function
function f1(){
console.log("123");
}
var f2 = function(){
console.log("f2");
}
实际上执行过程
function f1(){
console.log("123");
}// 函数提升,整个代码块提升到函数作用域的最顶端
f1();
f2();
var f2 = function(){
console.log("f2");
}
更多推荐
已为社区贡献7条内容
所有评论(0)