ECMAScript6块级作用域及新变量声明(let)


很多语言中都有块级作用域,但JS没有,它使用var声明变量,以function来划分作用域,大括号“{}” 却限定不了var的作用域。用var声明的变量具有变量提升(declaration hoisting)的效果。

ES6里增加了一个let,可以在{}, if, for里声明。用法同var,但作用域限定在块级,let声明的变量不存在变量提升。

示例1: 块级作用域 if

function getVal(boo) {
  if (boo) {
    var val = 'red'
    // ...
    return val
  } else {
    // 这里可以访问 val
    return null
  }
  // 这里也可以访问 val
}

变量val在if块里声明的,但在else块和if外都可以访问到val。

把var换成let,就变成这样了

function getVal(boo) {
  if (boo) {
    let val = 'red'
    // ...
    return val
  } else {
    // 这里访问不到 val
    return null
  }
  // 这里也访问不到 val
} 

示例2: 块级作用域 for

function func(arr) {
  for (var i = 0; i < arr.length; i++) {
    // i ...
  }
  // 这里也可以访问到i
}

变量i在for块里声明的,但在for外也能访问到。

把var换成let,for外就访问不了i

function func(arr) {
  for (let i = 0; i < arr.length; i++) {
    // i ...
  }
  // 这里访问不到i
}

示例3: 变量提升(先使用后声明)

function func() {
  // val先使用后声明,不报错
  alert(val) // undefined
  var val;
}

变量val先使用后声明,输出undefined,也不报错。

把var换成let,就报错了

function func() {
  // val先使用后声明,报语法错
  alert(val)
  let val;
} 

示例4: 变量提升(先判断后声明)

function func() {
  if (typeof val == 'undefined') {
    // ...
  }
  var val = ''
}

使用typeof判断时也可以再var语句的前面

但把var换成let,if处报语法错

function func() {
  if (typeof val == 'undefined') {
    // ...
  }
  let val = '';
}

ES6规定,如果代码块中存在let,这个区块从一开始就形成了封闭作用域。凡是在声明之前就使用,就会报错。即在代码块内,在let声明之前使用变量都是不可用的。语法上有个术语叫“暂时性死区”(temporal dead zone),简称TDZ。当然TDZ并没有出现在ES规范里,它只是用来形象的描述。

let的注意事项

1. 不能重复声明

// var和let重复声明
var name = 'Jack';
let name = 'John';
 
// 两个let重复声明
let age = 24;
let age = 30;

执行时报语法错

2. 有了let后,匿名函数自执行就可以去掉了

// 匿名函数写法
(function () {
 var jQuery = function() {};
 // ...
 window.$ = jQuery
})();
 
// 块级作用域写法
{
 let jQuery = function() {};
 // ...
 window.$ = jQuery;
}

以上所述就是本文的全部内容了,希望大家能够喜欢。



相关阅读:
Win10准正式版10240出现UAC窗口提示问题
最简单的Oracle数据恢复 select as of使用方法
苹果Mac查看硬盘是否开启ACHI模式的方法图解
php实现数组筛选奇数和偶数示例
谈一谈js中的执行环境及作用域
使用getBoundingClientRect方法实现简洁的sticky组件的方法
asp.net 图标提取以及图标转换的实例代码
Android App开发中Gradle构建过程的配置方法
jQuery中阻止冒泡事件的方法介绍
HTML5几个设计和修改的页面范例分享
.NET运行界面上,实现随意拖动控件的方法
用PHP提取中英文词语以及数字的首字母的方法介绍
Win7复制文件时提示错误代码0X80070057的解决方法
javascript实现动态加载CSS
快速导航
PHP MySQL HTML CSS JavaScript MSSQL AJAX .NET JSP Linux Mac ASP 服务器 SQL jQuery C# C++ java Android IOS oracle MongoDB SQLite wamp 交通频道 作文范文 电业局文明建设十一五规划 这个春天,是落下的花在埋葬着我们的青春 七堇年语录 音乐会150字 物质与精神 奥运冠军作文 《红岸止》忧伤的童年歌谣 相思书作文300字 水文站述职报告 读《纸雁儿》有感800字 圣诞祝福短信给前任 “嘉年华”刺激一玩1000字 描写秋天的风的句子 秋天的风象一群娃娃 小学教师优秀演讲稿 令我敬佩的一个人 学习科学发展观调研阶段工作计划 总算有了一个家 走马灯为什么会“走” 教师招考教育学试题整理 南国,二月的风 我的季节不下雪_关于友谊的话题作文700字 樱雨星作文250字 巧取豪夺造句 大学生自我介绍 假如我是池中的一朵荷花作文100字 告别白宫 中国梦演讲稿:用“心”浇灌我们的梦 夜上浓妆。『楼转朱阁(上)』作文3000字 追风的人 妹妹来我家作文 党的十七大报告关键词解读:生态文明 2016公司党委与街道党工委联建协议签订仪式主持词 高三记叙文大全:雅安我为你祈福作文800字 我爱过的女孩子、这才是真实的我! 我能行的作文 傻宝贝以后别说傻话了 丑小鸭我想对你说作文300字 牵手了,就这么一直走下去吧 工作上失职检讨书范文 内外交困反义词_内外交困近义词 小班六一儿童节亲子活动方案 两条腿的快马 5年级下册1单元作文 阅读成就梦想,梦想陪伴成长作文800字 刘仪伟的名言 3D错觉艺术馆 圣诞节给领导的祝福语 同学毕业祝福语 2014年纠风工作计划 保护绿色家园作文

Copyright © 2016 phpStudy |