# ES6

# Es6中箭头函数与普通函数的区别？

• 普通function的声明在变量提升中是最高的，箭头函数没有函数提升
• 箭头函数没有属于自己的this，arguments
• 箭头函数不能作为构造函数，不能被new，没有property
• call和apply方法只有参数，没有作用域

# map

map 作用是生成一个新数组，遍历原数组，将每个元素拿出来做一些变换然后返回一个新数组，原数组不发生改变。

map 的回调函数接受三个参数，分别是当前索引元素，索引，原数组

var arr = [1,2,3];
var arr2 = arr.map(item => item + 1)    
arr   //[ 1, 2, 3 ]
arr2  // [ 2, 3, 4 ]
['1','2','3'].map(parseInt)
// -> [ 1, NaN, NaN ]
第一个 parseInt('1', 0) -> 1
第二个 parseInt('2', 1) -> NaN
第三个 parseInt('3', 2) -> NaN

# filter

filter 的作用也是生成一个新数组，在遍历数组的时候将返回值为 true 的元素放入新数组，我们可以利用这个函数删除一些不需要的元素

filter 的回调函数接受三个参数，分别是当前索引元素，索引，原数组

# reduce

reduce 可以将数组中的元素通过回调函数最终转换为一个值。 如果我们想实现一个功能将函数里的元素全部相加得到一个值，可能会这样写代码

const arr = [1, 2, 3]
let total = 0
for (let i = 0; i < arr.length; i++) {
  total += arr[i]
}
console.log(total) //6 
但是如果我们使用 reduce 的话就可以将遍历部分的代码优化为一行代码
const arr = [1, 2, 3]
const sum = arr.reduce((acc, current) => acc + current, 0)
console.log(sum)

对于 reduce 来说，它接受两个参数，分别是回调函数和初始值，接下来我们来分解上述代码中 reduce 的过程

首先初始值为 0，该值会在执行第一次回调函数时作为第一个参数传入

回调函数接受四个参数，分别为累计值、当前元素、当前索引、原数组，后三者想必大家都可以明白作用，这里着重分析第一个参数

在一次执行回调函数时，当前值和初始值相加得出结果 1，该结果会在第二次执行回调函数时当做第一个参数传入

所以在第二次执行回调函数时，相加的值就分别是 1 和 2，以此类推，循环结束后得到结果 6。

# Proxy

Proxy 是 ES6 中新增的功能，它可以用来自定义对象中的操作。 Vue3.0 中将会通过 Proxy 来替换原本的

Object.defineProperty 来实现数据响应式。

let p = new Proxy(target, handler)

target 代表需要添加代理的对象，handler 用来自定义对象中的操作，比如可以用来自定义 set 或者 get 函数。

# 箭头函数为什么不能做构造函数

构造函数中的 this 指向新创建的对象，当执行 new Car() 的时候，构造函数 Car 的上下文就是新创建的对象，也就是说 this instanceof Car === true。显然，箭头函数是不能用来做构造函数， 实际上 JS 会禁止你这么做，如果你这么做了，它就会抛出异常。

换句话说，箭头构造函数的执行并没有任何意义，并且是有歧义的。

• 一.外形不同： 箭头函数使用箭头定义，普通函数中没有。

• 二.箭头函数全都是匿名函数：

普通函数可以有匿名函数，也可以有具名函数。

而箭头函数全都是匿名函数，

• 三.箭头函数不能用于构造函数：

普通函数可以用于构造函数，以此创建对象实例。

但是箭头函数并不能用作构造函数。

• 四.箭头函数中this的指向不同：在定义函数绑定而不是执行时

• 五.箭头函数不具有arguments对象：

每一个普通函数调用后都具有一个arguments对象，用来存储实际传递的参数。

但是箭头函数并没有此对象。

• 六.其他区别： 箭头函数不能Generator函数

箭头函数不具有prototype原型对象

箭头函数不具有super

箭头函数不具有new.target

# let和Const的区别

• let与const都是只在声明所在的块级作用域内有效。
• let声明的变量可以改变，值和类型都可以改变，没有限制。
• const声明的变量不得改变值，这意味着，const一旦声明变量，就必须立即初始化，不能留到以后赋值 ## var
• var声明的变量会挂载在window上，而let和const声明的变量不会
• var声明变量存在变量提升，let和const不存在变量提升
• 同一作用域下let和const不能声明同名变量，而var可以

# es6中函数里的this问题

• 1.箭头函数：出现的作用除了让函数的书写变得很简洁，可读性很好外；最大的优点是解决了this执行环境所造成的一些问题。比如：解决了匿名函数this指向的问题（匿名函数的执行环境具有全局性），包括setTimeout和setInterval中使用this所造成的问题。
• 2.我们常见的window属性和方法有alter，document，parseInt，setTimeout，setInterval，localtion等等，这些在默认的情况下是省略了window前缀的。（window.alter = alter）。
• 3.在“use strict”严格模式下，没有直接的挂载者（或称调用者）的函数中this是指向window，这是约定俗成的。在“use strict”严格模式下，没有直接的挂载者的话，this默认为undefined。以下都是在非严格模式下讨论。

二，普通函数中的this是：this是JavaScript的一个关键字，他是指函数执行过程中，自动生成的一个内部对象，是指当前的对象，只在当前函数内部使用。

（this对象是在运行时基于函数的执行环境绑定的：在全局函数中，this指向的是window；当函数被作为某个对象的方法调用时，this就等于那个对象）。

三，es6箭头函数的this

箭头函数的this定义：箭头函数的this是在定义函数时绑定的，不是在执行过程中绑定的。简单的说，函数在定义时，this就继承了定义函数的对象。

所以，这会很好的解决匿名函数和setTimeout和setInterval的this指向问题。

# es6 class怎么用es5实现

1. 最简单的对象字面量和Object构造函数两种方式

只能创建一个对象，无法进行批量创建，不利于封装 2. 工厂模式

无法辨别对象。在每一个对象的proto属性中，construction属性都是Object。

3.构造函数模式和原型模式

4. es6 class创建对象

es5和es6 class定义对象的区别

class的构造函数必须使用new进行调用，普通构造函数不用new也可执行。

class不存在变量提升，es5中的function存在变量提升。

class内部定义的方法不可枚举，es5在prototype上定义的方法可以枚举