声明变量的几种方法

变量的声明：

let是es6中出的标准 let定义的变量是块级作用域，只在let所在行数内有效，函数外无法使用变量。

相当于局部变量，一个函数中不能重复使用let定义相同的变量名，否则会报错

let也不会像var那样发生变量提升

let定义变量需要先声明在使用，否则会出现错误

function fun() {

           console.log // a is not defined

            let a = 1;

        }    

代码演示：

1.  
   // ES6语法用来声明变量
2.  
    
3.  
   // 作用：
4.  
   // 声明一个块级作用域的本地变量
5.  
   // 可以设置初始值
6.  
    
7.  
   // 语法：
8.  
   // 声明变量
9.  
   let x = 1
10.  
    let y = 2
11.  
     
12.  
    console.log(y); // 2
13.  
    // 重新赋值
14.  
    x = "今天学习的内容是声明变量哦~"
15.  
    console.log(x); //今天学习的内容是声明变量哦~
16.  
    // 1、注意点：不允许重复声明
17.  
    // let 不允许在相同作用域内，重复声明同一个变量
18.  
    // function fun() {
19.  
    // let a = 10;
20.  
    // var b = 10;
21.  
    // }
22.  
    // function fun() {
23.  
    // let a = 10;
24.  
    // let a = 1;
25.  
     
26.  
    // }
27.  
    // 2、块级作用域
28.  
    // 它的用法类似于var,但是所声明的变量,只能在let命令所在的代码块内有效。
29.  
    // 在下面代码块之中,分别用let和var声明了两个变量。
30.  
    {
31.  
    let a = 15;
32.  
    var b = 20;
33.  
    console.log(a); // 15
34.  
    console.log(b); // 20
35.  
    }
36.  
    console.log(a);
37.  
    console.log(b);
38.  
     
39.  
     
40.  
    // console.log(a); // undefined
41.  
    // console.log(b); // 1
42.  
    // 结果let声明的变量报错,var声明的变量返回了正确的值
43.  
    // 这表面,let声明的变量只在它所在的代码块有效。
44.  
    // console.log(a); // a is not defined
45.  
    // console.log(b); // 1
46.  
    // 3、变量不会提升
47.  
    // var命令会发生“变量提升”现象,即变量可以在声明之前使用,值为underfined。
48.  
    // 这种现象多多少少是有些奇怪的,按照一般的逻辑,变量应该在声明语句之后才可以使用
49.  
    // 为了纠正这种现象,let命令改变了语法行为,它声明的变量一定要在声明后使用,否则报错
50.  
    // var的情况
51.  
    console.log(foo);
52.  
    var foo =2; //undefined
53.  
    // let的情况
54.  
    console.log(bar); // Cannot access "bar’ before initialization(无法在初始化之前访问变l量)
55.  
    let bar = 2;
56.  
    // 【总结】
57.  
    // 1.不能重复声明
58.  
    // 2.有块级作用域
59.  
    // 3.不会变量提升
60.  
     
61.  
     

 const常量声明：

const定义的js变量是一个常量。不可以修改（相当于只读不可写入），而且必须初始化（给const一个初始值，不能为空）

注意：const的值不能在同一函数内重复声明，否则两个都会报错。

1.  
   <script>
2.  
   // 常量声明const：
3.  
   // const 声明一个只读常量 一旦声明，常量的值就不能改变
4.  
    
5.  
   // 语法：
6.  
   // 声明设置初始值
7.  
   const y = 10;
8.  
    
9.  
   // 1、基本类型数据无法重新赋值
10.  
    const ls = 99;
11.  
    console.log(ls); // 99
12.  
    // ls = 100;
13.  
    // console.log(ls); // Assignment to constant variable(赋值给常量变量)
14.  
     
15.  
    // 2、必须设置初始值
16.  
    // const 声明的变量不得改变值，这意味着const一旦声明变量，就必须立即初始化不能留到以后赋值
17.  
    // const foo;
18.  
    // console.log(foo); // Missing initializer.(缺少初始值)
19.  
    // 只声明不赋值,就会报错
20.  
    // 3、有块级作用域
21.  
    // const的作用域和let命令相同:只在声明的块级作用域内有效
22.  
    if(true) {
23.  
    const MAX = 5 ;
24.  
    console.log(MAX);
25.  
    }
26.  
    // console.log(MAX); // MAX is not defined
27.  
    // 4、不会变量提升
28.  
    // const命令声明的常量也是不能提升,同样存在暂时性死区,只能在声明的位置后面使用
29.  
    if(true) {
30.  
    console.log(MAX); // Cannot access 'MAX' before initialization
31.  
    const MAX =5;
32.  
    }
33.  
    // 5、不能重复声明
34.  
    // let age = 18;
35.  
    // const age = 30;
36.  
     
37.  
     
38.  
    // 总结：
39.  
    // 1、基本数据类型无法重新赋值(引用类型可以更改内容)
40.  
    // 2、必须设置初始值
41.  
    // 3、有块级作业域
42.  
    // 4、不会变量提升
43.  
    // 5、不能重复声明
44.  
    <script/>

var变量声明：

1.  
   <script>
2.  
   // 变量声明var：
3.  
   // var不常用
4.  
    
5.  
   // 作用：
6.  
   // 设置变量，与let非常类似
7.  
   // 语法：
8.  
   // 1、声明变量
9.  
   var food
10.  
    // 2、变量声明 初始值
11.  
    var fruit = 'apple'
12.  
    // 3、重新赋值
13.  
    fruit = 'banana'
14.  
    console.log(fruit); // banana
15.  
     
16.  
     
17.  
     
18.  
    // 注意点1：变量会提升
19.  
    console.log(num);
20.  
    var num = 10;
21.  
    // 注意点2: 没有块级作用域
22.  
    for(var i = 1; i < 5 ; i ){
23.  
    console.log('循环内' i);
24.  
    }
25.  
    console.log('循环外' i);
26.  
    </script>

 笔记：

1.  
   <script>
2.  
   // 变量提升
3.  
   // 变量提升即将变量声明提升到它所在的作用域
4.  
    
5.  
   // 通过var定义(声明)的变量，在定义语句之前就可以访问到
6.  
   console.log(a); //underfined
7.  
   var a = 1;
8.  
    
9.  
   // 因为有变量提升的缘故，上面代码实际的执行顺序为:
10.  
    var a;
11.  
    console.log(a); //1
12.  
    a = 1;
13.  
    </script>

 面试题：

<script>

        var a = 4

        function fn () {

            // var a = 8

            console.log(a); // underfined

            var a = 5

        }

        fn()

    </script>

这篇好文章是转载于：学新通技术网