【前端】笔试札记（1）

本文关于我的第一次笔试经历，在此做一记录，以供日后回顾，文中关于专业知识表述如有不妥之处，还望您不吝赐教！

先谈谈本次的题目吧：15道单选题、10道填空题、1道问答题和3道编程题。下面是相关知识点罗列：（序号非题号）

1.算法复杂度：

算法复杂度分为空间复杂度和时间复杂度。
复杂度一般有O(n)，O(n^2)，O(logn)，O(nlogn)，O(1)，代表某个算法占用时间和空间与数据之间的增量关系，n代表数据输入的量。
O(n)代表随着数据量的增大，损耗的内存空间和损耗的时间随之增大。数据量增大多少倍，算法复杂度就增加多少倍。
O(n^2)代表数据量的增加，算法复杂度增大数据量的平方倍。好比数量增加为8倍，算法复杂度增加64倍。
O(logn)是当数据增大n倍的时候，算法复杂度增大logn倍，这个log是用2为底的。比如数据增大256倍，算法复杂度只增加8倍。也就是2的八次方等于256。
O(nlogn)当数据增加n倍，算法复杂度增加n×logn倍，也就是当数据增加256倍，算法复杂度增加256×8倍，高于线性，低于平方。
O(1)最低的空间复杂度，这个复杂度与输入的数据无关。无论这个数据是多少，都可以一次性找到数据。

2.排序算法：（这里简单提一下十大经典排序算法，日后专门写一篇讲讲排序算法）

十种常见排序算法可以分为两大类：
比较类排序：通过比较来决定元素间的相对次序，由于其时间复杂度不能突破O(nlogn)，因此也称为非线性时间比较类排序。
非比较类排序：不通过比较来决定元素间的相对次序，它可以突破基于比较排序的时间下界，以线性时间运行，因此也称为线性时间非比较类排序。
十大经典排序分别是：冒泡排序（Bubble Sort）、选择排序（Selection Sort）、插入排序（Insertion Sort）、希尔排序（Shell Sort）、归并排序（Merge Sort）、快速排序（Quick Sort）、堆排序（Heap Sort）、计数排序（Counting Sort）、桶排序（Bucket Sort）、基数排序（Radix Sort）。
本次考到：在待排序的元素序列基本有序的前提下，效率最高的排序方法是？
解答：插入排序通过数据元素的交换来逐步消除线性表中的逆序，所以关键字比较的次数与记录的初始排列次序有关，在待排序的元素序列基本有序的前提下，效率最高。而选择排序和堆排序的关键字比较的次数与记录的初始排列次序无关。快速排序虽然与记录的初始排列次序有关，但在待排序的元素序列基本有序的前提下，效率低于插入排序。

3.满二叉树：

除最后一层无任何子节点外，每一层上的所有结点都有两个子结点的二叉树。
在一棵满二叉树中，节点的个数为：2^n-1， 叶子节点的个数为：2^(n-1)。

4.线性结构和非线性结构：

线性结构是一个有序数据元素集合，常用的线性结构有：线性表、栈（FILO）、队列（FIFO）、数组、双队列、串。
非线性结构，其逻辑特征是一个结点元素可能有多个直接后继，常见的非线性结构有：二维数组，广义表，树(二叉树)。

5.Position属性之relative用法：

Relative是position的一个属性，是相对定位。
position的默认值是static，（也就是说对于任意一个元素，如果没有定义它的position属性，那么它的position:static）
absolute是相对于自己最近的父元素来定位的，如果你不给#demo相对定位，那么#sub的绝对定位就是相对于body来定位的。
relative是相对于自己来定位的，例如：#demo{position:relative;top:-50px;}，这时#demo会在相对于它原来的位置上移50px。
附：relative不脱离文档流，absolute脱离文档流。也就是说：relative 的元素尽管表面上看到它偏离了原来的位置，但它实际上在文档流中还是没变。absolute的元素不仅位置改变了，同时也脱离了文档流。

6.JavaScript数据类型：

基本数据类型（原始类型）：String、Number、Null、Undefined、Boolean
引用类型：Object

7.HTTP状态码：

200 OK：表示从客户端发送给服务器的请求被正常处理并返回；
301 Moved Permanently：永久性重定向，表示请求的资源被分配了新的URL，之后应使用更改的URL；
302 Found：临时性重定向，表示请求的资源被分配了新的URL，希望本次访问使用新的URL；
400 Bad Request：表示请求报文中存在语法错误；
401 Unauthorized：未经许可，需要通过HTTP认证；
403 Forbidden：服务器拒绝该次访问（访问权限出现问题）；
404 Not Found：表示服务器上无法找到请求的资源，除此之外，也可以在服务器拒绝请求但不想给拒绝原因时使用；
500 Inter Server Error：表示服务器在执行请求时发生了错误，也有可能是web应用存在的bug或某些临时的错误时；
503 Server Unavailable：表示服务器暂时处于超负载或正在进行停机维护，无法处理请求；

8.四种常见的 POST 提交数据方式：

application/x-www-form-urlencoded 在发送前编码所有字符（默认）；
multipart/form-data 不对字符编码，在使用包含文件上传控件的表单时，必须使用该值；
application/json 作为请求头告诉服务端消息主体是序列化的JSON字符串。除低版本的IE，基本都支持；
text/plain 空格转换为“+”加号，但不对特殊字符编码。

9.HTML <!DOCTYPE> 标签：

声明必须是 HTML 文档的第一行，位于 标签之前。 声明不是 HTML 标签；它是指示 web 浏览器关于页面使用哪个 HTML 版本进行编写的指令。

在 HTML 4.01 中，<!DOCTYPE> 声明引用 DTD，因为 HTML 4.01 基于 SGML。DTD 规定了标记语言的规则，这样浏览器才能正确地呈现内容。
HTML5 不基于 SGML，所以不需要引用 DTD。
提示：请始终向 HTML 文档添加 <!DOCTYPE> 声明，这样浏览器才能获知文档类型。

10.跨域的几种方式：

通过document.domain跨域，只适用于不同子域的框架间的交互；
通过location.hash跨域；
通过HTML5的postMessage方法跨域；
通过jsonp跨域；
通过CORS跨域。

11.NaN == NaN的结果为什么是false？

这是因为NaN是一个非数字值，每个非数字值是不同的。

12.数据链路层主要功能：

提供对物理层的控制、差错控制、流量控制
注意：决定传输报文的最佳路径的是网络层

13.数据结构-树：

元素之前无联系的数据、无序数据元素不适合用树来表示；
有序数据元素、元素之间具有分支层次关系的数据可以用树来表示。

14.CSS选择器优先级排序：

浏览器默认属性 < 继承自父元素的属性 < 通配符选择器 < 标签选择器 < 类选择器 < 结构伪类选择器 < id选择器 < 行内样式 < !important

15.localStorage 和 sessionStorage：

localStorage 和 sessionStorage 属性允许在浏览器中存储 key/value 对的数据。
localStorage 用于长久保存整个网站的数据，保存的数据没有过期时间，直到手动去删除。
localStorage 属性是只读的。
提示: 如果你只想将数据保存在当前会话中，可以使用 sessionStorage 属性， 该数据对象临时保存同一窗口(或标签页)的数据，在关闭窗口或标签页之后将会删除这些数据。

16.AJAX：

AJAX = Asynchronous JavaScript and XML（异步的 JavaScript 和 XML）。
AJAX 不是新的编程语言，而是一种使用现有标准的新方法。
AJAX 最大的优点是在不重新加载整个页面的情况下，可以与服务器交换数据并更新部分网页内容。
AJAX 不需要任何浏览器插件，但需要用户允许JavaScript在浏览器上执行。
下面是 XMLHttpRequest 对象的三个重要的属性：
onreadystatechange：存储函数（或函数名），每当 readyState 属性改变时，就会调用该函数。
readyState：存有 XMLHttpRequest 的状态。从 0 到 4 发生变化。
0: 请求未初始化
1: 服务器连接已建立
2: 请求已接收
3: 请求处理中
4: 请求已完成，且响应已就绪
status：
200: "OK"
404: 未找到页面

17.W3C制定的 javascript 标准事件模型：

事件捕获->事件处理->事件冒泡

18.正则表达式：

[abc] 查找方括号之间的任何字符。
[0-9] 查找任何从 0 至 9 的数字。
(x|y) 查找由 | 分隔的任何选项。
\d 查找数字。
\s 查找空白字符。
\b 匹配单词边界。

19.栈和队列的区别：

栈的插入和删除操作都是在一端进行的，而队列的操作却是在两端进行的。
栈是先进后出，队列是先进先出。
栈只允许在表尾一端进行插入和删除，队列只允许在表尾一端进行插入，在表头一端进行删除。

20.系统中有三个并发进程共同竞争某一资源，每个进程需要四个该类资源，如果要使系统不发生死锁，则该类资源至少应有几个？

解答：10个，三个进程要想不死锁每个进程都需要四个同类资源，所以只要每个进程都有三个资源，另外一个再给一个额外的资源，那么三个进程中有一个可以运行，运行完以后释放资源，然后其余的进程继续申请资源就可以了。

21.二叉树的4种遍历：

层次遍历：通过对树中各层的节点从左到右依次遍历；1 2 3 4 5 6 7
先序遍历：每遇到一个节点，先访问，然后再遍历其左右子树；1 2 4 5 3 6 7
中序遍历：第一次经过时不访问，等遍历完左子树之后再访问，然后遍历右子树；4 2 5 1 6 3 7
后序遍历：第一次和第二次经过时都不访问，等遍历完该节点的左右子树之后，最后访问该节点。4 5 2 6 7 3 1

22.当块级元素设置box-sizing:border-box属性时，该块级元素的width包含哪几个部分？

解答：width=border+padding+content。

23.在一个html静态网站里A页面需要跳转并传递相关数据到B页面（两个页面处于同个域名下）请按照你对此场景的理解写出N中页面之前传参的代码（只需写出A页面传递参数及B页面接收参数的js关键代码）。

24.http长连接请求头:

Connection: keep-alive 当一个网页打开完成后，客户端和服务器之间用于传输HTTP数据的TCP连接不会关闭，如果客户端再次访问这个服务器上的网页，会继续使用这一条已经建立的连接。

25.布局一个三栏布局，左栏和右栏宽度分别为100px和200px，中间自适应。

解答：float浮动布局、绝对定位布局、flexbox布局方式、表格布局方式、网格布局

26.计算机网络中的OSI七层网络模型：

自上而下分别是应用层、表示层、会话层、传输层、网络层、数据链路层、物理层

本次札记到此结束，下次见！