web前端面试总结（1）

10.23面试总结与分享（多普多）

面试题（笔试）

一、选择题

1. 下列哪个操作是 W3 C标准定义的阻止事件向父容器传递：c
   A、 e. preventDefault( )
   B、 e. cancel Bubble=true
   C、 e.stopPropagation( )
   D、 e. stopImmediatePropagation( )

【解析】：
DOM中的事件对象：（符合W3C标准）
preventDefault() //取消事件默认行为
stopImmediatePropagation() //取消事件冒泡同时阻止当前节点上的事件处理程序被调用。
stopPropagation() //取消事件冒泡对当前节点无影响。
IE中的事件对象：
cancelBubble() //取消事件冒泡
returnValue() //取消事件默认行为

2. 以下关于盒子模型描述正确的是：A
   A、标准盒子模型中：盒子的总宽度=左右margin+左右border+左右padding+ width
   B、IE盒子模型中：盒子总宽度=左右margin +左右 border + width
   C、 标准盒子模型中：盒子的总宽度=左右margin+左右border + widlh
   D、 IE盒子模型中：盒子总宽度=width

【解析】：
w3c中的盒子模型的宽:包括margin+border+padding+width;
IE 盒子模型的 content 部分包含了 border 和 pading。

3. 使用CSS的flexbox布局，不能实现以下哪一个效果：D
   A、 三列布局，随容器宽度等宽弹性伸缩
   B、 多列布局，每列的高度按内容最高的一列等高
   C、 三列布局，左列宽度像素数确定，中、右列随容器宽度等宽弹性忡缩
   D、 多个宽高不等的元素，实现无缝瀑布流布局
4. 关于HTML语义化，以下哪个说法是正确的？D
   A、语义化的HTML有利于机器阅读，如PDA手持设备、搜索引擎爬虫；但不利干人的
   B、Table属于过时的标签，遇到数据列表时，需尽量使用div来模拟表格
   C、 语义化是HTML5带来的新概念，此前版本的HTML无法做到语义化
   D、 header、article、address都属于语义化明确标签
5. 关于HTTP协议，下面哪个说法是正确的? C
   A、HTTP协议是有状态协议.
   B、以下是一个http 链接的 response 的响应头： GET /xxx/xxx/js/lb/test.js HTTP/1.1Host:127.0.0.1 Connection: keep-alive Pragma: no-cache Cache-Control: no-cache Accept:/
   C、 RESTful接 口 中 ，利 用 HTTP协议的 method字段来描述要对资源操作的方式.比如 GET表示获取资源,POST表示新增一个资源，PUT表示更新资源.DELETE表示刪除资源等等
   D、一个HTTP请求返回的HTTP状态码中，304表示临时重定向

http是无状态的
B是请求不是响应
典型的响应消息：
HTTP/1.0200OK
Date:Mon,31Dec200104:25:57GMT
Server:Apache/1.3.14(Unix)
Content-type:text/html
Last-modified:Tue,17Apr200106:46:28GMT
Etag:“a030f020ac7c01:1e9f”
Content-length:39725426
Content-range:bytes554554-40279979/40279980
典型的请求消息：
GET http://download.microtool.de:80/somedata.exe
Host: download.microtool.de
Accept:/
Pragma: no-cache
Cache-Control: no-cache
Referer: http://download.microtool.de/
User-Agent:Mozilla/4.04en
Range:bytes=554554-
状态码304表示：如果客户端发送了一个带条件的 GET 请求且该请求已被允许，而文档的内容（自上次访问以来或者根据请求的条件）并没有改变，则服务器应当返回这个状态码。
如果网页自请求者上次请求后再也没有更改过，您应将服务器配置为返回此响应（称为 If-Modified-Since HTTP 标头）。服务器可以告诉 Googlebot 自从上次抓取后网页没有变更，进而节省带宽和开销。

6. 下列关于JavaScript的AMD模块规范理解正确的是？ A
   A、 只要被define()函数 包裹的就是AMD规范
   B、AMD模块是同步加载的。
   C、 运行AMD模块需要浏览器支持该规范。
   D、 AMD模块可以自运行，只要在页面上引入就可以了。

是异步的，并且必须在代码编译的前提下执行

7. 以下关于Web Worker说话正确的是 B
   A、 Web Worker需要服务端支持
   B、 把DOM的操作放到Web Worker中有助于提升页面性能
   C、 Web Worker中可以获取站点的Cookie
   D、 Web Worker 中不可使用 Promise
   E、 Web Worker中不能发AJAX请求
8. 关于Node.js的cluster模块理解正确的是（多选)：
   A、 cluster模块是为了更好的利用CPU
   B、 通过master进程fork出来的worker进程与master进程共享内存
   C、 master进程与worker进程通过IPC通道进行通信
   D、 worker进程因异常退出时，master进程无法感知
   F、因为master进程是主进程，因此业务逻辑也应该放在master里实现。
9. 以下哪些CSS属性能实现D0M" 隐藏 "（在可视区域内肉眼不可见）（多选)
   A、 diplay:none
   B、 visibility:hidden
   C、 opacity:0
   D、 position:absolute
   E、 position:fixed
10. 根据浏览器同源策略的限制，以下属于跨域的是（多选):
    A、 协议不同
    B、 一级域名不同
    C、 一级域名相同，二级域名不同
    D、 端口号不同
    E、 路径层级不同
    F、消求使用的HTTP方法不同

二、 问答题

1. HTML的含义是什么？其主体部分由什么标记构成？
2. 说明在网页设计中div标签的作用
3. CSS指的是什么？在网页制作中为什么要使用CSS技术
4. 请写出你熟悉的HTML5标签，并简单描述其使用方法
5. 说出浏览器端有哪些存储方法，并分析优缺点。
6. 写出postition厲性的取值，并作解释

三、编程题

1. 给定整数n和m.写一个函数dispatch,把1-n尽量平均地分成m个组
2. 下面这段代码的输出结果是？

var length=10;
function fn(){
	console.log(this.length);
}
var obj = {
	length:5,
	method: function (fn) {
		fn();
		arguments[0]()
	}
}
obj.method(fn)
obj.method(fn,123);
> 10	 1    10    2

3. 写一个函数， 列出一 个整数所有的分解类型，比如对于数字4，可以做拆分得到下列字符串
   1111

面试问题（二轮）

• 自我介绍
• 项目
• 工作经历
• 工作内容

面试问题（三轮）

1. MVC/MVVM
2. 你会什么框架
3. json是什么，是不是对象

是一种重要的数据传输对象。

4. js中数组的方法

Array.push()
Array.pop()
Array.shift()
Array.unshift()
Array.isArray()
Array.concat()
Array.toString()
.Array.splice(开始位置， 删除的个数，元素)
Array.forEach()

5. 在js中一个数字+1的方法及区别

+= ++ i+1

6. 如何在网页中导出pdf
7. vue是什么
8. 用js实现奇偶数

num % 2 == 0

10. 前端跟服务器怎么通信
11. 一般情况下get用的多还是post
12. 如何判断一个变量是不是数组

Array.isArray() 判断一个对象是不是数组，返回的是布尔值
通过instanceof来判断区分arr instanceof Array

13. 一般一个页面写多少行js代码

面试总结

• 简历熟悉度
• 自我介绍
• 紧张情绪，说话语速
• 对原生js的熟悉度
• 简历信息的真实性
• 通过搜集答案，以上的面试题大多来自 牛客网