ES6入门
学JavaScript,最重要的就是ES6。ECMAScript-262是专门制定JavaScript语言的标准。那么ECMAScript 2015简称ES2015就是ES6了,当然之后都用年份来标记,比如ES2016\ES2017,这样子分别对应ES7、ES8。但是后面的基本上都用年份来说,然后把这些统一叫做ES6,相当于广泛意义上的ES6+吧。所以现在的ES6泛指的是ES2015后面标准。
本片就不是介绍这些ES6的用法,只是说一下ES6到底多了些啥。
1、let和const
这个很简单,let就是在所在代码块内生效,是变量,只能声明一次,不存在变量提升。
const是只读的常量。只能保证地址不变,里面的值是对象数组这些还是能够改变的。
2、解构赋值
这个在JS入门学习里面讲过了。
3、Symbol
是原始数据类型,看起来像私有属性的,不能被遍历到。但可以使用Object.getOwnPropertySymbols() 和 Reflect.ownKeys() 取到。
4、Map和Set
Map和Object的区别
- Object的键只能说字符串或者Symbols,但Map可以是任意值
- Map的键值是有序的(先进先出原则),而添加对象中的键不是
- Map的键值对个数可以从size属性获取,但Object键值对个数只能手动计算
- Object有自己的原型,原型链上的键名有可能和你自己在对象上的设置的键名产生冲突。
Map与Array的转换
var kvArray = [["key1", "value1"], ["key2", "value2"]];
// Map 构造函数可以将一个 二维 键值对数组转换成一个 Map 对象
var myMap = new Map(kvArray);
// 使用 Array.from 函数可以将一个 Map 对象转换成一个二维键值对数组
var outArray = Array.from(myMap);
Set与Array转换
// Array 转 Set
var mySet = new Set(["value1", "value2", "value3"]);
// 用...操作符,将 Set 转 Array
var myArray = [...mySet];
String
// String 转 Set
var mySet = new Set('hello'); // Set(4) {"h", "e", "l", "o"}
// 注:Set 中 toString 方法是不能将 Set 转换成 String
5、Proxy和Reflect
Proxy和Reflect有点难度的,一般写库的时候会用到吧,业务中应该不怎么会用到的。前端框架里面应该也是会用到的。
6、字符串方法新增
includes()、startsWith()、endsWith()、repeat()、padStart()、padEnd()
反引号模版字符串,变量名写在 ${} ,可以写入js表达式
7、数值
二进制新写法0b或者0B,八进制0o或者0O
Number.EPSILON,值约为 2^-52,用来判断浮点数之间是否相等
最大安全整数Number.MAX_SAFE_INTEGER =2^53-1,最小安全整数Number.MIN_SAFE_INTEGER=-2^53
Number.isFinite()检查一个数字是否是有限的
从全局移植到Number对象的方法,比如Number.parseInt()
Math方法也多了好多,这里就不举例了。
8、对象
允许对象的属性直接写变量,属性名就是变量名,属性值是变量值
属性的方法名也可以简写,如果是generator函数,则需要在前面加一个*
允许表达式作为属性名,但要放在方括号内
还有扩展运算法...,用于取出参数对象所有可遍历属性然后拷贝到当前对象。
Object.assign(target,source_1,...)用于将源对象的所有可枚举属性复制到目标对象中。也是浅拷贝
还有Object.is(),相当于===,但是对+0和-0,NaN做了不一样的解释
9、数组
-
Array.of()将参数中所有值作为元素形成数组。(脱裤子放屁了属于是) -
Array.from(arrayLike[, mapFn[, thisArg]])将类数组对象或可迭代对象转化为数组。(常用)
一个类数组对象必须含有 length 属性,且元素属性名必须是数值或者可转换为数值的字符。
find()、findIndex()、fill()、copyWith()、entries()键值对、keys()、values()、include()、flat()
还有类数组
10、函数
- 默认参数
- 不定参数
- 箭头函数
11、Class类
本质还是function,并且是语法糖。类中方法不需要 function 关键字。方法间不能加分号。
有静态方法、但目前内部还不能实现静态属性(不确定),getter不可以单独出现,两者必须同级出现
通过extends实现类继承,子类constructor方法中必须要super(),且必须在this之前
调用父类方法, super 作为对象,在普通方法中,指向父类的原型对象,在静态方法中,指向父类
12、ES6模块
分为导出export和导入import两个模块
每个模块都有自己的上下文,每一个模块内声明的变量都是局部变量,不会污染全局作用域。
每一个模块只加载一次(是单例的), 若再去加载同目录下同文件,直接从内存中读取。
export default 仅有一个。
13、Promise对象
这个应该算重中之重了,但不在这里展开了
14、Generator函数
这个还是从来没看过和用过的东西。
ES6 新引入了 Generator 函数,可以通过 yield 关键字,把函数的执行流挂起,为改变执行流程提供了可能,从而为异步编程提供解决方案。
Generator 有两个区分于普通函数的部分:
- 一是在 function 后面,函数名之前有个 * ;
- 函数内部有 yield 表达式。
function* func(){
console.log("one");
yield '1';
console.log("two");
yield '2';
console.log("three");
return '3';
}
f.next();
// one
// {value: "1", done: false}
f.next();
// two
// {value: "2", done: false
f.next();
// three
// {value: "3", done: true}
f.next();
// {value: undefined, done: true}
好怪,不看了,之后有用到再说吧
15、async和await
这个也很重要。





