ES6学习摘要（01）（新人学习）

dmlllll 发布于2019-08-21 17:59 / 1681人阅读

摘要：入门一前言由于最近本人在学习，做一些笔记能够更好的熟悉，就趁此机会来写一篇关于的新人学习摘要吧。的作用域与命令相同只在声明所在的块级作用域内有效。块级作用域新增方式和实际上为新增了块级作用域。同时，函数声明还会提升到所在的块级作用域的头部。

ECMAScript6/ES6 入门 一、前言

由于最近本人在学习ES6，做一些笔记能够更好的熟悉，就趁此机会来写一篇关于ES6的新人学习摘要吧。希望大佬可以给出一些意见，也希望和我一样的新人能更好更快的了解和熟悉ES6。
首先在这边我要感谢阮大大~有这么好的入门教程（搬运工，部分内容不讲述）。
其次注明本文只用于本人和其他新手了解熟悉ES6，非其他用途。
下面就开始我们简单的学习吧~

二、浏览器兼容性

不多赘述，ES6兼容性

三、let和const命令

在学习let和const之前，我们先来了解一下块级作用域，块级作用域主要适用两种场景，一种是内层变量覆盖外层变量；第二种场景是用来计数的循环变量泄露为全局变量。

// 第一种场景
var tmp = new Date();

function f() {
  console.log(tmp);
  if (false) {
    var tmp = "hello world";
  }
}

f(); // undefined

// 第二种场景
var s = "hello";

for (var i = 0; i < s.length; i++) {
  console.log(s[i]);
}

console.log(i); // 5

块级作用域能很好的解决这两方面的问题，如何增加块级作用域呢？等我们学习完let和const再来详述。
1、let和var一样，用来声明变量，差别在于let申明的变量的作用域只针对于let命令所在的代码块内。

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

a // ReferenceError: a is not defined.
b // 1

在代码块中我们分别以let和var申明了a，b两个变量，在打印a，b两个变量的时候发现用var声明的变量b的值是能正确打印的，但是用let申明的a变量报错，这表面两者申明的作用域不同。

用let申明的变量无变量提升

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

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

上面的代码中同样在声明变量前打印出该变量，var申明的变量输出undefined，而let报错，即变量bar不存在，所以使用let一定要在申明后进行使用。

暂时性死区

暂时性死区是什么意思呢，简单来说就是从一开始就形成了封闭作用域。凡是在声明之前就使用这些变量，就会报错。

var tmp = 123;

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

不允许重复声明

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

// 报错
function func() {
  let a = 10;
  let a = 1;
}

2、const声明一个只读的常量。一旦声明，常量的值就不能改变。

const声明的变量不得改变值，这意味着，const一旦声明变量，就必须立即初始化，不能留到以后赋值。

const的作用域与let命令相同：只在声明所在的块级作用域内有效。

const命令声明的常量也是不提升，同样存在暂时性死区，只能在声明的位置后面使用。

const foo;
// SyntaxError: Missing initializer in const declaration
const PI = 3.1415;
PI // 3.1415

PI = 3;
// TypeError: Assignment to constant variable.

if (true) {
  const MAX = 5;
}

MAX // Uncaught ReferenceError: MAX is not defined

3、块级作用域
新增方式：

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

使用{}创建块级作用域（可以任意嵌套）

{{{{
  let insane = "Hello World";
  {let insane = "Hello World"}
}}}};

优点：使得获得广泛应用的立即执行函数表达式（IIFE）不再必要了。

// IIFE 写法
(function () {
  var tmp = ...;
  ...
}());

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

注意：只有在ES6中，允许以下三条规则（ES5不可）

允许在块级作用域内声明函数。

函数声明类似于var，即会提升到全局作用域或函数作用域的头部。

同时，函数声明还会提升到所在的块级作用域的头部。

4、do表达式（提案）
不赘述，使得块级作用域可以变为表达式，也就是说可以返回值

let x = do {
  let t = f();
  t * t + 1;
};

GPU云服务器云服务器摘要文本自动摘要消息摘要算法摘要式认证

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/90312.html

ES6学习摘要（03）（新人学习）

摘要：字符的表示法允许采用形式表示一个字符，其中表示字符的码点。方法，用来将字符的不同表示方法统一为同样的形式，这称为正规化。，默认参数，表示标准等价合成，返回多个简单字符的合成字符。返回布尔值，表示参数字符串是否在原字符串的头部。 ECMAScript6/ES6 入门 let和const命令变量的解构赋值五、字符串的扩展注：这章没什么可以理解的，看过一遍就行，所以大体上我把有用的一些东...

番茄西红柿 2019-08-22 11:21 评论0 收藏0
ES6学习摘要（02）（新人学习）

摘要：默认值同时，对象解构赋值也允许设置默认值，默认值生效的判断条件同数组，只有在对应值严格等于时会生效。报错如果要将一个已经声明的变量用于解构赋值，必须非常小心。的规则是，只要有可能导致解构的歧义，就不得使用圆括号。 ECMAScript6/ES6 入门 let和const命令四、变量的解构赋值在ES6之前，数组和对象属性赋值只能直接指定固定值，ES6 允许按照一定模式，从数组和对象中...

Jonathan Shieber 2019-08-22 13:40 评论0 收藏0
2017前端现状--答题救不了前端新人

摘要：众所周知，前端近几年闹了一场革命。这些问题反应了什么现象确实前端很火，引来了一批批新人。前端小白们如火如荼的学习着现在前端流行的新技术栈。写在最后所以啊，在目睹了很多白痴问题后，我终于发出了一声呐喊，答题救不了前端新人。众所周知，前端近几年闹了一场革命。前端在编程领域也掀起了学习潮。至少在中国，从2013年下半年至今，在搜索指数上，有着爆炸式的增长。可以看下数据：百度指数，Googl...

jone5679 2019-08-20 17:37 评论0 收藏0
2017前端现状--答题救不了前端新人

摘要：众所周知，前端近几年闹了一场革命。这些问题反应了什么现象确实前端很火，引来了一批批新人。前端小白们如火如荼的学习着现在前端流行的新技术栈。写在最后所以啊，在目睹了很多白痴问题后，我终于发出了一声呐喊，答题救不了前端新人。众所周知，前端近几年闹了一场革命。前端在编程领域也掀起了学习潮。至少在中国，从2013年下半年至今，在搜索指数上，有着爆炸式的增长。可以看下数据：百度指数，Googl...

alogy 2019-08-01 17:04 评论0 收藏0
新人学习，照文档手撸webpack,bug基本修复完善（有问题请联系我，并非完全原创，不喜勿喷。。。

摘要：介绍简单点来说就就是一个配置文件，所有的魔力都是在这一个文件中发生的。一安装全局安装在文件夹里面也需要安装这个是在你根目录下进行的全局安装记得加太慢，推荐用的镜像安装方法一样。二创建项目新建文件夹命令行输入命令。介绍：webpack简单点来说就就是一个配置文件，所有的魔力都是在这一个文件中发生的。这个配置文件主要分为三大块 entry 入口文件让webpack用哪个文件作为项目的...

xiangchaobin 2019-08-21 11:33 评论0 收藏0