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

let的使用以及作用范围

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

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

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

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

let的提升以及作用范围。

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

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

  1. 'use strict';
  2. (function () {
  3. var config = [];
  4. config.push(1);
  5. config.push(2);
  6. config.push(3);
  7. console.log(config) //1, 2, 3
  8. })();
  9. let configs;
  10. {
  11. configs = [];
  12. configs.push(4);
  13. configs.push(5);
  14. configs.push(6);
  15. console.log(configs) //4, 5, 6
  16. }

const的使用

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

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

  1. 'use strict';
  2. const a = {
  3. name: '铅笔'
  4. };
  5. a = 100; //此时会报错

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

  1. 'use strict';
  2. const a = {
  3. name: '铅笔'
  4. };
  5. a.name = '黑白';
  6. a.email = '48988840@qq.com';
  7. console.log(a); // {name : '黑白, email : '48988840@qq.com'}

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

  1. 'use strict';
  2. const a = {
  3. name: '铅笔'
  4. };
  5. Object.freeze(a); //a内部的所有属性和值都不能修改了。
  6. a.name = '黑白'; // 报错
  7. a.email = '48988840@qq.com'; // 报错
  8. console.log(a); // {name : '黑白, email : '48988840@qq.com'}

var、let、const的区别,以及作用范围。的更多相关文章

  1. var let const 的区别

    Var let const 的区别 1.Var 定义的变量存在变量提升,而了let和const不存在变量提升.即在定义的变量代码上使用该变量,var的会输出undefined,而let的会报错. 2. ...

  2. 【前端面试】(四)JavaScript var let const的区别

    视频链接: JavaScript var let const的区别 - Web前端工程师面试题讲解 参考链接: JavaScript 变量 JavaScript Let JavaScript Cons ...

  3. js中定义变量之②var let const的区别

    var 上一篇文章有讲过,是js定义变量的关键词. 但是在es6中,新添加了两个关键词,用于变量声明的关键词:let 和const 接下来就说一下var let 和const的区别: 首先说var 用 ...

  4. let、var、const用法区别

    1.var var 声明的变量为全局变量,并会进行变量提升:也可以只声明变量而不进行赋值,输出为undefined,以下写法都是合法的. var a var a = 123  2.let let 声明 ...

  5. JS中let、var、const的区别

    先看let和var: 1. console.log(a); // undefined var a = 3; console.log(a); // Uncaught ReferenceError: Ca ...

  6. ES6中var/let/const的区别

    let的含义及let与var的区别: let 声明的变量只在它所在的代码块有效: 如下: for (let i = 0; i < 10; i++) { console.log(i); } con ...

  7. var let const的区别

    1. 变量提升: 浏览器在运行代码之前会进行预解析,不论var声明的变量处于当前作用域的第几行,都会提升到作用域的头部.   2. 只要块级作用域内存在let命令,它所声明的变量就“绑定”这个区域,不 ...

  8. ES6 新增声明变量的 var let const 的区别详解

    var 如果使用关键字 var 声明一个变量,那么这个变量就属于当前的函数作用域,如果声明是发生在任何函数外的顶层声明,那么这个变量就属于全局作用域. let 1.let 声明的变量具有块作用域的特征 ...

  9. 【ES6 】var/let/const的区别

    var 声明变量 没有区级作用域 可以预解析 可以重复定义 声明的全局变量属于顶层对象(window)的属性 let 声明变量 有块级作用域 没有预解析 不可以重复定义 声明的全局变量不属于顶层对象( ...

随机推荐

  1. WP8.1StoreApp(WP8.1RT)---SystemTray的变化

    原Microsoft.Phone.Shell中的SystemTray,已经改到Windows.UI.ViewManagement中StatusBar了. 只能在代码中设置相关属性. 如: 1 2 3 ...

  2. Python3.5 学习二

    模块/库: Python的强大在于丰富的各种库的存在. 用import方法导入的  分为标准库.第三方库 程序运行时会先从当前目录下寻找import的模块名的文件,如果没有,则去全局环境变量对应的路径 ...

  3. 【OCP-12c】2019年CUUG OCP 071考试题库(77题)

    77.Which two statements are true about sequences created in a single instance database? (Choose two. ...

  4. 使用html2canvas截图并用jspdf打印的问题

    之前的方案确实可以打印出a4的大小的pdf,但是也呈现了诸多问题,因为这种方法是截图然后再进行打印的,所以打印出来的效果是模糊的,思前想后决定放弃了这种方式. 最终还是决定使用浏览器自带的打印方法. ...

  5. netcat 工具传输文件

    因为电脑本地是 windows,多台机器间以 windows 为中介传输文件极度不爽.window 下的 MobaXterm 工具不能使用 sz 和 rz 命令, 而 SecureCRT 工具使用体验 ...

  6. ElasticSearch.net NEST批量创建修改删除索引完整示例

    本示例采用Elasticsearch+Nest 网上查了很多资料,发现用C#调用Elasticsearch搜索引擎的功能代码很分散,功能不完整,多半是非常简单的操作,没有成型的应用示例.比如新增或修改 ...

  7. apache2 的https配置和代理https后端nodejs配置

    先进入  /usr/local/apache2/conf  目录 修改 vim httpd.conf  把下面的去掉注释 LoadModule proxy_module modules/mod_pro ...

  8. GPS坐标转百度地图坐标

    百度地图提供了相关API:BMap.Convertor.translate, 但是使用上存在部分限制:1.次数限制:2.异步回调 可以用如下方法: /** * 地图位置计算工具(将GPS坐标转换成百度 ...

  9. Azure CLI2.0 捕获Linux ARM非托管磁盘虚拟机并创建ARM托管磁盘虚拟机

    1.系统内部取消预配VM,创建了测试文件目录及文件:hlm20180904/ hlm20180904.txt 2.使用CLI2.0创建VM映像 a.登陆CLI2.0 备注:在 Azure 中国区使用 ...

  10. leetcode-733-Flood Fill

    题目描述: An image is represented by a 2-D array of integers, each integer representing the pixel value ...