新媒传信前端面试

• 时间：2018.8.9 上午10:00-11:40

• 地点：北京朝阳区

• 面试题总结

1.浏览器原理？

主要分成两部分：渲染引擎(layout engineer或Rendering Engine)和JS引擎。
渲染引擎：负责取得网页的内容（HTML、XML、图像等等）、整理讯息（例如加入CSS等），以及计算网页的显示方式，然后会输出至显示器或打印机。浏览器的内核的不同对于网页的语法解释会有不同，所以渲染的效果也不相同。所有网页浏览器、电子邮件客户端以及其它需要编辑、显示网络内容的应用程序都需要内核。

JS引擎则：解析和执行javascript来实现网页的动态效果。

最开始渲染引擎和JS引擎并没有区分的很明确，后来JS引擎越来越独立，内核就倾向于只指渲染引擎。

2.js是单线程还是多线程？同步异步？浏览器同源策略?V8?

单线程,但是浏览器是多线程的，单线程的异步执行看下一题。

同步是指令发送一个请求，只有当请求完成之后才能发送下一个请求，需要等待时间。
而异步是指，指令发送一个请求，然后浏览器将这个请求放入到消息队列，你就可以关闭浏览器，或者发送下一个请求了。没有等待时间，用户体验性比较好。
但是并不是请求都是要用异步，在需要保存数据库操作过程的系统中需要用到同步，比如银行转账系统。

3.event loop(事件循环）
https://mdn.mozillademos.org/files/4617/default.svg

左边的栈存储的是同步任务，所谓同步的任务就是那些能立即执行、不耗时的任务，如变量和函数的初始化、事件的绑定等等那些不需要回调函数的操作都可归为这一类。右边的堆用来存储声明的变量、对象。下面的队列就是任务队列，一旦某个异步任务有了响应就会被推入队列中。如用户的点击事件、浏览器收到服务的响应和后面提到的setTimeout插入的事件。每个异步任务都和一个回调函数相关联。

一个js程序的单线程用来执行栈中的同步任务，当所有同步任务执行完毕后，栈被清空，然后读取任务队列中的一个待处理任务，并把相关回调函数压入栈中，单线程开始执行新的同步任务，执行完毕。

单线程从任务队列中读取任务是不断循环的，每次栈被清空后，都会在任务队列中读取新的任务，如果没有新的任务，就会等待，直到有新的任务，这就叫任务循环。因为每个任务都由一个事件所触发，所以也叫事件循环。

JavaScript单线程和其异步机制就如上所述。所谓的单线程并不孤单，它的背后有浏览器的其他线程为其服务，其异步也得靠其他线程来监听事件的响应，并将回调函数推入到任务队列等待执行。单线程所做的就是执行栈中的同步任务，执行完毕后，再从任务队列中取出一个事件（没有事件的话，就等待事件），然后开始执行栈中相关的同步任务，不断的这样循环。

除了放置异步任务的事件，"任务队列"还可以放置定时事件，即指定某些代码在多少时间之后执行。这叫做"定时器"（timer）功能，也就是定时执行的代码。
定时器功能主要由setTimeout()和setInterval()这两个函数来完成，它们的内部运行机制完全一样，区别在于前者指定的代码是一次性执行，后者则为反复执行。

参考：https://www.cnblogs.com/sxz2008/p/6513619.html

4.静态资源服务器？

5.axios是什么？与Ajax有什么区别吗？

6.Ajax原理？调接口怎么调？callback怎么回调的？

xhr=new XMLHttpRequest();
  xhr.onreadystatechange = callback;
  xhr.open("Get",url,true); 
  xhr.send(null); 

//上面代码中的req.send方法是Ajax操作向服务器发送数据，它是一个异步任务，
//意味着只有当前脚本的所有代码执行完，系统才会去读取"任务队列"。
  
  function callback() {
    //状态标识为已完成
  if (xhr.readyState == 4) {
    //已就绪
    if (xhr.status <= 200 && xhr.status<300 || xhr.status == 304) {
      console.log(xhr.responseText);
    } else {
      alert("There was a problem retrieving the XML data:" + xhr.statusText);
    }
  }
}

7.有一千个li，每一个都需要绑定事件，现在需要优化，你怎么做？事件委托有什么好处？

事件委托，事件冒泡

8.什么时候用到跨域？有哪些跨域方法？原理是什么？

jsonp的实现原理，跨域的其他方法
jsonp就是解决JSON跨域获取的解决方案，原理：
1、浏览器的同源策略把跨域请求都禁止了；
2、HTML的