在公司上班这几天除了修改bug之外也在逛掘金刷面试题笔试题，恶补javascript原生的基础，想更深刻的理解底层原理。刚好遇到一次前同事推给我的机会，就去参加面试了。
（小声bb：面试的这个公司真的好大啊.......）
笔试题（45分钟）
1、简述css的盒子模型
css盒子模型又称框模型 (Box Model) ，包含了元素内容（content）、内边距（padding）、边框（border）、外边距（margin）几个要素。
2、cookies，sessionStorage和localStorage区别
源自https://www.cnblogs.com/minigrasshopper/p/8064367.html
3、实现水平垂直居中
- absolute + left:0 + right:0 +top:0 +bottom:0 + margin auto（需要具体宽高）
- absolute + top:50% + left:50% + transform：translate（-50%,-50%）
- flex + justify-content:center + align-items:center
(还有很多方法，大家自行解锁吧)
4、写一个函数对url的参数进行对象的封装
function getParameters(URL){
let str = URL.substring(URL.indexOf('?')+1,URL.length)
//split() 方法用于把一个字符串分割成字符串数组
let strArr = str.split('&')
let obj={}
for(let i in strArr){
let key = strArr[i].substring(0,strArr[i].indexOf('='))
let value = strArr[i].substring(strArr[i].indexOf('=')+1,strArr[i].length)
obj[key]=value
}
return obj;
}
5、简述严格模式
"use strict“目的是指定代码在严格条件下执行。
严格模式下是不能使用未声明的变量。
6、解决跨域的方法
- jsonp
- CORS跨域处理Access-Control-Allow-Origin
-
PostMessage(data: 要传递的数据，origin: 字符串参数 用于指明目标窗口的源)
允许来自不同源的脚本采用异步的方式进行有限的通信，可以实现跨文本档、多窗口、跨域消息传递。
对跨域不太理解的朋友直接→ 正确面对跨域，别慌—Neal_yang
7、描述http事务的流程
- 域名DNS解析
- 发起TCP三次握手
- 建立TCP连接以后发起http请求
- 服务器端响应请求，浏览器得到html代码
- 浏览器解析html代码并请求html中的资源
- 浏览器对页面进行渲染呈现给用户
8、请写出以下输出
(function(log){
"use strict"
var a=10,i=5,f,
a+=' ' //a='10 '
for(var i=0;i<a;i++){
log(b) //undefined
var b=i*i //i=10,b=81
}
if(a===10){ //a='10 '
f=b+a //f='8110 '
log(f)
}else{
f=f‖a‖b //如果f是undefined或者是null则默认为a，如果a为undefined则默认为b
log(f)//f='10 '
}
})(window.console.log)
9、请回答以下问题
var name='test1';
var obj={
name:'test2',
prop:{
name：'test3',
getName：function(){
return this.name
}
}
}
var getName=obj.prop.getName;
① obj.prop.getName()
答案：test3，在方法内使用this，this指向使用其的对象即是prop
② getName()
答案：test1，将getName方法赋给了全局变量getName，this指向全局
③ obj.prop.getName.call(obj)
答案：test2 ，通过call方法将this指向了obj
对this不理解朋友直接前往这里 JavaScript 之 this 指南—JintNiu
这篇文章对this的讲解比较清楚，我也是面试前刷到了这篇文章，还是很感激这个作者的！
网友评论