ECMAScript6入门系列一
let 命令
{
let a = 10;
var b = 1;
}
a // ReferenceError: a is not defined.
b // 1
【注】:let与var相似,用来声明变量.但是只在它所在的代码块内有效
for (let i = 0; i < 10; i++) {}
console.log(i); //Uncaught ReferenceError: i is not defined
console.log(foo); // 输出undefined
console.log(bar); // 报错ReferenceError
var foo = 2;
let bar = 2;
【注】:let不存在变量提升的概念
if (true) {
// TDZ开始
tmp = 'abc'; // ReferenceError
console.log(tmp); // ReferenceError
let tmp; // TDZ结束
console.log(tmp); // undefined
tmp = 123;
console.log(tmp); // 123
}
【注】:如果区块中存在let和const命令,这个区块对这些命令声明的变量,从一开始就形成了封闭作用域。凡是在声明之前就使用这些变量,就会报错。这在语法上,称为“暂时性死区”(temporal dead zone,简称TDZ)。
块级作用域
// 报错
function () {
let a = 10;
var a = 1;
}
// 报错
function () {
let a = 10;
let a = 1;
}
【注】:let不允许在同一作用域内重复声明一个变量
function f1() {
let n = 5;
if (true) {
let n = 10;
}
console.log(n); // 5
}
【注】:let实际上给代码新增了块级作用域
// IIFE写法 匿名函数
(function () {
var tmp = ...;
...
}());
// 块级作用域写法
{
let tmp = ...;
...
}
【注】:块级作用域使得匿名函数显得不是那么必要了
ES5规范规定,函数只能在顶层作用域和函数作用域之中声明,不能在块级作用域声明。(然后浏览器并不吃这一套,浏览器照样运行,除非在严格模式'use strict'下);而ES6引入了块级作用域的概念,则可以在块中声明函数,但是跟let一样,不可以在其他块中引用声明的函数,否则会报错(因为此规范影响大,具体还要看各浏览器对此的实现情况).
例如:
// 情况一
if (true) {
function f() {}
}
// 情况二
try {
function f() {}
} catch(e) {
}
// ES6严格模式
'use strict';
if (true) {
function f() {}
}
// 不报错
const命令
1.作用:声明一个常量,
2.特点:
- 一旦声明,常量的值不能改变.
- const一旦声明变量,就必须立即初始化,不能留到以后赋值。
const的作用域与let命令相同:只在声明所在的块级作用域内有效。
const命令声明的常量也是不提升,同样存在暂时性死区,只能在声明的位置后面使用。const声明的常量,也与let一样不可重复声明。
//eg.1
const PI = 3.1415;
PI // 3.1415
PI = 3;
// TypeError: Assignment to constant variable.
//eg.2
const foo;
// SyntaxError: Missing initializer in const declaration
//eg.3
if (true) {
const MAX = 5;
}
MAX // Uncaught ReferenceError: MAX is not defined
//eg.4
if (true) {
console.log(MAX); // ReferenceError
const MAX = 5;
}
//eg.5
var message = "Hello!";
let age = 25;
// 以下两行都会报错
const message = "Goodbye!";
const age = 30;
//eg.6
const foo = {};
foo.prop = 123;
foo.prop
// 123
foo = {}; // TypeError: "foo" is read-only
//eg.7
const a = [];
a.push('Hello'); // 可执行
a.length = 0; // 可执行
a = ['Dave']; // 报错
先到这~
ECMAScript6入门系列一的更多相关文章
- Angular2入门系列教程7-HTTP(一)-使用Angular2自带的http进行网络请求
上一篇:Angular2入门系列教程6-路由(二)-使用多层级路由并在在路由中传递复杂参数 感觉这篇不是很好写,因为涉及到网络请求,如果采用真实的网络请求,这个例子大家拿到手估计还要自己写一个web ...
- ABP入门系列(1)——学习Abp框架之实操演练
作为.Net工地搬砖长工一名,一直致力于挖坑(Bug)填坑(Debug),但技术却不见长进.也曾热情于新技术的学习,憧憬过成为技术大拿.从前端到后端,从bootstrap到javascript,从py ...
- Angular2入门系列教程6-路由(二)-使用多层级路由并在在路由中传递复杂参数
上一篇:Angular2入门系列教程5-路由(一)-使用简单的路由并在在路由中传递参数 之前介绍了简单的路由以及传参,这篇文章我们将要学习复杂一些的路由以及传递其他附加参数.一个好的路由系统可以使我们 ...
- Angular2入门系列教程5-路由(一)-使用简单的路由并在在路由中传递参数
上一篇:Angular2入门系列教程-服务 上一篇文章我们将Angular2的数据服务分离出来,学习了Angular2的依赖注入,这篇文章我们将要学习Angualr2的路由 为了编写样式方便,我们这篇 ...
- Angular2入门系列教程4-服务
上一篇文章 Angular2入门系列教程-多个组件,主从关系 在编程中,我们通常会将数据提供单独分离出来,以免在编写程序的过程中反复复制粘贴数据请求的代码 Angular2中提供了依赖注入的概念,使得 ...
- ABP入门系列(2)——通过模板创建MAP版本项目
一.从官网创建模板项目 进入官网下载模板项目 依次按下图选择: 输入验证码开始下载 下载提示: 二.启动项目 使用VS2015打开项目,还原Nuget包: 设置以Web结尾的项目,设置为启动项目: 打 ...
- Web大前端时代之:HTML5+CSS3入门系列
准备来一波新技术,待续.... Old: 联系源码:https://github.com/dunitian/LoTHTML5 文档下载:https://github.com/dunitian/LoTD ...
- 07. Web大前端时代之:HTML5+CSS3入门系列~H5 地理位置
Web大前端时代之:HTML5+CSS3入门系列:http://www.cnblogs.com/dunitian/p/5121725.html 源码:https://github.com/duniti ...
- 01.Web大前端时代之:HTML5+CSS3入门系列~初识HTML5
Web大前端时代之:HTML5+CSS3入门系列:http://www.cnblogs.com/dunitian/p/5121725.html 文档申明 <!--文档类型申明,html代表是ht ...
随机推荐
- Java笔记(五)……运算符
算术运算符 算术运算符的注意问题: 如果对负数取模,可以把模数负号忽略不记,如:5%-2=1.但被模数是负数就另当别论. 对于除号"/",它的整数除和小数除是有区别的:整数之间做除 ...
- Storm系列(十九)普通事务ITransactionalSpout及示例
普通事务API详解 1 _curtxid:" + _curtxid 46 + ",_tx.getTransactionId():&qu ...
- HW2.22
import java.util.Scanner; public class Solution { public static void main(String[] args) { Scanner i ...
- mysql均衡负载
一.利用mysql 复制分流查询操作: 利用mysql的主从复制可以有效的分流更新操作和查询操作,具体的实现是一个主服务器,承担更新操作,多台从服务器,承担查询操作,主从之间通过复制实现数据的同步.多 ...
- Sublime Text 2 使用心得
一. 前言 作为一个前端,有一款好的开发利器是必不可少的,editplus.notepad++都是不错的工具,体积轻巧,启动迅速(dw太浮肿了).最近,又有一款新的编辑器诞生,席卷前端界,惹得无数喜爱 ...
- Go Slices: usage and internals
Introduction Go's slice type provides a convenient and efficient means of working with sequences of ...
- mysql-no-install 手动安装
D:\mysql-5.5.28-win32 1.下载mysql-5.5.15-win32.zip,解压到本地D:\mysql. 2.将my-small.ini另存为my.ini .(根据情况可以选择别 ...
- WINFORM 自定义开关按钮控件-
本文章转载:http://www.cnblogs.com/feiyangqingyun/archive/2013/06/15/3137597.html OK,大工告成,上图演示效果. 源码下载:htt ...
- HDU 1847 Good Luck in CET-4 Everybody! (博弈论sg)
Good Luck in CET-4 Everybody! Problem Description 大学英语四级考试就要来临了,你是不是在紧张的复习?或许紧张得连短学期的ACM都没工夫练习了.反正我知 ...
- Bootstrap-下拉框 Combobox
Bootstrap下拉框 Combobox显示效果如下: 源代码: <select class="combobox"> <option></optio ...