ES6基础

var、let、const的区别

• var/let/const的区别？

  1.函数提升优先于变量提升，函数提升会把整个函数挪到作用域顶部，变量提升只会把声明挪到作用域顶部。
  2.var存在提升，我们能在声明之前使用。let、const因为存在暂时性死区的原因，不能再声明前使用
  3.var在全局作用域下声明变量会导致变量挂载在window上，其他两者不会
  4.let和const作用基本一致，但是后者声明的变量声明时必须赋值并且不能再次赋值

原型继承和class继承

原型如何实现继承？class如何实现继承？class本质是什么？
对于class，其实在js中并不存在类，class只是语法糖，本质还是函数。
继承的方式有：

• 组合继承
  组合继承是最常用的继承方式，但也存在着缺点，组合继承会继承父类上的所有属性，造成内存上的浪费。
• 寄生组合继承
  寄生组合继承是对组合继承的优化
• Class继承
  以上两种继承方式都可以通过原型区解决，在ES6中可以使用class去实现继承，并且很简单。

// 组合继承

    function Parent(value) {
        this.val = value
    }
    Parent.prototype.getValue = function() {
        console.log(this.val);
        
    }
    
    function Child(value) {
        Parent.call(this,value)
    }
    
    Child.prototype = new Parent()
    
    const child = new Child(1)
    
    child.getValue()
    console.log(child instanceof Parent);
    
    // 寄生组合继承，子类的构造函数指向子类自身，解决了继承父类自身属性的问题（只继承父类的原型上的属性和方法）。
    function Parent(value) {
        this.val = value
        function test(value) {
            console.log('123');
            
        }
    }
    Parent.prototype.getValue = function() {
        console.log(this.val);
        
    }
    function Child(value) {
        Parent.call(this,value)
    }
    
    Child.prototype = Object.create(Parent.prototype,{
        constructor: {
            value: Child,
            enumerable: true,
            writable: true,
            configurable: true
        }
        
    })
    
    const child = new Child(1)
    child.getValue()
    child.test()
    child instanceof Parent
    
    // Class继承
    class Parent {
        constructor(value){
            this.val = value
        }
        getValue() {
            console.log(this.val);
            
        }
    }
    
    class Child extends Parent {
        constructor(value) {
            super(value)
        }
    }
    const child = new Child(1)
    child.getValue()
    child instanceof Parent
    ```

模块化

为什么要使用模块化，都有哪几种方式可以实现模块化，各有什么特点？
使用
使用模块化有以下好处：

• 解决命名冲突
• 提供复用性
• 提高代码可维护性
  实现模块化的方式：
  1.立即执行函数。可以解决命名冲突、污染全局作用域的问题，这是以前的模块化管理方式
  2.AMD和CMD，目前已经很少使用
  3.CommonJS，这在如今还是广泛使用的模块化管理方式，应重点学习：
  CommonJS与ESModule的区别：
  • CommonJS支持动态导入，也就是require(${path}/xx.js)，后者目前不支持，但是已有提案。
  • CommonJS是同步导入，ES Module是异步导入
  • CommonJS是值拷贝，就算导出值变了，导入值也不会变，如果想重新更新值，就必须重新导入一次。但是ES Module是动态绑定方式，导入导出值都绑定同一个内存地址，所以导入值会跟随导出值变化
  • ES Module会编译成require/exports

Proxy

Proxy可以实现什么功能？
用来自定义对象中的操作，比如可自定义set和get函数。vue3.0预计使用它来实现数据响应式。

map、filter、reduce

// map/filter/reduce，其中map/filter很好理解，map和filter接受三个参数，分别为当前索引元素、
// 元素索引、原数组，其中map会变量原数组并对数组中每一个元素做一些变化，组成一个新数组，而filter是遍历原数组中
// 每一个元素并将返回值为true的元素提取出来组成一个新数组

// 对reduce而言，
let arr = [1,2,3]
let sum = arr.reduce((acc,current)=>
acc + current
,0)
console.log(sum);

// 用reduce实现map
let mapArr = arr.map(item => item2)
console.log(mapArr);
let reduceArr = arr.reduce((acc,current)=>{
acc.push(current3)
return acc
},[])
console.log(reduceArr);