玄武科技——前端面试题总结

简答题&＃xff08;每题5分&＃xff09;&＃xff1a;
1、label标签是什么&＃xff0c;for和accesskey属性有什么用&＃xff1f;

label标签是一种常见的表单控件。它的作用是使用户在填写表单的项目时有更好的体验。

label标签的关联方式主要有两种&＃xff0c;显示关联和隐式关联

//显示关联 for属性的值与id值一样&＃xff0c;表示关联
Male
Female


隐式关联&＃xff1a;是直接将表单控件放到label标签内&＃xff0c;这种情况下&＃xff0c;label标签只能包含一个表单元素&＃xff0c;包含多个只对第一个有效。

点击我可以使文本框获得焦点



accesskey属性&＃xff1a;
例如作用在 元素上&＃xff1a;

自定义快捷访问

这里的属性值 ‘1’ 对应的就是键盘上的数字 1 &＃xff0c;虽然说 accesskey 属性值和键盘相对应&＃xff0c;但并不是说直接按下这个键&＃xff0c;就能快捷访问。浏览器是通过快捷键组合访问的形式进行页面元素的快速访问的。
ie和Google都是“ALT&＃43;key”启动
火狐浏览器要“Ctrl&＃43;alt&＃43;key”才能启动

2、 盒子模型
3、null和undefined的区别

undefined是一个表示"无"的原始值&＃xff0c;转为数值时为NaN
变量被声明了&＃xff0c;但没有赋值时&＃xff0c;就等于undefined
调用函数时&＃xff0c;应该提供的参数没有提供&＃xff0c;该参数等于undefined
对象没有赋值的属性&＃xff0c;该属性的值为undefined
函数没有返回值时&＃xff0c;默认返回undefined

null是一个表示"无"的对象&＃xff0c;
转为数值时为0 作为函数的参数&＃xff0c;表示该函数的参数不是对象
作为对象原型链的终点

4、 闭包及使用的场景

闭包就是能够读取其他函数内部变量的函数。闭包可以简单理解成“定义在一个函数内部的函数“。

5、三个存储的区别
6、this如何工作

this指向的情况&＃xff0c;取决于函数调用的方式有哪些&＃xff1a;

通过函数名()直接调用的&＃xff1a;this指向window 通过对象.函数名()调用的&＃xff1a;this指向这个对象&＃xff1b;
函数作为数组的一个元素&＃xff0c;通过数组下标调用的&＃xff1a;this指向这个数组
函数作为window内置函数的回调函数调用时&＃xff1a;this指window.setTimeout(func,XXms);setInterval(func,XXms)等
函数作为构造函数&＃xff0c;用new关键字调用时&＃xff1a;this指向的是new出的新对象 通过函数指定&＃xff0c;apply()\call()\bind()
方法指定this 箭头函数中的this问题&＃xff0c;指向为定义时的this&＃xff0c;而不是执行时的this

7、什么是跨域&＃xff1a;跨域&＃xff0c;指的是浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的&＃xff0c;是浏览器施加的安全限制。


## 跨域解决方案通过jsonp跨域document.domain &＃43; iframe跨域location.hash &＃43; iframewindow.name &＃43; iframe跨域postMessage跨域跨域资源共享&＃xff08;CORS&＃xff09;nginx代理跨域nodejs中间件代理跨域WebSocket协议跨域

8、 常见状态码及含义

成功2×× 成功处理了请求的状态码。
200 服务器已成功处理了请求并提供了请求的网页。
204 服务器成功处理了请求&＃xff0c;但没有返回任何内容。
重定向3×× 每次请求中使用重定向不要超过 5 次。
301 请求的网页已永久移动到新位置。当URLs发生变化时&＃xff0c;使用301代码。搜索引擎索引中保存新的URL。
302 请求的网页临时移动到新位置。搜索引擎索引中保存原来的URL。
304 如果网页自请求者上次请求后没有更新&＃xff0c;则用304代码告诉搜索引擎机器人&＃xff0c;可节省带宽和开销。
客户端错误4×× 表示请求可能出错&＃xff0c;妨碍了服务器的处理。
400 服务器不理解请求的语法。
403 服务器拒绝请求。
404 服务器找不到请求的网页。服务器上不存在的网页经常会返回此代码。
410 请求的资源永久删除后&＃xff0c;服务器返回此响应。该代码与 404&＃xff08;未找到&＃xff09;代码相似&＃xff0c;但在资源以前存在而现在不存在的情况下&＃xff0c;有时用来替代404 代码。如果资源已永久删除&＃xff0c;应当使用 301 指定资源的新位置。
服务器错误5×× 表示服务器在处理请求时发生内部错误。这些错误可能是服务器本身的错误&＃xff0c;而不是请求出错。
500 服务器遇到错误&＃xff0c;无法完成请求。
503 服务器目前无法使用&＃xff08;由于超载或停机维护&＃xff09;。通常&＃xff0c;这只是暂时状态。

9、reflow和repaint

repaint就是重绘&＃xff0c;reflow就是回流
严重性&＃xff1a;在性能优先的前提下&＃xff0c;reflow的性能消耗要比repaint的大

10、 JSONP使用场景

1、在RPC远程调用时,或者提供给外部访问接口&＃xff0c;一般数据交互格式通常为JSON
2、例如提供移动APP接口
3、前端ajax异步访问数据
4、项目合作时提供外部访问接口等。

11、如何优化网站

大题&＃xff08;每题10分&＃xff09;

-手写快速排序算法

function quickSort(arr){if(arr.length &＃61;&＃61; 0){return [];}var left &＃61; [];var right &＃61; [];var selectItem &＃61; arr[0];for(var i &＃61; 1; i }


-说一下vuex&＃xff0c;讲一下他的使用场景和解决痛点

Vuex是一个专为vue.js应用程序开发的状态管理模式。
当我们构建一个中大型的单页面应用程序时&＃xff0c;Vuex可以更好的帮助我们在组件外部统一管理状态。

-一次完整的http的事务过程

1、域名解析

2、发起TCP的三次握手

3、建立TCP连接后发起http请求

4、服务器端响应http请求&＃xff0c;浏览器得到html码

5、浏览器解析html代码&＃xff0c;并请求html代码中的资源

6、浏览器对页面进行渲染并呈现给客户