函数、变量的提升

作者: MISS_3ca2 | 来源:发表于2020-08-05 16:17 被阅读0次

js3-函数变量提升顶层函数数据类型转换 Math对象 js
let const var
关于变量提升
JS中的提升
引用类型
2021-04-02
闭包
JavaScript的变量提升
es6
Javascript 变量执行过程和数组 & 对象的区别

var 声明的变量存在变量提升，而let const 声明的变量不存在变量提升，所以一定要先声明再使用

在js中，函数及变量的声明都将被提升到函数的最顶部，也就说var声明的变量可以先使用再声明

    console.log(q) 
        var q = 1;
        //打印undefined  变量提升
        //JavaScript 中，函数及变量的声明都将被提升到函数的最顶部。
        //JavaScript 中，变量可以在使用后声明，也就是变量可以先使用再声明。
        f();
        fn();//fn is not a function 

        //函数表达式
        var fn = function(){
            console.log(1)
        }

        //函数声明
        function f(){
            console.log(0)
        }
        //函数提升，只会提升函数声明，而不是提升函数表达式
            //let const 声明的变量不存在变量提升，所以一定要先声明再使用
            // es6明确规定，如果区块中存在let命令，这个区块对这些命令声明的变量，从一开始就形成了封闭作用域，凡是在声明之前就使用这些变量，会报错，
            // 所以在代码块内，使用let声明变量之前，该变量都是不可用的。这在语法上称为暂时性死区，在死区中禁止访问该变量
            // let声明的变量存在变量提升，但是由于死区我们无法在声明前访问这个变量
            console.log(b) //Uncaught ReferenceError: Cannot access 'b' before initialization
            let b =2;

let关键字可以将变量绑定到所在的任意作用域中，通常是{...}内部

let是块级作用域，即在整个{}内可见

<body>
    <div>1</div>
    <div>2</div>
    <div>3</div>
    <div>4</div>
    <div>5</div>
    <div>6</div>
</body>
//for循环有一个特别之处，就是循环语句部分是一个父作用域，而循环体内部是一个单独的子作用域
var div = document.querySelectorAll('div');
for(let i=0;i<div .length;i++ ){
    div[i].onclick = function(){
        console.log(i) //输出对应下标
    }
}

for(var i =0; i<div.length;i++){
    div[i].onclick = function(){
        console.log(i) //每次都输出5
    }
}
//在没有let之前想要输出对应下标，用闭包解决
for(var i=0;i<div.length;i++){
    (function(i){
        div[i].onclick = function(){
            console.log(i)
        }
    })(i)
}