ES6入门-let和const指令

LET:

基本用法:在javascript中声明一个变量通常使用var ,在es6中新增了let指令,用法类似var ,但是let声明的变量只能在所在的代码块有效。

??  使用let声明变量要注意一下几个点:

1,let指令不存在变量提升,所以变量一定要先声明后再使用,否则就会报错。

console.info(info);   //ReferenceError
let info;

2, 存在暂时性死区,也就是说,只要一个块级作用域中使用let声明了某个变量,那么这个变量就被绑定在这个区块了。外界对它是影响不到的。

var  info = 123;

if(true){
    info = "abc"; //ReferenceError
    let info;
}

  以上这段代码中存在全局变量info 但是在区块中又使用let声明了一个info变量,所以这个变量info就被绑定在块级作用域中,所以会报错。(??  疑问:为什么全局变量不用let来声明?是因为let声明语句是不能重复声明一个变量??)

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

//报错
function(){
    let aa = 10;
    var aa = 3;
}

//报错
function(){
    let aa = 10;
    let aa = 3;
}

// 也不能在一个函数内部重新声明参数
function(arg){
    let arg = 10;
}

 CONST:

const 用来声明常量。??一旦声明便不可改变其值。

一,与let的共同点:

1,只能在声明所在的块级作用域没有效

2,只能在声明后使用

3,const指令声明的常量也不可提升,同样存在暂时性死区,只能在声明后使用

4,不可重复声明常量

tips1 : 如果想设置跨模块常量可以使用一下写法:

// constants.js

export const a = 1;
export const b = 2;
export const c = 3;

// test1.js

import * as constants from ‘./constants‘;
console.info(constants.a);  // 1
console.info(constants.b);  // 2
console.info(constants.c);  // 3

//test2.js

import {a, b} from ‘./constants‘;
console.info(a);  // 1
console.info(b);  // 2

全局对象的属性

全局对象是最顶层的对象,在浏览器环境指的是window对象,在nide.js中指的是global对象,在es5中,全局对象的属性与变量是等价的。 如下:全局对象属性赋值和全局变量的赋值是一件事。

window.a = 1;   // a=1

a = 2; //a = 2

如上规定,很容易不自觉的创建了全局变量,ess6为了改变这一点,一方面规定,var命令和function命令声明的全局变量依旧是全局对象的属性,另一方面规定,let、const、和class命令声明的全局变量不属于全局对象的属性。

var a = 2;
window.a; // 2

let b = 3;
window.b;  //undefined

二,在es5和es6中的声明命令

es5:var  function

es6 : var  function  let  const  class

时间: 2024-10-12 02:16:02

ES6入门-let和const指令的相关文章

ES6入门之let和const命令

前言 大家好,我是一只流浪的kk,当你看到这边博客的时候,说明你已经进入了ES6学习的领域了,从本篇博客开始,我将会将自己学习到ES6的相关知识进行整理,方便大家参考和学习,那么我将带你进入第一节的内容学习let和const命令,本篇博客从三个方面进行全方位解析. let命令 首先我们需要学习的是let命令的使用,这个使用非常简单,它其实也是声明变量的一种方式,和var相比我把它的特点总结了如下四点,一起来看看吧! (1):基本用法 <!DOCTYPE html> <html> &

ES6入门十二:Module(模块化)

webpack4打包配置babel7转码ES6 Module语法与API的使用 import() Module加载实现原理 Commonjs规范的模块与ES6模块的差异 ES6模块与Nodejs模块相互加载 模块循环加载 一.webpack4打包配置babel7转码ES6 1.webpack.config.js 在webpack中配置babel转码其实就是在我之前的webpack配置解析基础上添加babel的加载器,babel的具体转码配置在之前也有一篇详细的博客做了解析: webpack安装与

ES6入门系列一(基础)

1.let命令 Tips: 块级作用域(只在当前块中有效) 不会变量提升(必须先申明在使用) 让变量独占该块,不再受外部影响 不允许重复声明 总之:let更像我们熟知的静态语言的的变量声明指令 ES6新增了let命令,用来声明变量.用法类似于var,但所声明的变量,只能在let命令所在的代码块内有效. let声明的变量只有块级作用域 'use strict' { let a = 1; } console.log(a); //结果是什么? 看一段熟悉的代码: var a = []; for (va

es6(一):es6介绍以及let,const

es是js的规范,而js是具体实现 将es6转化为es5代码工具:运用的多的是babel 在线转换地址:babel,traceur(属于谷歌) 1.let申明变量:let其实可以完全取代var,并且没有var这么多副作用 1 { 2 var a = 10; 3 let b = 10;//let申明的变量是块级作用域 4 } 5 console.log(a)//10 6 // console.log(b)//b is not defined let很适合的一种场景是:for 1 for (let

ES6中let与const命令详解

阮一峰ES6入门 let 作用域 let命令用来声明变量,但声明的变量只在let命令所在的代码块内有效. { let a = 10; var b = 1; } a // ReferenceError: a is not defined. b // 1 for循环 上图代码中i是var声明的,在全局范围内部有效,所以全局只有一个变量i. 每一次循环,变量i的值都会发生改变,而循环内被赋给数组a的函数内部的console.log(i),里面的i指向的就是全局的i. 也就是说数组a的成员里面的i,指向

Vue+koa2开发一款全栈小程序(1.课程介绍+2.ES6入门)

1.课程介绍 1.课程概述 1.做什么? Vue+koa2开发一款全栈小程序 2.哪些功能? 个人中心.图书列表.图书详情.图书评论.个人评论列表 3.技术栈 小程序.Vue.js.koa2.koa-router.mysql 2.课程亮点 1.项目前后端分离开发 Vue+koa2开发一款全栈小程序 2.完整流程,一步不少 注册小程序账号,前后端开发,打包,正式上线 2.小程序环境搭建 1.后台地址: https://mp.weixin.qq.com/ 2.文档地址: https://develo

ES6入门之变量的解构赋值(二)

前言 在上一章 ES6入门之let和const命令中我们对ES6的相关语法已经有了初步了解,上一章中我们主要学习了三大部分的内容,let命令的使用,块级作用域,const命令的使用,那么从本篇博客将进一步深入了解ES6中的相关语法,毕竟未来ES6是主流. 本章目标 学会数组的解构赋值 学会对象的解构赋值 学会字符串的解构赋值 学会数值和布尔值的解构赋值 学会函数参数的解构赋值 学会解构赋值的用途 本人对解构赋值的理解:模式匹配,匹配成功获取值,匹配不成功则为undefined,好比开心消消乐一样

es6学习 -- let和const

在es6中let和const声明的变量都只能在其声明的块级作用域中使用,所谓的块级作用域就是{}这么一对大括号. 为什么需要块级作用域? ES5 只有全局作用域和函数作用域,没有块级作用域,这带来很多不合理的场景. 第一种场景,内层变量可能会覆盖外层变量. var tmp = new Date(); function f() { console.log(tmp); if (false) { var tmp = 'hello world'; } } f(); // undefined 上面代码的原

let和const====均参考阮大神的es6入门

// 解构复制// let [foo,[[bar],baz]] = [1,[[2],3]];// console.log(foo);//1// console.log(bar);//2// console.log(baz);//3 // let [,,third] = ["foo","bar","baz"];// console.log(third)//baz; // let [x,,y] = [1,2,3];// console.log(x+&