es6基础篇

来源:互联网 发布:矩阵的乘法计算方法 编辑:程序博客网 时间:2024/06/09 16:35

node.js对ES6的支持度较高,在这个环境下可以更好的体验
Babel转码器
参考最喜欢的作者阮一峰写的ES6入门
参考淘宝前端团队
let和const命令
1. let命令只在所在的代码块内有效
2. 不存在变量提升,使用一定要在声明之后
3. 暂时性死区 如果区块内存在const或者let这个区块对命令声明的变量形成封闭作用域,不受作用域之外的变量影响
var temp = “123”;
if(true){temp=”abc”; let temp;}//报错
虽然在代码块中声明了全局变量temp,但是在判断区块内无效,let声明的temp变量在声明前调用,所以报错
4. 在相同的作用域内不能重复声明同一个变量
5. 块级作用域外部无法访问内部函数和变量(引入闭包)
const 的定义是不可重新赋值的值,与不可变的值(immutable value)不同;const 定义的 Object,在定义之后仍可以修改其属性。
所以其实他的使用场景很广,包括常量、配置项以及引用的组件、定义的 “大部分” 中间变量等,都应该以const做定义。反之就 let 而言,他的使用场景应该是相对较少的,我们只会在 loop(for,while 循环)及少量必须重定义的变量上用到他。
猜想:就执行效率而言,const 由于不可以重新赋值的特性,所以可以做更多语法静态分析方面的优化,从而有更高的执行效率。
所以上面代码中,所有使用 let 的部分,其实都应该是用 const 的。

变量的解构赋值
数组的解构赋值:
1. 模式匹配。如果结构不成功,变量值为undefined
2. 不完全解构只匹配等号右边一部分,如果右边不是数组就会报错
实际上,只要某种数据结构具有iterator接口,都可以采用数组形式的解构赋值。

对象的结构赋值:区别(数组的变量取值是由位置决定的,对象的属性没有次序,变量必须与属性同名才行,如果变量名与属性名不一致,则
var{foo:baz}={foo:”aaa”};baz//aaa

解构赋值允许使用默认值,但数组成员不严格等于undefined的话则默认值不生效
字符串解构和数值布尔型解构赋值,会首先转换成对象
解构赋值中应该尽量避免圆括号,否则可能导致解构歧义,赋值语句的非模式部分可以使用圆括号
主要用途:

  • 变换变量的值
  • 从函数返回多个值
  • 函数参数的定义
  • 提起json数据
  • 函数参数的默认值
  • 遍历map解构
  • 输入模块的指定方法

symbol
是ES6引入的新的数据类型,表示独一无二的值
symbol有symbol函数生成 let s = new symbol();
可以接受一个参数,表示对symbol实例的描述
symbol不能与其他类型进行运算,但是可以转换成布尔值

作为属性名的symbol:1不能使用点运算符,必须放在方括号中,否则会被解析成一个字符串
2作为属性上symbol是公有属性

魔术字符串(没弄懂)

Object.getOwnPropertySymbol方法可以获取指定对象的所有symbol属性名
新的api reflect.ownkeys方法可以返回所有类型的键名

symbol.for() 接受一个字符串作为参数,搜索有没有以该参数作为名称的symbol值,有则返回,没有就新建一个以该字符串为名称的symbol值

Symbol.for()与Symbol()这两种写法,都会生成新的 Symbol。它们的区别是,前者会被登记在全局环境中供搜索,后者不会。Symbol.for()不会每次调用就返回一个新的 Symbol 类型的值,而是会先检查给定的key是否已经存在,如果不存在才会新建一个值。

Symbol.keyFor方法返回一个已登记的 Symbol 类型值的key。

Set和Map数据结构
1. Set
- 它类似于数组,但是成员的值都是唯一的,没有重复的值。内部查重的机制相它类似于精确相等运算符(===),主要的区别是NaN等于自身,而精确相等运算符认为NaN不等于自身。
- 属性:Set.prototype.constructor:构造函数,默认就是Set函数。 Set.prototype.size:返回Set实例的成员总数。
- 操作方法:add(value) delete(value) has(value) clear() Array.from方法可以将 Set 结构转为数组。
- 遍历操作:keys() values() entries() forEach() Set的遍历顺序就是插入顺序。
Set 结构的实例默认可遍历,它的默认遍历器生成函数就是它的values方法。
这意味着,可以省略values方法,直接用for…of循环遍历 Set。
扩展运算符(…)内部使用for…of循环,所以也可以用于 Set 结构。
数组的map和filter方法也可以间接用于 Set 了。
因此使用 Set 可以很容易地实现并集(Union)、交集(Intersect)和差集(Difference)。

WeakSet结构与 Set 类似,也是不重复的值的集合。
但是:WeakSet 的成员只能是对象,而不能是其他类型的值。WeakSet 中的对象都是弱引用,即垃圾回收机制不考虑 WeakSet 对该对象的引用,所以用它保存某些数据可以避免内存泄漏

  1. map

    • JavaScript 的对象(Object),本质上是键值对的集合(Hash 结构),但是传统上只能用字符串当作键。Map 数据结构类似于对象,也是键值对的集合,但是“键”的范围不限于字符串,各种类型的值(包括对象)都可以当作键。
    • 只有对同一个对象的引用,Map 结构才将其视为同一个键。这一点要非常小心。实际上是跟内存地址绑定的,只要内存地址不一样就视为两个键,如果map的键是简单类型的值如数字、字符串、布尔值,只要严格相等就视为一个键,NaN在这里可以相等
    • 属性:size
    • 方法:set(key,value) get(key) has(key) clear()
    • 遍历方法:keys() values() entries() forEach()
    • Map 结构转为数组结构,比较快速的方法是使用扩展运算符(…)。
    • 将数组传入 Map 构造函数,就可以转为 Map。
    • 结合数组的map方法、filter方法,可以实现 Map 的遍历和过滤(Map 本身没有map和filter方法)。
    • forEach方法还可以接受第二个参数,用来绑定this。

    WeakMap结构与Map结构类似,也是用于生成键值对的集合。
    WeakMap只接受对象作为键名(null除外),不接受其他类型的值作为键名。
    WeakMap的键名所指向的对象,不计入垃圾回收机制。

箭头函数

箭头函数没有独立执行上下文( this ),所以其内部引用 this 对象会直接访问父级。
箭头函数不但没有独立 this,他也没有独立的 arguments,所以如果需要取不定参的时候,要么使用 function,要么用 ES6 的另一个新特性 rest(具体在 rest 中会有详解)。
箭头函数语法很灵活,在只有一个参数或者只有一句表达式做方法体时,可以省略相应括号。

promise

promise对象代表一个异步操作,有三种状态:pending resolved/fullfilled rejected

promise.then接收两个方法作为参数,第一个resolved调用,第二个reject调用。

promise.then(function(value),funtion(error));

但是这种写法不太好,有点类似于同步中的try/catch
下面的写法比较好。

promise.then()//成功       .catch()//失败

promise对象的错误会一直向后传递,直到被捕获。
done()方法处于回调链的尾端,保证捕捉最后一个方法抛的错误。
还有一个附加的API finally() 用于指定无论promise对象状态如何都会执行的操作。
Node.js有一个unhandledRejection事件专门监听未捕获的rejected错误
1. 多个异步任务同时执行用 Promise.all,顺序执行使用链式调用
Promise.all()用于将多个promise实例包装成一个新的promise实例。

Promise  .all([jsBuildPromise, cssBuildPromise])//all内的实例均为reject时promise状态为reject,其中一个为resolved师promise的状态就是resolve  .then(() => {    ...  });jsBuildPromise  .then(() => cssBuildPromise)  .then(() => {    ...  });
  1. Promise 的链式调用需要每一个过程返回一个 Promise 对象才能保证顺序执行

  2. Promise 需要调用 catch 方法来捕获错误,而且过程内的错误不会阻塞后续代码执行
    new Promise(() => {
    f; // not define error !
    })
    .catch((err) => {
    console.log(err) // show ‘f is not define’
    });
    console.log(‘error test’); // 此行可以被正常执行

promise.race()与all()的作用一样,不同的是它的promise状态只要参数的任意一个改变就会随之改变
promise.resolve()将现有对象转换为promise对象
promise.reject()返回状态为rejected的新实例。

原创粉丝点击