ES6笔记总结

首先我们需要了解一下什么是 ECMA：

ECMA（European Computer Manufacturers Association）中文名称为欧洲计算机制造商协会，这

个组织的目标是评估、开发和认可电信和计算机标准。1994 年后该组织改名为 Ecma 国际

什么是 ECMAScript ：

ECMAScript 是由 Ecma 国际通过 ECMA-262 标准化的脚本程序设计语言；

百度百科：https://baike.baidu.com/history/ECMAScript/1889420/144946978

ECMA-262 历史 ：

ES6 从开始制定到最后发布，整整用了 15 年。

前面提到，ECMAScript 1.0 是 1997 年发布的，接下来的两年，连续发布了 ECMAScript 2.0

（1998 年 6 月）和 ECMAScript 3.0（1999 年 12 月）。3.0 版是一个巨大的成功，在业界得到

广泛支持，成为通行标准，奠定了 JavaScript 语言的基本语法，以后的版本完全继承。直到今

天，初学者一开始学习 JavaScript，其实就是在学 3.0 版的语法。

ECMA-262其实就是javascript

个人还是比较推荐使用ES6的，ES6 的版本变动内容最多，具有里程碑意义，其中也是加入许多新的语法特性，编程实现更简单、高效；

那下面我们就来看下ES6有哪些新特性吧：

1.let 关键字

let 关键字用来声明变量，使用 let 声明的变量有几个特点：

1. 不允许重复声明；

2. 块儿级作用域（局部变量）；

3. 不存在变量提升；

4. 不影响作用域链；

2.const 关键字 

const 关键字用来声明常量，const 声明有以下特点：

1. 声明必须赋初始值；

2. 标识符一般为大写（习惯）；

3. 不允许重复声明；

4. 值不允许修改；

5. 块儿级作用域（局部变量）；

3.变量和对象的解构赋值

什么是解构赋值：

ES6 允许按照一定模式，从数组和对象中提取值，对变量进行赋值，这被称为解构赋值；

应用场景：

频繁使用对象方法、数组元素，就可以使用解构赋值形式；

 代码实现：

// ES6 允许按照一定模式，从数组和对象中提取值，对变量进行赋值，这被称为解构
赋值；
// 1、数组的解构赋值
const F4 = ["大哥", "二哥", "三哥", "四哥"];
let [a, b, c, d] = F4;
// 这就相当于我们声明 4 个变量 a,b,c,d，其值分别对应"大哥","二哥","三哥","四哥 " 
console.log(a + b + c + d); // 大哥二哥三哥四哥
// 2、对象的解构赋值
const F3 = {
	name: "大哥",
	age: 22,
	sex: "男",
	xiaopin: function() { // 常用
		console.log("我会演小品！");
	}
}
let {
	name,
	age,
	sex,
	xiaopin
} = F3; // 注意解构对象这里用的是{} 
console.log(name + age + sex + xiaopin); // 大哥 22 男
xiaopin(); // 此方法可以正常调用

4.模板字符串

模板字符串（template string）是增强版的字符串，用反引号（`）标识

字符串中可以出现换行符；可以使用 ${xxx} 形式引用变量；

5.简化对象和函数写法

ES6 允许在大括号里面，直接写入变量和函数，作为对象的属性和方法。这样的书写更加简洁；

代码示例:

// ES6 允许在对象的大括号内直接写入变量和函数作为对象的属性和方法
// 变量和函数
let name = "訾博";
let change = function() {
	console.log("活着就是为了改变世界！");
}
//创建对象
const school = {
	// 完整写法
	// name:name,
	// change:change
	// 简化写法
	name,
	change,
	// 声明方法的简化
	say() {
		console.log("言行一致！");
	}
}
school.change();
school.say();

6.箭头函数

ES6 允许使用箭头（=>）定义函数，箭头函数提供了一种更加简洁的函数书写方式，箭头函数多用于匿名函数的定义；

箭头函数的注意点：

1. 如果形参只有一个，则小括号可以省略；

2. 函数体如果只有一条语句，则花括号可以省略，函数的返回值为该条语句的执行结果；

3. 箭头函数 this 指向声明时所在作用域下 this 的值；

4. 箭头函数不能作为构造函数实例化；

5. 不能使用 arguments；

箭头函数的特点：

1. 箭头函数的 this 是静态的，始终指向函数声明时所在作用域下的 this 的值；

2. 不能作为构造实例化对象；

3. 不能使用 arguments 变量；

7. ES6 中函数参数的默认值

ES 允许给函数的参数赋初始值；

代码示例：

//1. 形参初始值 具有默认值的参数, 一般位置要靠后(潜规则)
function add(a, b, c = 10) {
	return a + b + c;
}
let result = add(1, 2);
console.log(result); // 13
//2. 与解构赋值结合
// 注意这里参数是一个对象
function connect({
	host = "127.0.0.1",
	username,
	password,
	port
}) {
	console.log(host)
	console.log(username)
	console.log(password)
	console.log(port)
}
connect({
	host: 'baidu.com',
	username: 'root',
	password: 'root',
	port: 3306
})

8.rest 参数

9.扩展运算符

10.Symbol

11.Promise

12.Set 集合

13.Map 集合键值对集合；

14.class 类

15.数值扩展

16.对象扩展

17.模块化

18.Babel 对 ES6 模块化代码转换

19.ES6 模块化引入 NPM 包

代码007普通

打赏 收藏 海报 链接