zoukankan      html  css  js  c++  java
  • var、let、const的区别,以及作用范围。

    在es5中一般经常使用的变量有两个级别,一个是用var声明的全局级别的变量,另外一个是函数级别是用var生命在函数内的。本文中将详细讲解我对es6中的const和let的区别。

    let的使用以及作用范围

    let是块级变量,只有在自己声明的内部才会有作用。

    'use strict';
    {
        var a = 12;
        let b = 15;
        {
            console.log(a, b)//12 15没有问题的。
        }
    }
    console.log(a,b)  //12  defined     a是全局变量在哪里输出都没有问题,然而b是块级变量所以只有在声明b的内部才会有效。

     let的提升。下列代码中证明了let没有被提升 var 被提升了。

    'use strict';
    function fun() {
        // var a   相当于a提升到了这里定义了,但是未赋值。
        console.log(a, b); //undefined defined  注意a是没有被赋值,而b是未定义,这说明a是向上提升了而b却没有提升。
        // a = 12; a相当于在这里赋值了、
        var a =  12;
        let b = 'b';
    }
    fun();

    let的提升以及作用范围。

    'use strict';
    var a = 12;
    function f() {
        console.log(a); //defined  因为在函数外部声明了a,然后在函数内部又声明了a,此时函数外部的a就会失效,但是函数内部的a又没有提升的功能所以会输出未定义;
        let a = 100; 
    }
    f();

    使用let代替匿名函数立即执行

    'use strict';
    (function () {
        var config = [];
        config.push(1);
        config.push(2);
        config.push(3);
        console.log(config) //1, 2, 3
    })();
    let configs;
    {
        configs = [];
        configs.push(4);
        configs.push(5);
        configs.push(6);
        console.log(configs) //4, 5, 6
    }

    const的使用

    const是常数顾名思义,就是声明后无法修改的。请看下面的例子。

    const的提升和作用范围和let几乎一样,在这里就不做过多的例了。

    'use strict';
    const a = {
        name: '铅笔'
    };
    a = 100; //此时会报错

    常量不代表所以得东西不能修改,除了a = 这个指向不能修改 a对象内部的属性和值都是可以修改的。

    'use strict';
    const a = {
        name: '铅笔'
    };
    a.name = '黑白';
    a.email = '48988840@qq.com';
    console.log(a); // {name : '黑白, email : '48988840@qq.com'}

    怎么让a和内部的东西不能修改呢?

    'use strict';
    const a = {
        name: '铅笔'
    };
    Object.freeze(a);  //a内部的所有属性和值都不能修改了。
    a.name = '黑白';   // 报错
    a.email = '48988840@qq.com'; // 报错
    console.log(a); // {name : '黑白, email : '48988840@qq.com'}
  • 相关阅读:
    mysql视图定义以及创建视图
    前端页面调用spring mvc接口发生跨域问题解决方案
    亲测可用的ssm框架搭建
    python--pandas基本操作
    jieba中文处理 python
    爬虫 登录开心网,登录人人网
    Selenium&wevdriver
    django 中间件的一些基本操作
    写一个简单的登录客户端步骤
    个人对ADO连接池的理解
  • 原文地址:https://www.cnblogs.com/waitforyou/p/6916703.html
Copyright © 2011-2022 走看看