【面试题一】

1. bind、call、apply区别？如何实现一个bind?
   作用：call apply bind就是用来改变this指向

   var name="clover"
   var obj={
       name:"zlx",
       say:function(){
           console.log(this.name)
       }
   }
   obj.say()//输出的是zlx   this指向obj对象
   setTimeout(obj.say,0)//输出clover   this指向window对象
   

   从以上代码可以很清楚的看出say()方法输出zlx
   但是当我们把say放在setTimeout方法中，在定时器中是作为回调函数来执行，
   所以回到主栈执行时是在全局执行上下文的环境中执行的，这时候this指向window,因此输出clover
   其实，我们实际上需求是this指向obj对象，这时候需要改变this指向，那么我们可以使用
    

   setTimeout(obj.say.bind(obj),0)//zlx   this指向obj对象
   

   具体使用：
   apply接收的是两个参数，第一个参数是this的指向，第二个参数是函数接受的参数，以数组的形式传入
   改变this指向后原函数会立即执行，且此方法只是临时改变this指向一次
    

   function fn(...arg){
       console.log(this.args)
   }
   let obj={
       myname:"zlx"
   }
   fn.apply(obj,[1,2])//this会变成传入的obj，传入的参数必须是一个数组
   fn(1,2)//this指向window

   但是当第一个参数是null或者undefined的时候，在浏览器中默认指向window
    

   fn.apply(null,[1,2])//this指向window
   fn.apply(undefined,[1,2])//this指向window
   

   call
   call方法的第一个参数也是this指向，后面传入的是一个参数列表
   跟apply一样，改变this指向后原函数会立即执行，且此方法只是临时改变this指向一次
    

   function fn(...args){
       console.log(this.args)
   }
   let obj={
       myname:"zlx"
   }
   fn.call(obj,1,2)//this会变成传入的obj，传入参数必须是一个数组
   fn(1,2)//this指向window
   

   相同的，当他的第一个参数是null或者undefined的时候，浏览器默认指向window
    

   fn.call(null,[1,2])//this指向window
   fn.call(undefined,[1,2])//this指向window
   

   bind
   bind和call很相似，第一个参数也是this指向，后面传入的也是一个参数列表（但是这个参数列表可以分多次传入）
   改变this指向后不会立即执行，而是返回一个永久改变this指向的函数
    

   function fn(...args){
       console.log(this.args)
   }
   let obj={
       myname:'zlx'
   }
   fn.bind(obj)//this也会变成传入的obj,bind不是立即执行需要执行一次
   fn(1,2)//this指向window

   小结【区别】：
   三者都可以改变函数的this对象指向

   三者的第一个参数都是this将要指向的对象，如果参数是undefined/null或者·没有这个参数，则默认指向是全局window

   三者都可以传参，但是apply是数组，而call是参数列表，且apply和call是一次性传入参数，而bind可以分为多次传入

   bind是返回绑定this之后的函数，apply和call是立即执行

   bind的实现
   步骤：
           修改this指向
           动态传递参数
           兼容new关键字

   //方式一：只在bind中传递函数参数
   fn.bind(obj,1,2)()
   //方式二：在bind中传递函数参数，也在返回函数中传递参数
   fn.bind(obj,1)(2)

   具体代码如下

   
   Function.prototype.myBind = function (context) {
       // 判断调用对象是否为函数
       if (typeof this !== "function") {
           throw new TypeError("Error");
       }
    
       // 获取参数
       const args = [...arguments].slice(1),
             fn = this;
    
       return function Fn() {
    
           // 根据调用方式，传入不同绑定值
           return fn.apply(this instanceof Fn ? new fn(...arguments) : context, args.concat(...arguments)); 
       }
   }

2. 什么是防抖和节流？有什么区别？如何实现？
3. VUE路由的原理？
    
5. 说说你对keep-alive的理解？
    
6. 什么是响应式设计？响应式设计的基本原理是什么？如何做？
    
7. 说说 React 生命周期有哪些不同阶段？每个阶段对应的方法是？
    
8. 如何解决跨域问题？
    
9. ​​​​​​​​​​​​​​
10. 说说react router有几种模式？实现原理？
    ​​​​​​​
11. 说说对React Hooks的理解？解决了什么问题？
     
12. 说说你对promise的了解？
     
13. 说说webpack中常见的Loader？解决了什么问题？
14. 说说 React中的setState执行机制？
     
15. Vue组件之间的通信方式都有哪些？