前端面试总结二

scwang90 发布于2019-08-01 17:41 / 1915人阅读

摘要：服务器无法理解请求的格式，客户端不应当尝试再次使用相同的内容发起请求。服务器端暂时无法处理请求可能是过载或维护。

为什么要使用css预编译

1、css无法递归式定义
2、解决复用性不够
3、可以缓解浏览器兼容造成的冗余

cookie,sessionStorage和localStorage的区别

cookie用来在浏览器和服务器中传递并且总量很小
sessionStorage和localStorage用于存储本地数据，存储较大
localStorage是持久性存储

如何实现浏览器内多个标签页之间的通信? (阿里)

websocket、shareWorker
也可以调用localstorge、cookies等本地存储方式
将有专门的教程讲解websocket

websocket如何兼容低浏览器

Adobe Flash Socket 、
ActiveX HTMLFile (IE) 、
基于 multipart 编码发送 XHR 、
基于长轮询的 XHR

如何居中div

1、水平居中,给定宽度

div{

    width: 200px
    margin:0 auto
}

2、绝对定位居中

div {
position: absolute;
width: 300px;
height: 300px;
margin: auto;
top: 0;
left: 0;
bottom: 0;
right: 0;

}

3、水平居中

确定宽高
div {
position: relative;
width: 500px;
height: 300px;
top: 50%;
left: 50%;
margin: -150px 0 0 -250px;

}

不知道宽高


div {
position: relative;
width: 500px;
height: 300px;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);

}

使用flex布局

   .container {
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .container div {
        width: 100px;
        height:100px;
    }

css3新特性

文字特效：text-shadow
线性渐变：gradient
旋转：transform
圆角：border-radius
新增选择器:not(:input)
没写全，但是够用了

用css穿件一个三角形的原理

把上、左、右三条边隐藏掉

#demo {
    width: 0;
    height: 0;
    border-width: 20px;
    border-style: solid;
    border-color: transparent transparent red transparent;
}

经常li之间有看不见的间隔，造成的原因

回车和空格会被应用样式,解决方法：把字符大小设置成font-size:0

为什么要清除浮动

清除浮动是为了清除浮动元素产生的影响，浮动的元素高度将会塌陷，后面的布局也就不能实现，这儿讲一种方法
&:after

元素浮动后,display变成了什么

display: inline-block

如果需要手动写动画，你认为最小时间间隔是多久，为什么？

多数显示屏默认频率是60hz，所以理论上最小间隔1/60*1000ms = 16.7ms

cookie隔离

cookie有域的限制,跨期提交请求时，不会携带cookie

数组的随机排序

方法一、

var arr = [1,2,3,4,5,7,8,9]

function randSort(arr) {

for (var i = 0, len = arr.length; i < len; i++) {
    var rand = parseInt(Math.random()*len)
    var temp = arr[rand]
    arr[rand] = arr[i]
    arr[i] = temp
}
return arr

}
方法二
var arr = [1,2,3,4,5,7,8,9]
function randSort2(arr) {

var mixedArray = []
while(arr.length > 0) {
    var randomIndex = parseInt(Math.random()*arr.length)
    mixedArray.push(arr[randomIndex])
    arr.splice(randomIndex, 1)
}
return mixedArray

}
方法三
var arr = [1,2,3,4,5,7,8,9]
arr.sort(function () {

return Math.random() - 0.5

})

什么是window对象，什么是document对象

window是浏览器打开的窗口，document是Document对象的一个只读引用

[“1”, “2”, “3”].map(parseInt) 答案是多少？
[1, NaN, NaN]

如何判断一个对象是否属于某个类

return a instance of Person

new操作符干了什么

1、创建一个空对象，并且this引用该对象，同时还继承了该函数的对象
2、属性和方法都加入到this引用的对象中
3、新创建的对象由this所引用，最后隐式返回this

Javascript中，有一个函数，执行时对象查找时，永远不会去查找原型，这个函数是？

Oject.hasOwnProperty(name),返回布尔值，不会去寻找原型链上的属性

如何检测浏览器版本

功能检测、userAgent特征检测：navigator.userAgent

什么是polyfill

polyfill 是“在旧版浏览器上复制标准 API 的 JavaScript 补充”,可以动态地加载 JavaScript 代码或库，在不支持这些标准 API 的浏览器中模拟它们。

Object.is()

Object.is在处理-0和+0是返回false,但是Object.is(NaN, NaN)返回true

前端性能优化

1、减少http请求次数：雪碧图、js,css源码压缩、图片大小控制合适，cdn托管
2、使用ajax代替整体刷新页面
3、减少dom操作
4、设置样式时更多的时候使用className而不是style
5、少用全局变量、缓存dom节点查找结果
6、避免使用css expression
7、图片懒加载（有专门的文章讲解图片懒加载）

http状态码常用的

100 Continue 继续，一般在发送post请求时，已发送了http header之后服务端将返回此信息，表示确认，之后发送具体参数信息
200 OK 正常返回信息
201 Created 请求成功并且服务器创建了新的资源
202 Accepted 服务器已接受请求，但尚未处理
301 Moved Permanently 请求的网页已永久移动到新位置。
302 Found 临时性重定向。
303 See Other 临时性重定向，且总是使用 GET 请求新的 URI。
304 Not Modified 自从上次请求后，请求的网页未修改过。

400 Bad Request 服务器无法理解请求的格式，客户端不应当尝试再次使用相同的内容发起请求。
401 Unauthorized 请求未授权。
403 Forbidden 禁止访问。
404 Not Found 找不到如何与 URI 相匹配的资源。

500 Internal Server Error 最常见的服务器端错误。
503 Service Unavailable 服务器端暂时无法处理请求（可能是过载或维护）。

我的githubhttps://github.com/skychenbo如果觉得对你有用，欢迎点一个star

云服务器 GPU云服务器前端面试前端工程师面试前端ddos 攻击面试前端开发工程师面试

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/51305.html

前端资源系列（4）-前端学习资源分享&前端面试资源汇总

摘要：特意对前端学习资源做一个汇总，方便自己学习查阅参考，和好友们共同进步。特意对前端学习资源做一个汇总，方便自己学习查阅参考，和好友们共同进步。本以为自己收藏的站点多，可以很快搞定，没想到一入汇总深似海。还有很多不足&遗漏的地方，欢迎补充。有错误的地方，还请斧正... 托管: welcome to git，欢迎交流，感谢star 有好友反应和斧正，会及时更新，平时业务工作时也会不定期更...

princekin 2019-08-20 11:28 评论0 收藏0
前端秋招面试总结

摘要：前言秋招宣告结束，面试了接近家公司，有幸拿到，感谢这段时间一起找工作面试的朋友和陪伴我的人。一定要提前准备好，不然面试官叫你说遇到的难点，或者直接问问题时可能会懵逼。前言秋招宣告结束，面试了接近20家公司，有幸拿到offer，感谢这段时间一起找工作面试的朋友和陪伴我的人。这是一段难忘的经历，相信不亚于当年的高考吧，也许现在想起来高考不算什么，也许只有经历过秋招的人才懂得找工作的艰辛...

Gu_Yan 2019-08-02 12:04 评论0 收藏0
前端秋招面试总结

摘要：前言秋招宣告结束，面试了接近家公司，有幸拿到，感谢这段时间一起找工作面试的朋友和陪伴我的人。一定要提前准备好，不然面试官叫你说遇到的难点，或者直接问问题时可能会懵逼。前言秋招宣告结束，面试了接近20家公司，有幸拿到offer，感谢这段时间一起找工作面试的朋友和陪伴我的人。这是一段难忘的经历，相信不亚于当年的高考吧，也许现在想起来高考不算什么，也许只有经历过秋招的人才懂得找工作的艰辛...

Scholer 2019-08-29 17:21 评论0 收藏0
[面试专题]一线互联网大厂面试总结

摘要：道阻且长啊前端面试总结前端面试笔试面试腾讯一面浏览器工作原理浏览器的主要组件包括用户界面包括地址栏后退前进按钮书签目录浏览器引擎用来查询及操作渲染引擎的接口渲染引擎渲染界面和是基于两种渲染引擎构建的，使用自主研发的渲染引擎，和都使用网络用来道阻且长啊TAT(前端面试总结) 前端面试笔试面试腾讯一面 1.浏览器工作原理浏览器的主要组件包括：用户界面－包括地址栏、后退/前...

lemanli 2019-08-02 15:57 评论0 收藏0
[面试专题]一线互联网大厂面试总结

摘要：道阻且长啊前端面试总结前端面试笔试面试腾讯一面浏览器工作原理浏览器的主要组件包括用户界面包括地址栏后退前进按钮书签目录浏览器引擎用来查询及操作渲染引擎的接口渲染引擎渲染界面和是基于两种渲染引擎构建的，使用自主研发的渲染引擎，和都使用网络用来道阻且长啊TAT(前端面试总结) 前端面试笔试面试腾讯一面 1.浏览器工作原理浏览器的主要组件包括：用户界面－包括地址栏、后退/前...

xfee 2019-08-21 11:53 评论0 收藏0