美文网首页
JavaScript ECMAScript 6 笔记 -1

JavaScript ECMAScript 6 笔记 -1

作者: json_jie | 来源:发表于2017-09-27 11:56 被阅读4次

Node 是 JavaScript 的服务器运行环境

检测浏览器对ES6的支持的程度

npm install -g es-checker
es-checker

Babel 是一个广泛使用的 ES6 转码器,可以将 ES6 代码转为 ES5 代码,从而在现有环境执行

let var 关键字

ES6 新增了let命令,用来声明变量。它的用法类似于var,但是所声明的变量,只在let命令所在的代码块内有效。

屏幕快照 2017-09-27 上午11.28.59.png

var命令声明的i,在全局范围内都有效,所以全局只有一个变量i
let声明的i,当前的i只在本轮循环有效

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

var命令会发生”变量提升“现象,即变量可以在声明之前使用,值为undefined
let命令改变了语法行为,它所声明的变量一定要在声明后使用,否则报错。

屏幕快照 2017-09-27 上午11.40.49.png

暂时性死区

只要块级作用域内存在let命令,它所声明的变量就“绑定”(binding)这个区域,不再受外部的影响。

var tmp = 123;

if (true) {
  tmp = 'abc'; // ReferenceError
  let tmp;
}
上面代码中,存在全局变量tmp,但是块级作用域内let又声明了一个局部变量tmp,导致后者绑定这个块级作用域,所以在let声明变量前,对tmp赋值会报错。

ES6明确规定,如果区块中存在let和const命令,这个区块对这些命令声明的变量,从一开始就形成了封闭作用域。凡是在声明之前就使用这些变量,就会报错
使用let,const声明变量时,只要变量在还没有声明完成前使用,就会报错

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

function func(arg) {
  let arg; // 报错
}

function func(arg) {
  {
    let arg; // 不报错
  }
}

let实际上为 JavaScript 新增了块级作用域。

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

面的函数有两个代码块,都声明了变量n,运行后输出5。这表示外层代码块不受内层代码块的影响。如果两次都使用var定义变量n,最后输出的值才是10。

ES6 允许块级作用域的任意嵌套。

const 命令

const声明一个只读的常量。一旦声明,常量的值就不能改变。
const一旦声明变量,就必须立即初始化,不能留到以后赋值。

const的作用域与let命令相同:只在声明所在的块级作用域内有效。
const命令声明的常量也是不提升,同样存在暂时性死区,只能在声明的位置后面使用

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

const foo = {};

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

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

var命令和function命令声明的全局变量,依旧是顶层对象的属性;
另一方面规定,let命令、const命令、class命令声明的全局变量,不属于顶层对象的属性。
也就是说,从ES6开始,全局变量将逐步与顶层对象的属性脱钩。

相关文章

  • JavaScript ECMAScript 6 笔记 -1

    Node 是 JavaScript 的服务器运行环境 检测浏览器对ES6的支持的程度 Babel 是一个广泛使用的...

  • es6目录(阮大神)

    1.ECMAScript 6 简介 ECMAScript 和 JavaScript 的关系[https://es6...

  • ECMAScript 6

    1. ECMAScript 6 简介 ECMAScript 6.0(以下简称 ES6)是 JavaScript 语...

  • JavaScript进阶

    一、ES6基础 1. ECMAScript 6 简介 ECMAScript(ES6) 是JavaScript语言的...

  • 第一章:简介

    ECMAScript6和JavaScript的关系 ECMAScript(以下简称ES6)是JavaScript语...

  • ES6常用特性

    1、什么是ECMAScript6?和JavaScript什么关系? 1.1 什么是ECMAScript6? 首先说...

  • note1.对象,数组,字符串,变量

    JavaScript语言的标准,被称为ECMAScript标准JavaScript版本 ECMAScript 6标...

  • ECMAScript6简介

    一. ECMAScript6简介 ECMAScript和JavaScript的关系1996年,JavaScript...

  • ES6,了解一下

    ES6的历史 ECMAScript和JavaScript 首先区别ECMAScript和JavaScript。 E...

  • ECMAScript 6 简介(1)

    ECMAScript 6 简介 原文: ECMAScript 6.0(以下简称 ES6)是 JavaScript ...

网友评论

      本文标题:JavaScript ECMAScript 6 笔记 -1

      本文链接:https://www.haomeiwen.com/subject/csnyextx.html