let命令

为es6新增命令,用来声明变量,类似于var,但是let所声明的变量,只在let命令所在的块级作用域内有效

块级作用域写法(ES6块级作用域允许任意嵌套):

// 块级作用域写法
{
let tmp = ...;
...
}

块级作用域例1

for (let i = 0; i < 10; i++) {
// ...
} console.log(i);
//ReferenceError: i is not defined

解析:上面代码中,i的作用域是for循环体内,在循环体外引用就会报错。

块级作用域例2

function f1() {
let n = 5;
if (true) {
let n = 10;
}
return n
}
console.log(f1())//5

解析:栗子说明,外层代码块不受内层代码块的影响。

---------------------------------------------------------------------------------------------------------------------------------

let与var的区别

1.var 没有块级作用域,let有块级作用域

var实例

var a = [];
for (var i = 0; i < 10; i++) {
a[i] = function () {
console.log(i);
};
}
a[6](); //

分析:代码中,i在全局范围内有效,所以全局只要一个变量i。每一次循环,变量i的值都会发生变化,而数组a函数内部的console.log(i),里面的i和全局i为同一个。

let实例

var a = [];
for (let i = 0; i < 10; i++) {
 a[i] = function () {
console.log(i);
};
}
a[6](); //

分析:代码中的i使用let声明的,只在本轮循环有效,每一次循环的i其实都是一个新的变量(why?javascript引擎内部会记住上一轮循环的值,初始化本轮的变量i时,就在上一轮循环的基础上进行计算)

另外,for循环还有一个特别之处,就是设置循环变量的那部分是一个父作用域,而循环体内部是一个单独的子作用域。

for (let i = 0; i < 3; i++) {
let i = 'abc';
console.log(i);
}

2.var 存在变量提升,let不存在变量提升("变量提升"是指变量可以在声明之前使用,值为undefined·)

例:

/ var 的情况
console.log(foo); // 输出undefined
var foo = 2; // let 的情况
console.log(bar); // 报错ReferenceError
let bar = 2;

 3.let暂时性死区

只要块级作用域内存在let命令,它所声明的变量的作用域就是这个区域,

例如

var tmp = 123;

if (true) {
tmp = 'abc'; // ReferenceError
let tmp;
}

解析:tmp的作用域为块级作用域,报错原因:未声明直接使用,

4.let不允许重复声明

let不允许在相同的作用域内,重复声明同一个变量

例子

// 报错 Uncaught SyntaxError: Identifier 'a' has already been declared
function func() {
let a = 10;
var a = 1;
} // 报错
function func() {
let a = 10;
let a = 1;
}

扩展:不能在函数内部重新声明参数

function func(arg) {
let arg; // 报错,相同的作用域内
} function func(arg) {
{
let arg; // 不报错 函数参数arg 和此处的arg不在同一个作用域内
}
}

总结:

1.let命令有块级作用域
2.let命令先声明再使用
3.let命令不可重复声明(同一作用域)

相关资料:http://es6.ruanyifeng.com/#docs/let

作者:smile.轉角

QQ:493177502

【ES6】let 命令的更多相关文章

  1. ES6之命令妙用

     很多人都听说过ES6(也就是ECMAScript的新一代标准)并且对她充满了向往,下面通过一个ES6中小知识点——let命令,来解开她的神秘面纱,让大家初步认识一下ES6的语法规范.        ...

  2. JS ES6 -- let命令

    1.ES6新增了块级作用域的let和const 这新特性let命令,用来声明变量.它的用法类似于var,但是所声明的变量,只在let命令所在的代码块内有效. for循环的计数器,就很合适使用let命令 ...

  3. ES6 新增命令

    let               用来声明变量.它的用法类似于var,但是所声明的变量, 只在let命令所在的代码块内有效. 例: {var a=10; let b=20;}; console.lo ...

  4. React相关:npm,ES6,

    1.NPM: 参考:npm使用入门  npm 学习笔记整理 2.ES6参考:ES6 let命令:ES6新增了let命令,用来声明变量.它的用法类似于var,但是所声明的变量,只在let命令所在的代码块 ...

  5. ES6 快速开始

    Refs 现代框架 Vue React 都使用到了 ES6 (包括D3js) [常量] // ES5 中常量的写法 Object.defineProperty(window, "PI2&qu ...

  6. es6的let与const

    es6新增命令let,用于声明变量,他与var的不同主要有三点: let有块级作用域 let没有变量提升 同级作用域内,let不可以重复定义 let有块级作用域: es5 for(var i=0;i& ...

  7. Vue2.0+Node.js+MongoDB全栈打造商城系统 免费下载

    <ignore_js_op> 课程目录||--第01章 课程介绍|    01-01 课程-导学.mp4|    01-02 前端框架回顾.mp4|    01-03 vue概况以及核心思 ...

  8. 【Web前端】用CSS3实现弹幕

    初版 用css3来实现弹幕确实比较简单,只需要设置动画让弹幕从屏幕右侧移动到屏幕左侧即可,一开始是这样实现的 .danmu { position: fixed; left: %; animation: ...

  9. 学习Karma+Jasmine+istanbul+webpack自动化单元测试

    学习Karma+Jasmine+istanbul+webpack自动化单元测试 1-1. 什么是karma?  Karma 是一个基于Node.js的Javascript测试执行过程管理工具.该工具可 ...

随机推荐

  1. JavaScript主流框架3月趋势总结

    原文: What’s New in JavaScript Frameworks-March 2018 译者: Fundebug 为了保证可读性,本文采用意译而非直译.另外,本文版权归原作者所有,翻译仅 ...

  2. LintCode Majority Number II / III

    Given an array of integers, the majority number is the number that occurs more than 1/3 of the size ...

  3. C# AESCBC256 与 java AESCBC256 加解密

    和某上市公司对接接口,他们试用 java AES CBC PKCS5 256 加解密.网上C# 基本不合适. 注意:C# PKCS7 对应 java PKCS5 /// <summary> ...

  4. blfs(systemd版本)学习笔记-编译安装配置dhcpcd

    我的邮箱地址:zytrenren@163.com欢迎大家交流学习纠错! dhcpcd项目地址:http://www.linuxfromscratch.org/blfs/view/stable-syst ...

  5. 【代码笔记】Web-JavaScript-JavaScript表单验证

    一,效果图. 二,代码. <!DOCTYPE html> <html> <head> <meta charset="utf-8"> ...

  6. LVS + nginx实现高性能精准负载均衡

  7. mac os安装多个版本的chrome

    1.下载chrome69安装程序后,双击dmg文件 2.将chrome拖到Application文件夹,如图,选择保留两者,不要替换 打开应用程序,会多出一个Google Chrome2,重命名为Go ...

  8. this和e.target的异同

    每次触发DOM事件时会产生一个事件对象(也称event对象),此处的参数e接收事件对象.而事件对象也有很多属性和方法,其中target属性是获取触发事件对象的目标,也就是绑定事件的元素,e.targe ...

  9. 微信小程序 刷新当前页面

    刷新当前页面 Measure 法一: 需要的地方 this.onLoad(),试过之后,无用!!! 法二:亲测有效 在this.onReady()中进行获取数据操作(这样一来,就既可以在初次显示时直接 ...

  10. Android 自定义弹出框带EditText

    EditText 布局页面 edittext_ownername_dialog.xml: <?xml version="1.0" encoding="utf-8&q ...