在公司上班這幾天除了修改bug之外也在逛掘金刷面試題筆試題,惡補(bǔ)javascript原生的基礎(chǔ),想更深刻的理解底層原理烦租。剛好遇到一次前同事推給我的機(jī)會(huì),就去參加面試了除盏。
(小聲bb:面試的這個(gè)公司真的好大啊.......)
筆試題(45分鐘)
1叉橱、簡(jiǎn)述css的盒子模型
css盒子模型又稱框模型 (Box Model) ,包含了元素內(nèi)容(content)痴颊、內(nèi)邊距(padding)赏迟、邊框(border)屡贺、外邊距(margin)幾個(gè)要素蠢棱。
2锌杀、cookies,sessionStorage和localStorage區(qū)別
源自https://www.cnblogs.com/minigrasshopper/p/8064367.html
3泻仙、實(shí)現(xiàn)水平垂直居中
- 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、寫一個(gè)函數(shù)對(duì)url的參數(shù)進(jìn)行對(duì)象的封裝
function getParameters(URL){
let str = URL.substring(URL.indexOf('?')+1,URL.length)
//split() 方法用于把一個(gè)字符串分割成字符串?dāng)?shù)組
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玉转、簡(jiǎn)述嚴(yán)格模式
"use strict“目的是指定代碼在嚴(yán)格條件下執(zhí)行突想。
嚴(yán)格模式下是不能使用未聲明的變量。
6究抓、解決跨域的方法
- jsonp
- CORS跨域處理Access-Control-Allow-Origin
-
PostMessage(data: 要傳遞的數(shù)據(jù)猾担,origin: 字符串參數(shù) 用于指明目標(biāo)窗口的源)
允許來(lái)自不同源的腳本采用異步的方式進(jìn)行有限的通信,可以實(shí)現(xiàn)跨文本檔刺下、多窗口绑嘹、跨域消息傳遞。
對(duì)跨域不太理解的朋友直接→ 正確面對(duì)跨域橘茉,別慌—Neal_yang
7工腋、描述http事務(wù)的流程
- 域名DNS解析
- 發(fā)起TCP三次握手
- 建立TCP連接以后發(fā)起http請(qǐng)求
- 服務(wù)器端響應(yīng)請(qǐng)求,瀏覽器得到html代碼
- 瀏覽器解析html代碼并請(qǐng)求html中的資源
- 瀏覽器對(duì)頁(yè)面進(jìn)行渲染呈現(xiàn)給用戶
8畅卓、請(qǐng)寫出以下輸出
(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則默認(rèn)為a擅腰,如果a為undefined則默認(rèn)為b
log(f)//f='10 '
}
})(window.console.log)
9、請(qǐng)回答以下問(wèn)題
var name='test1';
var obj={
name:'test2',
prop:{
name:'test3',
getName:function(){
return this.name
}
}
}
var getName=obj.prop.getName;
① obj.prop.getName()
答案:test3翁潘,在方法內(nèi)使用this趁冈,this指向使用其的對(duì)象即是prop
② getName()
答案:test1,將getName方法賦給了全局變量getName唐础,this指向全局
③ obj.prop.getName.call(obj)
答案:test2 箱歧,通過(guò)call方法將this指向了obj
對(duì)this不理解朋友直接前往這里 JavaScript 之 this 指南—JintNiu
這篇文章對(duì)this的講解比較清楚,我也是面試前刷到了這篇文章一膨,還是很感激這個(gè)作者的呀邢!