寫在前面的話：
寫文目的：總結(jié)前端面試過程中沒回答上來的點(diǎn)，深化印象媳荒，也方便日后溫習(xí)究履。
寫文方法：寫之前先自己看相關(guān)知識(shí)滤否，理解好后過段時(shí)間根據(jù)記憶來寫，最后對(duì)比糾正最仑。
目前筆者面試的職位是1-3年工作經(jīng)驗(yàn)崗藐俺，閱讀者可將此作為前端面試參考題目。
準(zhǔn)備面試流程：
1.更新簡(jiǎn)歷泥彤，多參考其他的優(yōu)秀簡(jiǎn)歷
2.復(fù)習(xí)面試題
筆者就是因?yàn)橹桓铝撕?jiǎn)歷沒有復(fù)習(xí)導(dǎo)致基礎(chǔ)不過關(guān)欲芹，錯(cuò)過兩家心儀的公司。
順便說下全景，平時(shí)工作中的確很多時(shí)候用不到也不會(huì)去背某些面試中的問題耀石，不過面試題中基礎(chǔ)部分很重要，理解好基礎(chǔ)才更輕松掌握新框架新知識(shí)爸黄。時(shí)不時(shí)去看看面試題也不失為一種鞏固基礎(chǔ)的方法滞伟。一般一面面基礎(chǔ)，二面面項(xiàng)目炕贵，項(xiàng)目經(jīng)驗(yàn)再多梆奈，一面過不了，什么戲也不會(huì)有称开。
被面過的面試題：
什么是閉包
閉包是由函數(shù)與創(chuàng)建該函數(shù)的環(huán)境所組成的
優(yōu)點(diǎn)：減少全局變量污染
缺點(diǎn)：影響腳本性能
3==true 打印出什么
會(huì)打印出false亩钟，這里會(huì)將true轉(zhuǎn)變成1
Number 和 String 或者 Bool 類型比較，會(huì)對(duì)String 或者 Bool 類型進(jìn)行ToNumber()轉(zhuǎn)換
Number(true) // 1
Number(false) // 0
1==true //true
1===true //false
3==true //false
變量聲明提升
變量聲明無論出現(xiàn)在代碼的任何位置鳖轰，都會(huì)在代碼執(zhí)行前處理清酥。所以在代碼的任何位置聲明變量就好像在代碼開頭聲明一樣。
var a = 100;
function fn() {
alert(a);
var a = 200;
alert(a);
}
fn();
alert(a);
var a;
alert(a); //這里alert出100
var a = 300;
alert(a);
判斷變量是不是數(shù)組的幾個(gè)方法
var a=[];
a.constructor===Array //true
a instanceof Array === true //true
?? 注意：以上方法在跨frame時(shí)會(huì)有問題蕴侣，跨frame實(shí)例化的對(duì)象不共享原型
var iframe = document.createElement('iframe'); //創(chuàng)建iframe
document.body.appendChild(iframe); //添加到body中
xArray = window.frames[window.frames.length-1].Array;
var arr = new xArray(1,2,3); // 聲明數(shù)組[1,2,3]
alert(arr instanceof Array); // false
alert(arr.constructor === Array); // false
解決：
Object.prototype.toString.call(a) // "[object Array]"
Array.isArray(a) //true
bind,call,apply用法與區(qū)別
用法：都是改變函數(shù)內(nèi)this指向
bind:返回一個(gè)新的函數(shù)焰轻，調(diào)用新的函數(shù)才執(zhí)行，新函數(shù)里this永久地被綁定到了bind的第一個(gè)參數(shù)上
而call與apply能直接執(zhí)行
fuc.call(thisObj,a,b,c)
fuc.apply(thisObj,[a,b,c])
js三大組成部分
1.ECMAScript
2.dom
3.bom
http返回碼100 200 300 400分別代表什么昆雀，即響應(yīng)的5種類型
100:信息響應(yīng)
200:成功
300:重定向
400:客戶端錯(cuò)誤
500:服務(wù)端錯(cuò)誤
理解重定向
http無狀態(tài)含義
解釋三次握手辱志，四次揮手
三次握手
1.客戶端發(fā)syn包給服務(wù)端，等待服務(wù)器確認(rèn)（syn:同步序列編號(hào)（Synchronize Sequence Numbers））
2.服務(wù)端發(fā)syn+ack包給客戶端
3.客戶端發(fā)確認(rèn)包ack給服務(wù)端
四次揮手
中斷連接端可以是Client端狞膘，也可以是Server端揩懒。
1.關(guān)閉主動(dòng)方發(fā)送fin包
2.被動(dòng)方發(fā)送ack包
3.被動(dòng)方關(guān)閉連接，發(fā)送fin包
4.主動(dòng)方發(fā)送ack包確認(rèn)
自己實(shí)現(xiàn)個(gè)jQuery挽封，可以傳選擇器進(jìn)去已球，然后實(shí)現(xiàn)css()與height()方法
var myJquery4 = function (selector) {
//console.log(this) //window
return new jqNodes(selector) //new會(huì)創(chuàng)造一個(gè)對(duì)象實(shí)例，對(duì)象實(shí)例繼承自構(gòu)造函數(shù)的prototype,這里是jqNodes.prototype
}
var jqNodes = function (selector) {
console.log(this)
//1.以new調(diào)用時(shí)this指向即將創(chuàng)建的新對(duì)象
//2.直接調(diào)用則指向 window
this._items = document.querySelectorAll(selector)
return this
}
var myJqueryCore = {
//放核心方法
css: function () {
console.log(this) //myJquery4('li').css('color') 這樣調(diào)用時(shí)是作為new出來的對(duì)象原型里的方法調(diào)用的，this指向new出來的對(duì)象
var prop = arguments[0],
val = arguments[1]
if (!val) return getComputedStyle(this._items[0]).getPropertyValue(prop);
Array.prototype.map.call(this._items, function (c) {
return c.setAttribute('style', prop + ':' + val)
})
return this
}
}
jqNodes.prototype = myJqueryCore //關(guān)鍵
寫個(gè)輪播圖
之前感覺比較困擾的是從最后一頁到第一頁如何無縫滑動(dòng)和悦。無縫滑動(dòng)的關(guān)鍵在于在第一頁前放上最后一頁退疫，在最后一頁后面再放上第一頁。在最后一頁點(diǎn)擊后一頁時(shí)鸽素，先滑動(dòng)到放置在后邊的第一頁褒繁，滑動(dòng)完成后立刻改變父元素的left值到排列在第二個(gè)的第一頁。
html結(jié)構(gòu)：
<div id="list" style="left: -600px;">
<div>5</div>
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
<div>5</div>
<div>1</div>
</div>
關(guān)鍵js:
$('#list').animate({ left: newLeft }, function () {
if (newLeft < -3000) {
list.style.left = -600 + 'px';
} else if (newLeft > -600) {
list.style.left = -3000 + 'px';
}
})
完整代碼可點(diǎn)擊下面鏈接：https://github.com/lujing2/jsexercise/tree/master/carousel
網(wǎng)上看的面試題&自己發(fā)現(xiàn)的面試知識(shí)點(diǎn)
注：自己發(fā)現(xiàn)的面試知識(shí)點(diǎn)一般是在工作學(xué)習(xí)中發(fā)現(xiàn)的基礎(chǔ)重要但之前被自己忽略的知識(shí)點(diǎn)馍忽。
全等號(hào)優(yōu)先級(jí)大于邏輯與
var a=1===2&&3?4:5
逗號(hào)操作符
逗號(hào)操作符 對(duì)它的每個(gè)操作數(shù)求值（從左到右）棒坏，并返回最后一個(gè)操作數(shù)的值。
var x=(0,1) //x=1
比較對(duì)象
兩個(gè)獨(dú)立聲明的對(duì)象永遠(yuǎn)也不會(huì)相等遭笋，即使他們有相同的屬性坝冕，只有在比較一個(gè)對(duì)象和這個(gè)對(duì)象的引用時(shí)，才會(huì)返回true.
encodeURI encodeURIComponent
- encodeURI
encodeURI 會(huì)替換所有的字符瓦呼，但不包括以下字符喂窟，即使它們具有適當(dāng)?shù)腢TF-8轉(zhuǎn)義序列：
類型 包含
保留字符 ; , / ? : @ & = + $
非轉(zhuǎn)義的字符 字母 數(shù)字 - _ . ! ~ * ' ( )
數(shù)字符號(hào) #
encodeURI自身無法產(chǎn)生能適用于HTTP GET 或 POST 請(qǐng)求的URI，例如對(duì)于 XMLHTTPRequests, 因?yàn)?"&", "+", 和 "=" 不會(huì)被編碼央串，然而在 GET 和 POST 請(qǐng)求中它們是特殊字符磨澡。然而encodeURIComponent這個(gè)方法會(huì)對(duì)這些字符編碼。
- encodeURIComponent
轉(zhuǎn)義除了字母质和、數(shù)字稳摄、(、)饲宿、.厦酬、!、~瘫想、*仗阅、'、-和_之外的所有字符国夜。
dangerouslysethtml會(huì)過濾掉__html屬性里的 \ 减噪，是因?yàn)橛昧薳ncodeURI函數(shù)來避免xss攻擊
encodeURI('/\/\//') -->”////“
encodeURI('\') --> Uncaught SyntaxError: Invalid or unexpected token
encodeURIComponent('/\/\//') -->"%2F%2F%2F%2F"
encodeURIComponent('/') --> "%2F"
encodeURIComponent('\') --> Uncaught SyntaxError: Invalid or unexpected token
xss
cross-site scripting，跨站腳本支竹，屬于代碼注入的一種。它允許惡意用戶將代碼注入到網(wǎng)頁上鸠按，其他用戶在觀看網(wǎng)頁時(shí)就會(huì)受到影響礼搁。這類攻擊通常包含了html以及用戶端腳本語言。
攻擊實(shí)例：用戶A提交表單事加入類似以下代碼目尖，如果提交表單時(shí)沒有做檢測(cè)馒吴，而之后的結(jié)果頁面是其他用戶也能看到的，那么其他頁面看到的結(jié)果頁就會(huì)受到影響。
<script>
document.write('...')
</script>
解決辦法：不信賴用戶輸入饮戳，對(duì)特殊字符如”<”,”>”轉(zhuǎn)義豪治。
uri url
uri:統(tǒng)一資源標(biāo)識(shí)符
url:統(tǒng)一資源定位符
url與urn是uri的子集。
讓uri能成為url的是那個(gè)“訪問機(jī)制”扯罐，“網(wǎng)絡(luò)位置”负拟。e.g. http:// or ftp://.。
urn是唯一標(biāo)識(shí)的一部分歹河，就是一個(gè)特殊的名字掩浙。
etag是什么
鑒于http很重要，深化下對(duì)http的認(rèn)識(shí)
一級(jí)域名秸歧，二級(jí)域名
以www.baidu.com為例子
最右邊一個(gè)點(diǎn)右邊的為頂級(jí)域名（一級(jí)域名）com
一級(jí)域名左邊是二級(jí)域名 baidu
主域厨姚，子域
子域名域名系統(tǒng)等級(jí)中，屬于更高一層域的域键菱。比如谬墙，mail.example.com
和calendar.example.com是example.com的兩個(gè)子域，而example.com
則是頂級(jí)域.com的子域
非技術(shù)問題
為什么換工作
不要說是因?yàn)殄X少经备。上一家的薪資不要做假拭抬，因?yàn)楣究赡軙?huì)查。期望薪資可以要高點(diǎn)弄喘，說明原因玖喘，可能上家工資發(fā)放不合理之類的。
