ES6入门

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

这个也很重要。

暂无评论

发送评论 编辑评论


				
|´・ω・)ノ
ヾ(≧∇≦*)ゝ
(☆ω☆)
(╯‵□′)╯︵┴─┴
 ̄﹃ ̄
(/ω\)
∠( ᐛ 」∠)_
(๑•̀ㅁ•́ฅ)
→_→
୧(๑•̀⌄•́๑)૭
٩(ˊᗜˋ*)و
(ノ°ο°)ノ
(´இ皿இ`)
⌇●﹏●⌇
(ฅ´ω`ฅ)
(╯°A°)╯︵○○○
φ( ̄∇ ̄o)
ヾ(´・ ・`。)ノ"
( ง ᵒ̌皿ᵒ̌)ง⁼³₌₃
(ó﹏ò。)
Σ(っ °Д °;)っ
( ,,´・ω・)ノ"(´っω・`。)
╮(╯▽╰)╭
o(*////▽////*)q
>﹏<
( ๑´•ω•) "(ㆆᴗㆆ)
😂
😀
😅
😊
🙂
🙃
😌
😍
😘
😜
😝
😏
😒
🙄
😳
😡
😔
😫
😱
😭
💩
👻
🙌
🖕
👍
👫
👬
👭
🌚
🌝
🙈
💊
😶
🙏
🍦
🍉
😣
Source: github.com/k4yt3x/flowerhd
颜文字
Emoji
小恐龙
花!
上一篇
下一篇