声明变量

首先我们来回顾一下 es6 之前声明变量的方法:通常情况下,在 JavaScript 中,我们只有一种声明变量的关键字--var,我们使用 var 声明变量,使用 = 给变量赋值。在es6中我们可以使用新增的关键字let和const声明变量:let声明变量的方法和var一致,均可先声明再赋值,或直接声明并赋值;const声明变量时,不可先声明再赋值,必须直接声明并赋值,否则会报错,并且const声明的变量一旦生产声明过后,就不可再更改,我们可以理解一般用const声明常量;

var str;                //声明变量
str = 'Learning';       //变量赋值
var str2 = 'Learning';  //直接声明并赋值

let str;                //声明变量
str = 'Learning';       //变量赋值
let str2 = 'Learning';  //直接声明并赋值

const str;              //报错Uncaught SyntaxError: Missing initializer in const declaration
const str3 = 'Learning';//直接声明并赋值

作用于块作用域

除此之外,let和const的作用域与var不同,let和const声明的变量只能在当前的块作用域内访问到;

{
  let a = 10;
  var b = 1;
}

a // 报错ReferenceError: a is not defined.
b 

不可以变量提升

var可以变量提升,即在声明变量之前使用,值为undefined;let、const不可以变量提升,在声明变量之前使用会报错;

// var 的情况
console.log(foo); // 输出undefined
var foo = 2;

// let 的情况
console.log(bar); // 报错ReferenceError
let bar = 2;

暂时性死区

只要块级作用域内存在let或const命令,它所声明的变量就“绑定”(binding)这个区域,不再受外部的影响,形成封闭作用域。凡是在声明变量之前访问变量都会报错,在作用域内,声明变量之前,该变量是不可用的,这称为“暂时性死区”。

var a = 'string';
if(true) {
    console.log(a); // ReferenceError

    a = 'abc';      // ReferenceError
    console.log(a); // ReferenceError

    let a;
    console.log(a); // undefined

    a = 123;
    console.log(a);
}

不可重复声明

let不允许在同一个作用域内声明同一个变量。

let a = 1;
var a = 2;  // Uncaught SyntaxError: Identifier 'a' has already been declared

let a = 2;  // Uncaught SyntaxError: Identifier 'a' has already been declared

let a = 1;
let a = 2;  // Uncaught SyntaxError: Identifier 'a' has already been declared

const定义复合类型

const声明变量的本质是变量指向的内存地址所保存的数据不得改动。对于单类型的数据(数值、字符串、布尔值),值就保存在变量指向的那个内存地址,因此等同于常量。但对于复合类型的数据(主要是对象和数组),变量指向的内存地址,保存的只是一个指向实际数据的指针,const只能保证这个指针是固定的(即总是指向另一个固定的地址),至于它指向的数据结构是不是可变的,就完全不能控制了。

const foo = {};

// 为 foo 添加一个属性,可以成功
foo.prop = 123;
foo.prop 

// 将 foo 指向另一个对象,就会报错
foo = {}; // TypeError: "foo" is read-only

为了使对象冻结,在声明变量的时候,我们使用Object.freeze方法。

const foo = Object.freeze({});

// 常规模式时,下面一行不起作用;
// 严格模式时,该行会报错
foo.prop = 123;

将对象本身冻结,对象的属性也应该冻结。下面是一个将对象彻底冻结的函数。

var constantize = function(obj){
  Object.freeze(obj);
  Object.keys(obj).forEach( (key, i) => {
    if ( typeof obj[key] === 'object' ) {
      constantize( obj[key] );
    }
  });
};

es6声明变量的6中方法

var、function、let、const、import、class

ES6--变量的更多相关文章

  1. ES6——变量

    ES6变量: 1.var 可以重复声明: 无法限制修改: 没有块级作用域:(如,{...},if(){..} ...) 2.let 不可以重复声明,变量—可以重复修改,有块级作用域: let a = ...

  2. es6变量和函数的提升、暂时性死区?

    es6变量和函数的提升.暂时性死区?

  3. ES6 变量的解构赋值

    数组的解构赋值     var [a,b,c] = [1,2,3];    左边是变量,右边是值,根据数据结构一一对应 只要等号两边的模式相同,左边的变量就会被赋予右边对应的值,必须模式相同 如果等号 ...

  4. ES6 - 变量的解构赋值学习笔记

    变量的解析赋值 数组的解析赋值 es6允许按照一定的模式,从数组和对象中提取值,对变量进行赋值,这就称为解构. var a = 1; var b = 2; var c = 3; //在es6中允许写成 ...

  5. ES6 变量、常量声明总结

    较之前ES5,新颁布在声明上有改变 一.var  对比  let 1.作用域不同 let只在命令所在的代码块 {} 里有效 ES5只有全局作用域和函数作用域,没有块级作用域,带来很多不合理的场景,比如 ...

  6. es6变量声明和解构赋值

    /*声明: * 本文内容多为学习借鉴性内容,大部分非原创 * 特别感谢阮一峰的 ECMAScript6 入门,推荐大家学习 */ 一.es5变量声明的不足 1.变量提升和函数声明提升 es5的代码加载 ...

  7. ES6 变量的解构

    默认值 let [foo = true] = []; foo // true let [x, y = 'b'] = ['a']; // x='a', y='b' let [x, y = 'b'] = ...

  8. ES6变量解构赋值

    ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构ES6之前我们申明多个变量需要按照下面的方法: let l a=1; let b=2; let c=3; let d=4; ...

  9. es6变量解构赋值的用途

    这里是我觉得es6解构赋值,在平时我们写js的时候非常有用,而且经常用到的地方,能简化我们的代码,让写代码简介优雅易读; 用途 1.交换变量的值,太方便了这逼,写法不仅简介而且一看就明白 let [x ...

  10. es6变量的解构赋值学习笔记

    1. 解构赋值的规则是,只要等号右边的值不是对象,就先将其转为对象.由于undefined和null无法转为对象,所以对它们进行解构赋值,都会报错. let { prop: x } = undefin ...

随机推荐

  1. client-go中的golang技巧

    client-go中有很多比较有意思的实现,如定时器,同步机制等,可以作为移植使用.下面就遇到的一些技术讲解,首先看第一个: sets.String(k8s.io/apimachinery/pkg/u ...

  2. java-NIO-FileChannel(文件IO)

    Java NIO中的FileChannel是一个连接到文件的通道.可以通过文件通道读写文件. FileChannel无法设置为非阻塞模式,它总是运行在阻塞模式下. 对于文件的复制,平时我们都是使用输入 ...

  3. Codeforces 758B:Blown Garland(模拟)

    http://codeforces.com/problemset/problem/758/B 题意:给出一个字符串,每4个位置对应一个颜色,如果为‘!’的话,代表该灯泡是坏的,问最后每个颜色坏的灯泡的 ...

  4. JDK源码阅读(三):ArraryList源码解析

    今天来看一下ArrayList的源码 目录 介绍 继承结构 属性 构造方法 add方法 remove方法 修改方法 获取元素 size()方法 isEmpty方法 clear方法 循环数组 1.介绍 ...

  5. Egret入门学习日记 --- 第四篇

    第四篇(学习篇) 好了,今天继续把昨天的问题解决了. 今天见鬼了. 现在界面又出来了.唯一我动过的地方,应该就是这里: 是的,我点了一下刷新.之后,不管我怎么创建新的EXML文件,放在src目录,还是 ...

  6. 使用GDAL实现DEM的地貌晕渲图(一)

    目录 1. 原理 1) 点法向量 2) 日照方向 (1) 太阳高度角和太阳方位角 (2) 计算过程 3) 晕渲强度 2. 实现 3. 参考 @ 1. 原理 以前一直以为对DEM的渲染就是简单的根据DE ...

  7. Logstash : 从 SQL Server 读取数据

    有些既存的项目把一部分日志信息写入到数据库中了,或者是由于其它的原因我们希望把关系型数据库中的信息读取到 elasticsearch 中.这种情况可以使用 logstash 的 jdbc input ...

  8. NOIP最后阶段每日小记

    前言:最后几天了,记录一下每天的经验.教训.启示.大牛路过请补充一点内容…… 2017-10-31 21:32 今天考试打完第一题就知道是AK场,然后就死命搞题,结果第一题手贱多打了一个%,本机无显示 ...

  9. Eclipse安装STS插件

    由于Spring的配置文件较多,基于Eclipse配置也比较复杂.为了提高开发的效率,建议使用STS开发工具开发,或者在Eclipse安装一个STS插件. 在开发者配置bean的class时候能够根据 ...

  10. 说说WPF的依赖属性

    首先,我们先来大概了解一下依赖属性 什么是依赖属性:依赖属性自己没有值,通过依赖别人(如Binding)来获得值. 依赖属性为什么会出现:控件常用字段有限,包装太多属性会占用过高内存,造成浪费.所以用 ...