深入理解ES6--块级作用域(let const)

原创 2017年09月03日 23:19:12

var 声明及变量提升机制

var 的声明提升机制 —> 在函数作用域或全局作用域中通过关键字var 声明的变量,无论实际在哪里声明,都会被当成在当前作用域(ES5作用域,只有函数能起到块级作用域的目的)顶部声明的变量.
var 声明的变量会覆盖window的原有对象

var value;
if(true){
    //可以重复声明
    var value = 1;
}
//本应该只作用在if 花括号之内
console.log(value);//1;
var Math = 1; //window.Math === Math  true

ES6 的块级声明

let 声明

1.let 不能重复声明
2.只作用在当前代码块
3.声明的变量不会覆盖window 上面的变量

if(true){
    let value = 1;
}
console.log(value);//undefined;

let Math = 1; //window.Math === Math  false
/*带来的问题:
当你使用iframe去调用对象的时候.由于let 声明的变量不在window上面,
无法通过iframe调用,所以这种情况需要使用var来声明变量 */

const 声明

const表示声明的是常量,和let 一样也是块级作用域
1.const 不能重复声明
2.声明同时需要赋值
3.不能重复赋值
4.声明的是对象的话,可以修改对象的内容
5.声明的变量不会覆盖window 上面的变量

const val; // 语法错误,常量未初始化
const value = 1;
if(true){
    //作用域不同可以声明,let 可以置换为const
    let value = 1;
}
value = 2; //语法错误,不能重复赋值 

const obj = {};
obj.xx = "xx";//可以修改对象的内容
obj = 1;//错误,不能修改obj 的绑定

临时死区

用来描述let 和const 声明的变量不提升的效果

if(true){
    console.log(typeof value);//错误:value is not defined
    let value = 'val';
}

循环中的声明

    var funcs = [];
    for (var i = 0; i < 10 ; i++) {
        funcs.push(function(){
            console.log(i);
        })
    }
    funcs.forEach(function(v){
        v(); //输出 10次10,让新手很痛苦的问题,需要用闭包解决,在此就不赘述
    })

    var funcs = [];
    for (let i = 0; i < 10 ; i++) {
        funcs.push(function(){
            console.log(i);
        })
    }
    funcs.forEach(function(v){
        v(); //输出0,1,2,3,4,5,6,7,8,9
    })
    //const 的话会报错,再循环中,for(let i=0;i<10;i++)
    //相当于给 i 赋值10次,const 不能重复赋值所以报错

    for(const key in obj){
        //当const 遍历对象 ,循环迭代,不会报错
    } 
版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/qq_29594393/article/details/77828794

深入理解远程调用之Hessian

本技术分享视频主要从3个方面来介绍hessian。(1)hessian入门应用实现(2)源码角度分析hessian基本的原理(3)深入源码解析hessian的序列化和反序列化机制
  • 2017年06月24日 20:03

初步探究ES6之let,const和块级作用域

我们知道javascript定义变量的方式是var,但是var有几个问题。var第一个就是作用域的问题,var不是针对一个块级作用域,而是针对一个函数作用域。举个例子:function runTowe...
  • mevicky
  • mevicky
  • 2015-11-13 09:28:41
  • 5091

JS中的块级作用域,var、let、const三者的区别

首先,ECMAScript和JavaScript关系:       ECMAScript是一个国际通过的标准化脚本语言。JavaScript由ECMAScript和DOM、BOM三者组成。可以简单理...
  • hot_cool
  • hot_cool
  • 2017-10-21 12:22:35
  • 1403

ES6折腾记- let/const块级变量及块作用域

话说ES6之前有局部变量,全局变量,唯独木有块级变量;也没有常量之说...
  • bomess
  • bomess
  • 2016-09-29 05:46:54
  • 2455

ES6-let带来了更简单的块级作用域

let 带来了更简单的块级作用域 1. ES6新增了let命令,用于声明变量。其与var的不同在于,用let声明的变量只在 { } 内有效。这使得我们可以很方便的实现块级作用域,不再使用立即实行函数。...
  • qiqingjin
  • qiqingjin
  • 2016-04-04 21:39:57
  • 836

理解es6中的暂时性死区

在ES6的新特性中,最容易看到TDZ作用就是在let/const的使用上,let/const与var的主要不同有两个地方: let/const是使用区块作用域;var是使用函数作用域 ...
  • nicexibeidage
  • nicexibeidage
  • 2017-09-30 17:02:15
  • 522

ES6之let,const和块级作用域

var 第一个就是作用域的问题,var不是针对一个块级作用域,而是针对一个函数作用域。举个例子: function runTowerExperiment(tower, startTime) {...
  • qq_35087256
  • qq_35087256
  • 2018-03-14 12:11:26
  • 56

ES6之let、const和块级作用域

let、const和块级作用域
  • kaelyn_X
  • kaelyn_X
  • 2017-11-02 23:27:42
  • 97

let、const、var和块级作用域

我们知道JavaScript定义变量的方式是var,但是var有几个问题。var第一个就是作用域的问题,var不是针对一个块级作用域,而是针对一个函数作用域。 为了解决这些问题,ES6提出了l...
  • lilythy2016
  • lilythy2016
  • 2017-05-10 16:58:07
  • 219

观察babel如何把let转化为var实现块级作用域

在讲述javascript没有块级作用域的时候都会提到一个非常经典的例子:var obj={ name:'helo', age:15 }; var arr=[]; for(va...
  • oulihong123
  • oulihong123
  • 2017-01-15 23:34:38
  • 1072
收藏助手
不良信息举报
您举报文章:深入理解ES6--块级作用域(let const)
举报原因:
原因补充:

(最多只允许输入30个字)