前端笔试模拟练习题

1.在实际项目中使用$nextTick好，还是用setTimeout好？
首先来讲一下他们的区别：
nextTick:在下次 DOM 更新循环结束之后执行延迟回调。在修改数据之后立即使用这个方法，获取更新后的 DOM。简单点说就是DOM更新后会执行的一个回调方法
setTimeout：只是延迟执行，在延迟执行的方法里，DOM有可能会更新也有可能没有更新。
常规做法就是延迟500ms或者1s
2.前端如何判断chrome版本并引入不同js?
function include(filename)

{

    var head = document.getElementsByTagName('head')[0];

    var script = document.createElement('script');

    script.src = filename;

    script.type = 'text/javascript';

    head.appendChild(script)

}

function getChromeVersion () {     

    var raw = navigator.userAgent.match(/Chrom(e|ium)\/([0-9]+)\./);

    return raw ? parseInt(raw[2], 10) : false;

}

var chromeVersionNo = getChromeVersion();

if(chromeVersionNo < 79){

include('你的1.js');

}else{

include('你的2.js');

}
3.vue.js 怎么解决跨域？
方法一：proxy
 
vue.config.js

module.exports = {

 devServer: {

  proxy: {

    "/prefix": {

      target: "targetDomain",

      changeOrigin: true,

      pathRewrite: {"^/prefix": ""}

    }

  }

}

}
方式二：nginx
nginx.conf
location /prefix {
  proxy_pass targetDomain
}
方式三：jsonP
详见：JSONP跨域详解
方式四：hosts代理
通过改变hosts进行信任调用，设置与后台同domain即可
 

3.如何动态将option选框中的值传入前一个input节点

function handleChange(e){
    e.target.previousElementSibling.value = e.target.value
}

4.如何将监听事件改为promise的形式

Promise就像一个状态机，而且是一个状态不可逆的状态机，这就意味它只会在到达Fullfiled或者Rejected状态时会执行你注册的函数

例子：function receiver(type) {
  const listeners = [];

  const listen = {
    then(callback) {
      listeners.push(callback);

      return listen;
    }
  };
  document.addEventListener(type, async (ev) => {
    let acc = ev;
    for (let i = 0; i < listeners.length; ++i) {
      acc = await listeners[i](acc);
    }
  });

  return listen;
}

receiver("click")
  .then((e) => {
    console.log(e);

    return 1;
  })
  .then((v) => {
    console.log(v);
  });