【八股】ES6新特性

114 阅读4分钟

一、let const命令

  1. 变量提升
  2. 全局变量
  3. 暂时性死区
  4. 块级作用域
  5. 可否重复声明
  6. 不允许修改(const)

二、变量的解构赋值

常用的是数组和对象的解构赋值

使用场景:

  1. 交换变量的值:
let x = 1;
let y = 2;
[x, y] = [y, x];
  1. 函数返回多个值
// 返回一个数组

function example() {
  return [1, 2, 3];
}
let [a, b, c] = example();

// 返回一个对象

function example() {
  return {
    foo: 1,
    bar: 2
  };
}
let { foo, bar } = example();
  1. 函数参数中使用

常用的vuex的actions里 ,用{commit}解构context对象的方法

三、Promise对象

四、Class

传统方法生成实例对象:通过构造函数 添加方法时要在函数的原型上写。

ES6中Class修改为类似于Java的写法,在class中写constructor及其他方法

五、箭头函数

1、this是静态的,指向定义箭头函数所在的作用域的this,不能通过apply等方法修改this指向。

2、不可以做构造函数,即不能用new箭头函数

3、不存在arguments类数组对象

箭头函数适用于与this无关时使用,如定时器、数组的回调

六、迭代器/for of 循环/生成器

迭代器和for of循环 blog.csdn.net/weixin_4497…

迭代器(Iterator):

一个接口,实现了该接口的数据结构可以完成遍历操作,成为可迭代的数据结构。

Array String Set Map 等实现了迭代器接口,Object没有。

迭代器的工作原理:

迭代器接口返回一个迭代器指针对象,该对象实现了next方法

每次调用iterator.next(),指针从数据结构的第一个元素起,逐次指向下一个元素至最后一个元素。

next方法每次返回一个{value:value,done:false}的对象。遍历完后返回的对象的done属性为true。

for of 和 for in 和forEach

for in

  1. 遍历的是key(对数组而言是index)
  2. 遍历包括原型对象上的属性和方法 (可以通过加Object.prototype.hasOwnProperty()判别) 3.适用于遍历对象 不适用于遍历数组(遍历数组的key即为index index作为String类型 不方便进行计算)

for of:

  1. 遍历的是value
  2. 不遍历原型上的属性和方法
  3. 适用于遍历数组等实现了迭代器接口的数据结构 不适用于遍历Object(搭配Object.keys()使用)
  4. for of不能遍历对象(Object原生没有iterator接口) 需要搭配Object.keys()

for in 和for of都可以用continue和break跳出循环

forEach 数组的迭代方法 不能用continue和break跳出循环 可以搭配throw Error

生成器(generator):

ES6提出的解决异步编程的方法。声明时带*号

生成器函数返回的结果是迭代器对象,调用迭代器对象的 next 方法可以得到 yield 语句后的值。

yield相当于函数的暂停标记,也可以认为是函数的分隔符,每调用一次 next 方法,执行一段代码。

next方法可以传递实参,作为 yield 语句的返回值。

下图是每一次调用next执行的代码部分

image.png

Module模块化

和Node的commonjs模块化区别

1.ES6中通过export和import关键字来导出和导入 ,commonJS模块化通过给module.exports对象加属性导出 通过require导入

2.CommonJS 模块是运行时加载,ES6 模块是编译时输出接口。

CommonJS是同步加载的,运行时加载,运行require语句导入脚本后加载的一个对象,因此只适用于服务端(要等脚本执行完毕)。

ES6模块的对外接口是一种静态的定义,在编译时就已经生成,文件遇到import语句时,获取只读引用,等脚本执行时,再去导出的模块中取值。

3.commonJS模块输出的是值拷贝,es6模块输出的是值的引用

commonjs导出的是值拷贝,会对加载结果进行缓存,模块内部再修改这个值,则不会同步到外部文件。ES6模块导出的是只读引用,因此模块内部修改值也会同步到外部文件。

面试怎么回答:

语法上 ES6通过 import和export commonjs module.exports属性加值来导出 require来导入

commonjs是运行时加载 require语句生成一个对象并缓存 输出的是值的拷贝 也就是说 模块内部修改值 不会影响到外部文件的引用

es6的模块化是编译时就有了接口的暴露 输出的是只读的引用 import语句获取只读引用 然后在脚本真正执行时再去模块内部读值 所以模块内部值修改会影响外部文件的引用

由于commonjs是同步加载 所以一般只用于服务端 而es6可以用于客户端和服务端

六、Symbol基本使用和内置符号

Symbol是基本数据类型 表示一个独一无二的值

使用场景

1、给对象添加属性 用symbol值作为键名

2、内置Symbol值 比如Symbol.iterator