千锋教育web前端高频面试题视频教程，kerwin大话前端面试秘籍（附答案）

1.JS的内置对象（封装过的对象函数）

● 其他对象: Function. Arguments、 Math、 Date、 RegExp、 Error

● 数据封装类对象: Object、 Array、Boolean、 Number. String

● ES6新增对象: Symbol (标识唯-性的ID) 、Map、 Set、 Promises. Proxy、 Reflect

2.如何最小化重绘(repaint)和回流(reflow)?

● 需要要对元素进行复杂的操作时，可以先隐藏(display':"none"), 操作完成后再显示

● 需要创建多个DOM节点时,使用DocumentFragment创建完后-次性的加入document

● 缓存Layout属性值,如: var left = elem.offsetLeft;这样，多次使用left产生- -次回流

● 尽量避免用table布局(table元素- -旦触发回流就会 导致table里所有的其它元素回流)

3. JS的作用链域

● 全局函数无法查看局部函数的内部细节，但局部函数可以查看其上层的函数细节，直至全局细节

● 如果当前作用域没有找到属性或方法，会向.上层作用域[[Scoped]]查找，直至全局函数,这种形式就是作用域

链

4、原生数据请求步骤

( 1 )、XHR

● 通过 new XMLHttpRequest( ) 定义一个 xhr 对象

● xhr.open( ' 数据请求方式、get，post等 ' ，' 数据请求地址 '，同步或异步Boolean值 ) 添加请求地址

● xhr.send ( ) ，发送请求。

● xhr.onreadystatechange = 函数，开启监听服务器状态

● XHR 的请求可以通过 xhr.abort ( ) 方法取消

( 2 )、fetch（w3c新推出）

● 通过 fetch（ ' url地址 ' ，{ method：' 数据请求方式、get，post ' ，body：' ' ，credencial：' 请求是否携带cookie '}）发送请求

● 通过 .then( res =>{ res.josn( ) }) 获取到 josn 字符串 promise 对象

● 再次 .then( res=>{ console.log( res ) }) 获取服务器响应数据

● 底层还是 XHR 在运行，兼容性不是很好，低级浏览器不适配

( 3 )、jsonp 解决跨域

● 动态创建script src指向没有跨域限制，onload

● 后端返回的数据格式一定是， test(' ["111" ,"222","3333"]');

● 前端提前定义好test这个方法，通过形参就拿到数据了。

● jsonp可以做get请求，无法做post请求 (缺点) ;

● jsonp请求不能取消

5.跨域和同源策略

所谓的同源策略其实是浏览器的一种机制，只允许在同源，也就是同协议、同域名、同端口的的情况下才能进行数据交互。但是我们在开发项目的过程中，往往一个项目的接口不止一个域，所以往往就需要做跨域的处理,通常的跨域方式有这么几种:

1、JSONP,主要依赖的是 script 标签不受同源策略影响，src指向某一个接口的地址， 同步需要传递callback回调函数名字，这样当接口调用成功后，本地创建的全局回调函数就会执行，且接收到数据。不使用img标签的原因是因为img标签无法执行js语句

2、CORS,依赖服务端对前端的请求头信息进行放行，不做限制。

Access-Contro1-A11ow-origin：' * '

3、代理访问，前端访问不存在跨域问题的代理服务器，代理服务器再去访问目标服务器(服务器之间没有跨域限制)