$HTML拆内， HTTP，web綜合問題
1宠默、前端需要注意哪些SEO
3矛纹、HTTP的幾種請(qǐng)求方法用途
4、從瀏覽器地址欄輸入url到顯示頁面的步驟
5光稼、如何進(jìn)行網(wǎng)站性能優(yōu)化
6、HTTP狀態(tài)碼及其含義
7孩等、語義化的理解
8艾君、介紹一下你對(duì)瀏覽器內(nèi)核的理解
9、html5有哪些新特性肄方、移除了那些元素冰垄？
10、HTML5的離線儲(chǔ)存怎么使用权她，工作原理能不能解釋一下虹茶？
11、瀏覽器是怎么對(duì)HTML5的離線儲(chǔ)存資源進(jìn)行管理和加載的呢
12隅要、請(qǐng)描述一下?cookies蝴罪，sessionStorage?和?localStorage?的區(qū)別
13、iframe有那些缺點(diǎn)步清？
14要门、WEB標(biāo)準(zhǔn)以及W3C標(biāo)準(zhǔn)是什么?
15、xhtml和html有什么區(qū)別?
16廓啊、Doctype作用? 嚴(yán)格模式與混雜模式如何區(qū)分欢搜？它們有何意義?
17、行內(nèi)元素有哪些谴轮？塊級(jí)元素有哪些炒瘟？ 空(void)元素有那些？行內(nèi)元素和塊級(jí)元素有什么區(qū)別第步？
18疮装、HTML全局屬性(global attribute)有哪些
19、Canvas和SVG有什么區(qū)別雌续？
20斩个、HTML5?為什么只需要寫?？
21驯杜、如何在頁面上實(shí)現(xiàn)一個(gè)圓形的可點(diǎn)擊區(qū)域受啥？
22、網(wǎng)頁驗(yàn)證碼是干嘛的，是為了解決什么安全問題
1滚局、css sprite是什么,有什么優(yōu)缺點(diǎn)
2居暖、display: none;與visibility: hidden;的區(qū)別
3、link與@import的區(qū)別
4藤肢、什么是FOUC?如何避免
5太闺、如何創(chuàng)建塊級(jí)格式化上下文(block formatting context),BFC有什么用
7、清除浮動(dòng)的幾種方式嘁圈，各自的優(yōu)缺點(diǎn)
8省骂、為什么要初始化CSS樣式?
9、css3有哪些新特性
10最住、display有哪些值钞澳？說明他們的作用
11、介紹一下標(biāo)準(zhǔn)的CSS的盒子模型涨缚？低版本IE的盒子模型有什么不同的轧粟？
12、CSS優(yōu)先級(jí)算法如何計(jì)算脓魏？
13兰吟、對(duì)BFC規(guī)范的理解？
14茂翔、談?wù)劯?dòng)和清除浮動(dòng)
15混蔼、position的值，?relative和absolute`定位原點(diǎn)是
16檩电、display:inline-block?什么時(shí)候不會(huì)顯示間隙拄丰？(攜程)
17、PNG,GIF,JPG的區(qū)別及如何選
18俐末、行內(nèi)元素float:left后是否變?yōu)閴K級(jí)元素料按？
19、在網(wǎng)頁中的應(yīng)該使用奇數(shù)還是偶數(shù)的字體卓箫？為什么呢载矿？
20、::before?和?:after中雙冒號(hào)和單冒號(hào)有什么區(qū)別烹卒？解釋一下這2個(gè)偽元素的作用
21闷盔、如果需要手動(dòng)寫動(dòng)畫，你認(rèn)為最小時(shí)間間隔是多久旅急，為什么逢勾？（阿里）
22、CSS合并方法
23藐吮、CSS不同選擇器的權(quán)重(CSS層疊的規(guī)則)
24溺拱、列出你所知道可以改變頁面布局的屬性
25逃贝、CSS在性能優(yōu)化方面的實(shí)踐
26、CSS3動(dòng)畫（簡單動(dòng)畫的實(shí)現(xiàn)迫摔，如旋轉(zhuǎn)等）
27沐扳、base64的原理及優(yōu)缺點(diǎn)
1、閉包
2句占、說說你對(duì)作用域鏈的理解
3沪摄、JavaScript原型，原型鏈 ? 有什么特點(diǎn)纱烘？
4杨拐、請(qǐng)解釋什么是事件代理
5、Javascript如何實(shí)現(xiàn)繼承擂啥？
6戏阅、談?wù)凾his對(duì)象的理解
7、事件模型
8啤它、new操作符具體干了什么呢?
9、Ajax原理
11舱痘、模塊化開發(fā)怎么做变骡？
12、異步加載JS的方式有哪些芭逝？
13塌碌、那些操作會(huì)造成內(nèi)存泄漏？
14旬盯、XML和JSON的區(qū)別台妆？
15、談?wù)勀銓?duì)webpack的看法
17胖翰、常見web安全及防護(hù)原理
18接剩、用過哪些設(shè)計(jì)模式？
19萨咳、為什么要有同源限制懊缺？
20、offsetWidth/offsetHeight,clientWidth/clientHeight與scrollWidth/scrollHeight的區(qū)別
21培他、javascript有哪些方法定義對(duì)象
22鹃两、常見兼容性問題？
22礁击、說說你對(duì)promise的了解
23灼擂、你覺得jQuery源碼有哪些寫的好的地方
25覆糟、Node的應(yīng)用場(chǎng)景
26、談?wù)勀銓?duì)AMD馋记、CMD的理解
27号坡、那些操作會(huì)造成內(nèi)存泄漏？
28抗果、web開發(fā)中會(huì)話跟蹤的方法有哪些
29筋帖、介紹js的基本數(shù)據(jù)類型
30、介紹js有哪些內(nèi)置對(duì)象冤馏？
31日麸、說幾條寫JavaScript的基本規(guī)范？
32逮光、JavaScript有幾種類型的值代箭？，你能畫一下他們的內(nèi)存圖嗎涕刚？
33嗡综、javascript創(chuàng)建對(duì)象的幾種方式？
34杜漠、eval是做什么的极景？
35、null驾茴，undefined?的區(qū)別盼樟？
36、[“1”, “2”, “3”].map(parseInt)?答案是多少锈至？
37晨缴、javascript?代碼中的”use strict”;是什么意思 ? 使用它區(qū)別是什么？
38峡捡、JSON的了解击碗？
39、js延遲加載的方式有哪些们拙？
40稍途、同步和異步的區(qū)別?
41、漸進(jìn)增強(qiáng)和優(yōu)雅降級(jí)
42砚婆、defer和async
43晰房、說說嚴(yán)格模式的限制
44、attribute和property的區(qū)別是什么射沟？
45殊者、談?wù)勀銓?duì)ES6的理解
46、ECMAScript6?怎么寫class么验夯，為什么會(huì)出現(xiàn)class這種東西?
47猖吴、什么是面向?qū)ο缶幊碳懊嫦蜻^程編程，它們的異同和優(yōu)缺點(diǎn)
48挥转、從你自己的理解來看海蔽，你是如何理解面向?qū)ο缶幊痰墓睬鉀Q了什么問題，有什么作用
49党窜、對(duì)web標(biāo)準(zhǔn)拗引、可用性、可訪問性的理解
1幌衣、寫一個(gè)通用的事件偵聽器函數(shù)
2矾削、如何判斷一個(gè)對(duì)象是否為數(shù)組
3、冒泡排序
4豁护、快速排序
5哼凯、編寫一個(gè)方法 求一個(gè)字符串的字節(jié)長度
1、談?wù)勀銓?duì)重構(gòu)的理解
2楚里、什么樣的前端代碼是好的
3断部、對(duì)前端工程師這個(gè)職位是怎么樣理解的？它的前景會(huì)怎么樣班缎？
4蝴光、你覺得前端工程的價(jià)值體現(xiàn)在哪
5、平時(shí)如何管理你的項(xiàng)目达址？
面試完你還有什么問題要問的嗎
你有什么愛好?
你最大的優(yōu)點(diǎn)和缺點(diǎn)是什么?
你為什么會(huì)選擇這個(gè)行業(yè)虱疏，職位?
你覺得你適合從事這個(gè)崗位嗎?
你有什么職業(yè)規(guī)劃?
你對(duì)工資有什么要求?
如何看待前端開發(fā)？
未來三到五年的規(guī)劃是怎樣的苏携？
自我介紹
你的項(xiàng)目中技術(shù)難點(diǎn)是什么？遇到了什么問題对粪？你是怎么解決的右冻？
你認(rèn)為哪個(gè)項(xiàng)目做得最好？
最近在看哪些前端方面的書著拭？
平時(shí)是如何學(xué)習(xí)前端開發(fā)的纱扭？
你最有成就感的一件事
你是怎么學(xué)習(xí)前端的
合理的title、description鄙币、keywords：搜索對(duì)著三項(xiàng)的權(quán)重逐個(gè)減小肃叶，title值強(qiáng)調(diào)重點(diǎn)即可，重要關(guān)鍵詞出現(xiàn)不要超過2次十嘿，而且要靠前因惭，不同頁面title要有所不同；description把頁面內(nèi)容高度概括绩衷，長度合適蹦魔，不可過分堆砌關(guān)鍵詞激率，不同頁面description有所不同；keywords列舉出重要關(guān)鍵詞即可
語義化的HTML代碼勿决，符合W3C規(guī)范：語義化代碼讓搜索引擎容易理解網(wǎng)頁
重要內(nèi)容HTML代碼放在最前：搜索引擎抓取HTML順序是從上到下乒躺，有的搜索引擎對(duì)抓取長度有限制，保證重要內(nèi)容一定會(huì)被抓取
重要內(nèi)容不要用js輸出：爬蟲不會(huì)執(zhí)行js獲取內(nèi)容
少用iframe：搜索引擎不會(huì)抓取iframe中的內(nèi)容
非裝飾性圖片必須加alt
提高網(wǎng)站速度：網(wǎng)站速度是搜索引擎排序的一個(gè)重要指標(biāo)
通常當(dāng)鼠標(biāo)滑動(dòng)到元素上的時(shí)候顯示
1嘉冒、GET方法
發(fā)送一個(gè)請(qǐng)求來取得服務(wù)器上的某一資源
2、POST方法
向URL指定的資源提交數(shù)據(jù)或附加新的數(shù)據(jù)
3表制、PUT方法
跟POST方法很像健爬，也是想服務(wù)器提交數(shù)據(jù)。但是么介，它們之間有不同娜遵。PUT指定了資源在服務(wù)器上的位置，而POST沒有
4壤短、HEAD方法
只請(qǐng)求頁面的首部
5设拟、DELETE方法
刪除服務(wù)器上的某資源
6、OPTIONS方法
它用于獲取當(dāng)前URL所支持的方法久脯。如果請(qǐng)求成功纳胧，會(huì)有一個(gè)Allow的頭包含類似“GET,POST”這樣的信息
7、TRACE方法
TRACE方法被用于激發(fā)一個(gè)遠(yuǎn)程的帘撰，應(yīng)用層的請(qǐng)求消息回路
8跑慕、CONNECT方法
把請(qǐng)求連接轉(zhuǎn)換到透明的TCP/IP通道
瀏覽器根據(jù)請(qǐng)求的URL交給DNS域名解析摧找，找到真實(shí)IP核行，向服務(wù)器發(fā)起請(qǐng)求；
服務(wù)器交給后臺(tái)處理完成后返回?cái)?shù)據(jù)蹬耘，瀏覽器接收文件（HTML芝雪、JS、CSS综苔、圖象等）惩系；
瀏覽器對(duì)加載到的資源（HTML、JS如筛、CSS等）進(jìn)行語法解析堡牡，建立相應(yīng)的內(nèi)部數(shù)據(jù)結(jié)構(gòu)（如HTML的DOM）；
載入解析到的資源文件杨刨，渲染頁面悴侵，完成。
5拭嫁、如何進(jìn)行網(wǎng)站性能優(yōu)化
content方面
減少HTTP請(qǐng)求：合并文件可免、CSS精靈抓于、inline Image
減少DNS查詢：DNS緩存、將資源分布到恰當(dāng)數(shù)量的主機(jī)名
減少DOM元素?cái)?shù)量
Server方面
使用CDN
配置ETag
對(duì)組件使用Gzip壓縮
Cookie方面
減小cookie大小
css方面
將樣式表放到頁面頂部
不使用CSS表達(dá)式
使用不使用@import
Javascript方面
將腳本放到頁面底部
將javascript和css從外部引入
壓縮javascript和css
刪除不需要的腳本
減少DOM訪問
圖片方面
優(yōu)化圖片：根據(jù)實(shí)際顏色需要選擇色深浇借、壓縮
優(yōu)化css精靈
不要在HTML中拉伸圖片
1XX：信息狀態(tài)碼
100 Continue?繼續(xù)，一般在發(fā)送post請(qǐng)求時(shí)妇垢，已發(fā)送了http header之后服務(wù)端將返回此信息巾遭，表示確認(rèn)，之后發(fā)送具體參數(shù)信息
2XX：成功狀態(tài)碼
200 OK?正常返回信息
201 Created?請(qǐng)求成功并且服務(wù)器創(chuàng)建了新的資源
202 Accepted?服務(wù)器已接受請(qǐng)求闯估，但尚未處理
3XX：重定向
301 Moved Permanently?請(qǐng)求的網(wǎng)頁已永久移動(dòng)到新位置灼舍。
302 Found?臨時(shí)性重定向。
303 See Other?臨時(shí)性重定向涨薪，且總是使用?GET?請(qǐng)求新的?URI骑素。
304 Not Modified?自從上次請(qǐng)求后，請(qǐng)求的網(wǎng)頁未修改過刚夺。
4XX：客戶端錯(cuò)誤
400 Bad Request?服務(wù)器無法理解請(qǐng)求的格式献丑，客戶端不應(yīng)當(dāng)嘗試再次使用相同的內(nèi)容發(fā)起請(qǐng)求。
401 Unauthorized?請(qǐng)求未授權(quán)侠姑。
403 Forbidden?禁止訪問创橄。
404 Not Found?找不到如何與?URI?相匹配的資源。
5XX:?服務(wù)器錯(cuò)誤
500 Internal Server Error?最常見的服務(wù)器端錯(cuò)誤莽红。
503 Service Unavailable?服務(wù)器端暫時(shí)無法處理請(qǐng)求（可能是過載或維護(hù)）妥畏。
用正確的標(biāo)簽做正確的事情安吁！
html語義化就是讓頁面的內(nèi)容結(jié)構(gòu)化醉蚁，便于對(duì)瀏覽器、搜索引擎解析柳畔；
在沒有樣式CSS情況下也以一種文檔格式顯示，并且是容易閱讀的郭赐。
搜索引擎的爬蟲依賴于標(biāo)記來確定上下文和各個(gè)關(guān)鍵字的權(quán)重薪韩，利于?SEO。
使閱讀源代碼的人對(duì)網(wǎng)站更容易將網(wǎng)站分塊捌锭，便于閱讀維護(hù)理解
主要分成兩部分：渲染引擎(layout engineer或Rendering Engine)和JS引擎
渲染引擎：負(fù)責(zé)取得網(wǎng)頁的內(nèi)容（HTML观谦、XML拉盾、圖像等等）、整理訊息（例如加入CSS等）豁状，以及計(jì)算網(wǎng)頁的顯示方式捉偏，然后會(huì)輸出至顯示器或打印機(jī)倒得。瀏覽器的內(nèi)核的不同對(duì)于網(wǎng)頁的語法解釋會(huì)有不同，所以渲染的效果也不相同夭禽。所有網(wǎng)頁瀏覽器霞掺、電子郵件客戶端以及其它需要編輯、顯示網(wǎng)絡(luò)內(nèi)容的應(yīng)用程序都需要內(nèi)核
JS引擎則：解析和執(zhí)行javascript來實(shí)現(xiàn)網(wǎng)頁的動(dòng)態(tài)效果
最開始渲染引擎和JS引擎并沒有區(qū)分的很明確讹躯，后來JS引擎越來越獨(dú)立菩彬，內(nèi)核就傾向于只指渲染引擎
HTML5?現(xiàn)在已經(jīng)不是?SGML?的子集，主要是關(guān)于圖像秉馏，位置耙旦，存儲(chǔ)，多任務(wù)等功能的增加
繪畫?canvas
用于媒介回放的?video?和?audio?元素
本地離線存儲(chǔ)?localStorage?長期存儲(chǔ)數(shù)據(jù)沃饶，瀏覽器關(guān)閉后數(shù)據(jù)不丟失
sessionStorage?的數(shù)據(jù)在瀏覽器關(guān)閉后自動(dòng)刪除
語意化更好的內(nèi)容元素母廷，比如article、footer糊肤、header琴昆、nav、section
表單控件馆揉，calendar业舍、date、time升酣、email舷暮、url、search
新的技術(shù)webworker,?websocket,?Geolocation
移除的元素：
純表現(xiàn)的元素：basefont噩茄，big下面，center，font,?s绩聘，strike沥割，tt，u`
對(duì)可用性產(chǎn)生負(fù)面影響的元素：frame凿菩，frameset机杜，noframes
支持HTML5新標(biāo)簽：
IE8/IE7/IE6支持通過document.createElement方法產(chǎn)生的標(biāo)簽
可以利用這一特性讓這些瀏覽器支持HTML5新標(biāo)簽
瀏覽器支持新標(biāo)簽后，還需要添加標(biāo)簽?zāi)J(rèn)的樣式
當(dāng)然也可以直接使用成熟的框架衅谷、比如html5shim
10椒拗、HTML5的離線儲(chǔ)存怎么使用，工作原理能不能解釋一下？
在用戶沒有與因特網(wǎng)連接時(shí)蚀苛，可以正常訪問站點(diǎn)或應(yīng)用在验，在用戶與因特網(wǎng)連接時(shí)，更新用戶機(jī)器上的緩存文件
原理：HTML5的離線存儲(chǔ)是基于一個(gè)新建的.appcache文件的緩存機(jī)制(不是存儲(chǔ)技術(shù))枉阵，通過這個(gè)文件上的解析清單離線存儲(chǔ)資源译红，這些資源就會(huì)像cookie一樣被存儲(chǔ)了下來。之后當(dāng)網(wǎng)絡(luò)在處于離線狀態(tài)下時(shí)兴溜，瀏覽器會(huì)通過被離線存儲(chǔ)的數(shù)據(jù)進(jìn)行頁面展示
如何使用：
頁面頭部像下面一樣加入一個(gè)manifest的屬性侦厚；
在cache.manifest文件的編寫離線存儲(chǔ)的資源
在離線狀態(tài)時(shí)，操作window.applicationCache進(jìn)行需求實(shí)現(xiàn)
CACHEMANIFEST#v0.11CACHE:js/app.jscss/style.cssNETWORK:resourse/logo.pngFALLBACK://offline.html
11拙徽、瀏覽器是怎么對(duì)HTML5的離線儲(chǔ)存資源進(jìn)行管理和加載的呢
在線的情況下刨沦，瀏覽器發(fā)現(xiàn)html頭部有manifest屬性，它會(huì)請(qǐng)求manifest文件膘怕，如果是第一次訪問app想诅，那么瀏覽器就會(huì)根據(jù)manifest文件的內(nèi)容下載相應(yīng)的資源并且進(jìn)行離線存儲(chǔ)。如果已經(jīng)訪問過app并且資源已經(jīng)離線存儲(chǔ)了岛心，那么瀏覽器就會(huì)使用離線的資源加載頁面来破，然后瀏覽器會(huì)對(duì)比新的manifest文件與舊的manifest文件，如果文件沒有發(fā)生改變忘古，就不做任何操作徘禁，如果文件改變了，那么就會(huì)重新下載文件中的資源并進(jìn)行離線存儲(chǔ)髓堪。
離線的情況下送朱，瀏覽器就直接使用離線存儲(chǔ)的資源。
12干旁、請(qǐng)描述一下?cookies驶沼，sessionStorage?和?localStorage?的區(qū)別？
cookie是網(wǎng)站為了標(biāo)示用戶身份而儲(chǔ)存在用戶本地終端（Client Side）上的數(shù)據(jù)（通常經(jīng)過加密）
cookie數(shù)據(jù)始終在同源的http請(qǐng)求中攜帶（即使不需要）争群，記會(huì)在瀏覽器和服務(wù)器間來回傳遞
sessionStorage和localStorage不會(huì)自動(dòng)把數(shù)據(jù)發(fā)給服務(wù)器回怜，僅在本地保存
存儲(chǔ)大小：
cookie數(shù)據(jù)大小不能超過4k
sessionStorage和localStorage雖然也有存儲(chǔ)大小的限制换薄，但比cookie大得多玉雾，可以達(dá)到5M或更大
有期時(shí)間：
localStorage?存儲(chǔ)持久數(shù)據(jù)，瀏覽器關(guān)閉后數(shù)據(jù)不丟失除非主動(dòng)刪除數(shù)據(jù)
sessionStorage?數(shù)據(jù)在當(dāng)前瀏覽器窗口關(guān)閉后自動(dòng)刪除
cookie?設(shè)置的cookie過期時(shí)間之前一直有效专控，即使窗口或?yàn)g覽器關(guān)閉
iframe會(huì)阻塞主頁面的Onload事件
搜索引擎的檢索程序無法解讀這種頁面伦腐，不利于SEO
iframe和主頁面共享連接池，而瀏覽器對(duì)相同域的連接有限制失都，所以會(huì)影響頁面的并行加載
使用iframe之前需要考慮這兩個(gè)缺點(diǎn)柏蘑。如果需要使用iframe幸冻，最好是通過javascript動(dòng)態(tài)給iframe添加src屬性值，這樣可以繞開以上兩個(gè)問題
14咳焚、WEB標(biāo)準(zhǔn)以及W3C標(biāo)準(zhǔn)是什么?
標(biāo)簽閉合洽损、標(biāo)簽小寫、不亂嵌套革半、使用外鏈css和js碑定、結(jié)構(gòu)行為表現(xiàn)的分離
一個(gè)是功能上的差別
主要是XHTML可兼容各大瀏覽器又官、手機(jī)以及PDA延刘，并且瀏覽器也能快速正確地編譯網(wǎng)頁
另外是書寫習(xí)慣的差別
XHTML?元素必須被正確地嵌套，閉合六敬，區(qū)分大小寫碘赖，文檔必須擁有根元素
16、Doctype作用? 嚴(yán)格模式與混雜模式如何區(qū)分外构？它們有何意義?
頁面被加載的時(shí)普泡，link會(huì)同時(shí)被加載，而@imort頁面被加載的時(shí)审编，link會(huì)同時(shí)被加載撼班，而@import引用的CSS會(huì)等到頁面被加載完再加載?import只在IE5以上才能識(shí)別，而link是XHTML標(biāo)簽割笙，無兼容問題?link方式的樣式的權(quán)重 高于@import的權(quán)重
?聲明位于文檔中的最前面权烧，處于??標(biāo)簽之前。告知瀏覽器的解析器伤溉， 用什么文檔類型 規(guī)范來解析這個(gè)文檔
嚴(yán)格模式的排版和?JS?運(yùn)作模式是 以該瀏覽器支持的最高標(biāo)準(zhǔn)運(yùn)行
在混雜模式中般码，頁面以寬松的向后兼容的方式顯示。模擬老式瀏覽器的行為以防止站點(diǎn)無法工作乱顾。?DOCTYPE不存在或格式不正確會(huì)導(dǎo)致文檔以混雜模式呈現(xiàn)
17板祝、行內(nèi)元素有哪些？塊級(jí)元素有哪些走净？ 空(void)元素有那些券时？行內(nèi)元素和塊級(jí)元素有什么區(qū)別？
行內(nèi)元素有：a b span img input select strong
塊級(jí)元素有：div ul ol li dl dt dd h1 h2 h3 h4…p
行內(nèi)元素不可以設(shè)置寬高伏伯，不獨(dú)占一行
塊級(jí)元素可以設(shè)置寬高橘洞，獨(dú)占一行
18、HTML全局屬性(global attribute)有哪些
class:為元素設(shè)置類標(biāo)識(shí)
data-*: 為元素增加自定義屬性
draggable: 設(shè)置元素是否可拖拽
id: 元素id说搅，文檔內(nèi)唯一
lang: 元素內(nèi)容的的語言
style: 行內(nèi)css樣式
title: 元素相關(guān)的建議信息
svg繪制出來的每一個(gè)圖形的元素都是獨(dú)立的DOM節(jié)點(diǎn)，能夠方便的綁定事件或用來修改适肠。canvas輸出的是一整幅畫布
svg輸出的圖形是矢量圖形霍衫，后期可以修改參數(shù)來自由放大縮小，不會(huì)是真和鋸齒侯养。而canvas輸出標(biāo)量畫布敦跌，就像一張圖片一樣，放大會(huì)失真或者鋸齒
HTML5?不基于?SGML，因此不需要對(duì)DTD進(jìn)行引用辩稽，但是需要doctype來規(guī)范瀏覽器的行為
而HTML4.01基于SGML,所以需要對(duì)DTD進(jìn)行引用携兵，才能告知瀏覽器文檔所使用的文檔類型
21、如何在頁面上實(shí)現(xiàn)一個(gè)圓形的可點(diǎn)擊區(qū)域？
svg
border-radius
純js實(shí)現(xiàn) 需要求一個(gè)點(diǎn)在不在圓上簡單算法、獲取鼠標(biāo)坐標(biāo)等等
22糕殉、網(wǎng)頁驗(yàn)證碼是干嘛的锹杈，是為了解決什么安全問題
區(qū)分用戶是計(jì)算機(jī)還是人的公共全自動(dòng)程序。可以防止惡意破解密碼、刷票、論壇灌水
有效防止黑客對(duì)某一個(gè)特定注冊(cè)用戶用特定程序暴力破解方式進(jìn)行不斷的登陸嘗試
1嘲碧、css sprite是什么,有什么優(yōu)缺點(diǎn)
概念：將多個(gè)小圖片拼接到一個(gè)圖片中。通過background-position和元素尺寸調(diào)節(jié)需要顯示的背景圖案父阻。
優(yōu)點(diǎn)：
減少HTTP請(qǐng)求數(shù)愈涩，極大地提高頁面加載速度
增加圖片信息重復(fù)度，提高壓縮比加矛，減少圖片大小
更換風(fēng)格方便履婉，只需在一張或幾張圖片上修改顏色或樣式即可實(shí)現(xiàn)
缺點(diǎn)：
圖片合并麻煩
維護(hù)麻煩，修改一個(gè)圖片可能需要從新布局整個(gè)圖片斟览，樣式
2毁腿、display: none;與visibility: hidden;的區(qū)別
聯(lián)系：它們都能讓元素不可見
區(qū)別：
display:none;會(huì)讓元素完全從渲染樹中消失，渲染的時(shí)候不占據(jù)任何空間苛茂；visibility: hidden;不會(huì)讓元素從渲染樹消失已烤，渲染師元素繼續(xù)占據(jù)空間，只是內(nèi)容不可見
display: none;是非繼承屬性妓羊，子孫節(jié)點(diǎn)消失由于元素從渲染樹消失造成胯究，通過修改子孫節(jié)點(diǎn)屬性無法顯示；visibility: hidden;是繼承屬性躁绸，子孫節(jié)點(diǎn)消失由于繼承了hidden裕循，通過設(shè)置visibility: visible;可以讓子孫節(jié)點(diǎn)顯式
修改常規(guī)流中元素的display通常會(huì)造成文檔重排丙猬。修改visibility屬性只會(huì)造成本元素的重繪。
讀屏器不會(huì)讀取display: none;元素內(nèi)容费韭；會(huì)讀取visibility: hidden;元素內(nèi)容
link是HTML方式庭瑰，?@import是CSS方式
link最大限度支持并行下載星持，@import過多嵌套導(dǎo)致串行下載，出現(xiàn)FOUC
link可以通過rel="alternate stylesheet"指定候選樣式
瀏覽器對(duì)link支持早于@import弹灭，可以使用@import對(duì)老瀏覽器隱藏樣式
@import必須在樣式規(guī)則之前督暂，可以在css文件中引用其他文件
總體來說：link優(yōu)于@import
Flash Of Unstyled Content：用戶定義樣式表加載之前瀏覽器使用默認(rèn)樣式顯示文檔穷吮，用戶樣式加載渲染之后再從新顯示文檔逻翁，造成頁面閃爍。
解決方法：把樣式表放到文檔的head
5捡鱼、如何創(chuàng)建塊級(jí)格式化上下文(block formatting context),BFC有什么用
創(chuàng)建規(guī)則：
根元素
浮動(dòng)元素（float不是none）
絕對(duì)定位元素（position取值為absolute或fixed）
display取值為inline-block,table-cell,?table-caption,flex,?inline-flex之一的元素
overflow不是visible的元素
作用：
可以包含浮動(dòng)元素
不被浮動(dòng)元素覆蓋
阻止父子元素的margin折疊
6八回、display,float,position的關(guān)系
如果display為none，那么position和float都不起作用驾诈，這種情況下元素不產(chǎn)生框
否則缠诅，如果position值為absolute或者fixed，框就是絕對(duì)定位的乍迄，float的計(jì)算值為none管引，display根據(jù)下面的表格進(jìn)行調(diào)整。
否則闯两，如果float不是none褥伴，框是浮動(dòng)的，display根據(jù)下表進(jìn)行調(diào)整
否則漾狼，如果元素是根元素重慢，display根據(jù)下表進(jìn)行調(diào)整
其他情況下display的值為指定值
總結(jié)起來：絕對(duì)定位、浮動(dòng)逊躁、根元素都需要調(diào)整display
7伤锚、清除浮動(dòng)的幾種方式，各自的優(yōu)缺點(diǎn)
父級(jí)div定義height
結(jié)尾處加空div標(biāo)簽clear:both
父級(jí)div定義偽類:after和zoom
父級(jí)div定義overflow:hidden
父級(jí)div也浮動(dòng)志衣，需要定義寬度
結(jié)尾處加br標(biāo)簽clear:both
比較好的是第3種方式屯援，好多網(wǎng)站都這么用
因?yàn)闉g覽器的兼容問題念脯，不同瀏覽器對(duì)有些標(biāo)簽的默認(rèn)值是不同的狞洋，如果沒對(duì)CSS初始化往往會(huì)出現(xiàn)瀏覽器之間的頁面顯示差異。
當(dāng)然绿店，初始化樣式會(huì)對(duì)SEO有一定的影響吉懊，但魚和熊掌不可兼得庐橙，但力求影響最小的情況下初始化
新增各種css選擇器
圓角?border-radius
多列布局
陰影和反射
文字特效text-shadow
線性漸變
旋轉(zhuǎn)transform
CSS3新增偽類有那些借嗽？
p:first-of-type?選擇屬于其父元素的首個(gè)
元素的每個(gè)
?元素态鳖。
p:last-of-type?選擇屬于其父元素的最后?
?元素的每個(gè)
?元素。
p:only-of-type?選擇屬于其父元素唯一的?
元素的每個(gè)?
?元素恶导。
p:only-child?選擇屬于其父元素的唯一子元素的每個(gè)?
?元素浆竭。
p:nth-child(2)?選擇屬于其父元素的第二個(gè)子元素的每個(gè)?
?元素。
:after?在元素之前添加內(nèi)容,也可以用來做清除浮動(dòng)惨寿。
:before?在元素之后添加內(nèi)容
:enabled
:disabled?控制表單控件的禁用狀態(tài)邦泄。
:checked?單選框或復(fù)選框被選中
block?象塊類型元素一樣顯示顺囊。
none?缺省值。象行內(nèi)元素類型一樣顯示蕉拢。
inline-block?象行內(nèi)元素一樣顯示特碳，但其內(nèi)容象塊類型元素一樣顯示。
list-item?象塊類型元素一樣顯示晕换，并添加樣式列表標(biāo)記测萎。
table?此元素會(huì)作為塊級(jí)表格來顯示
inherit?規(guī)定應(yīng)該從父元素繼承?display?屬性的值
11、介紹一下標(biāo)準(zhǔn)的CSS的盒子模型届巩？低版本IE的盒子模型有什么不同的硅瞧？
有兩種，?IE盒子模型恕汇、W3C盒子模型腕唧；
盒模型： 內(nèi)容(content)、填充(padding)瘾英、邊界(margin)枣接、 邊框(border)；
區(qū) 別：?IE的content部分把?border?和?padding計(jì)算了進(jìn)去;
12缺谴、CSS優(yōu)先級(jí)算法如何計(jì)算但惶？
優(yōu)先級(jí)就近原則，同權(quán)重情況下樣式定義最近者為準(zhǔn)
載入樣式以最后載入的定位為準(zhǔn)
優(yōu)先級(jí)為:?!important > id > class > tag?important?比 內(nèi)聯(lián)優(yōu)先級(jí)高
它決定了元素如何對(duì)其內(nèi)容進(jìn)行定位,以及與其他元素的關(guān)系和相互作用
浮動(dòng)的框可以向左或向右移動(dòng)阳啥，直到他的外邊緣碰到包含框或另一個(gè)浮動(dòng)框的邊框?yàn)橹固硪辍Ｓ捎诟?dòng)框不在文檔的普通流中，所以文檔的普通流的塊框表現(xiàn)得就像浮動(dòng)框不存在一樣察迟。浮動(dòng)的塊框會(huì)漂浮在文檔普通流的塊框上
15斩狱、position的值耳高， relative和absolute定位原點(diǎn)是
absolute：生成絕對(duì)定位的元素，相對(duì)于?static?定位以外的第一個(gè)父元素進(jìn)行定位
fixed：生成絕對(duì)定位的元素所踊，相對(duì)于瀏覽器窗口進(jìn)行定位
relative：生成相對(duì)定位的元素泌枪，相對(duì)于其正常位置進(jìn)行定位
static?默認(rèn)值。沒有定位秕岛，元素出現(xiàn)在正常的流中
inherit?規(guī)定從父元素繼承?position?屬性的值
16碌燕、display:inline-block 什么時(shí)候不會(huì)顯示間隙？(攜程)
移除空格
使用margin負(fù)值
使用font-size:0
letter-spacing
word-spacing
GIF
8位像素，256色
無損壓縮
支持簡單動(dòng)畫
支持boolean透明
適合簡單動(dòng)畫
JPEG
顏色限于256
有損壓縮
可控制壓縮質(zhì)量
不支持透明
適合照片
PNG
有PNG8和truecolor PNG
PNG8類似GIF顏色上限為256雷厂，文件小惋增，支持alpha透明度，無動(dòng)畫
適合圖標(biāo)改鲫、背景诈皿、按鈕
18、行內(nèi)元素float:left后是否變?yōu)閴K級(jí)元素像棘？
浮動(dòng)后稽亏，行內(nèi)元素不會(huì)成為塊狀元素，但是可以設(shè)置寬高缕题。行內(nèi)元素要想變成塊狀元素截歉，占一行，直接設(shè)置display:block;烟零。但如果元素設(shè)置了浮動(dòng)后再設(shè)置display:block;那就不會(huì)占一行瘪松。
19、在網(wǎng)頁中的應(yīng)該使用奇數(shù)還是偶數(shù)的字體锨阿？為什么呢宵睦？
偶數(shù)字號(hào)相對(duì)更容易和 web 設(shè)計(jì)的其他部分構(gòu)成比例關(guān)系
20、::before 和 :after中雙冒號(hào)和單冒號(hào) 有什么區(qū)別墅诡？解釋一下這2個(gè)偽元素的作用
單冒號(hào)(:)用于CSS3偽類壳嚎，雙冒號(hào)(::)用于CSS3偽元素
用于區(qū)分偽類和偽元素
21、如果需要手動(dòng)寫動(dòng)畫末早，你認(rèn)為最小時(shí)間間隔是多久烟馅，為什么？（阿里）
多數(shù)顯示器默認(rèn)頻率是60Hz然磷，即1秒刷新60次焙糟，所以理論上最小間隔為1/60＊1000ms ＝ 16.7ms
避免使用@import引入多個(gè)css文件样屠，可以使用CSS工具將CSS合并為一個(gè)CSS文件穿撮，例如使用Sass\Compass等
23缺脉、CSS不同選擇器的權(quán)重(CSS層疊的規(guī)則)
！important規(guī)則最重要悦穿，大于其它規(guī)則
行內(nèi)樣式規(guī)則攻礼，加1000
對(duì)于選擇器中給定的各個(gè)ID屬性值，加100
對(duì)于選擇器中給定的各個(gè)類屬性栗柒、屬性選擇器或者偽類選擇器礁扮，加10
對(duì)于選擇其中給定的各個(gè)元素標(biāo)簽選擇器，加1
如果權(quán)值一樣瞬沦，則按照樣式規(guī)則的先后順序來應(yīng)用太伊，順序靠后的覆蓋靠前的規(guī)則
position逛钻、display僚焦、float、width曙痘、height芳悲、margin、padding边坤、top名扛、left、right茧痒、`
css壓縮與合并、Gzip壓縮
css文件放在head里旺订、不要用@import
盡量用縮寫惹苗、避免用濾鏡、合理使用選擇器
26耸峭、CSS3動(dòng)畫（簡單動(dòng)畫的實(shí)現(xiàn)桩蓉，如旋轉(zhuǎn)等）
依靠CSS3中提出的三個(gè)屬性：transition、transform劳闹、animation
transition：定義了元素在變化過程中是怎么樣的院究，包含transition-property、transition-duration本涕、transition-timing-function业汰、transition-delay。
transform：定義元素的變化結(jié)果菩颖，包含rotate样漆、scale、skew晦闰、translate放祟。
animation：動(dòng)畫定義了動(dòng)作的每一幀（@keyframes）有什么效果鳍怨，包括animation-name，animation-duration跪妥、animation-timing-function鞋喇、animation-delay、animation-iteration-count眉撵、animation-direction
優(yōu)點(diǎn)可以加密，減少了http請(qǐng)求
缺點(diǎn)是需要消耗CPU進(jìn)行編解碼
閉包就是能夠讀取其他函數(shù)內(nèi)部變量的函數(shù)
閉包是指有權(quán)訪問另一個(gè)函數(shù)作用域中變量的函數(shù)罐韩，創(chuàng)建閉包的最常見的方式就是在一個(gè)函數(shù)內(nèi)創(chuàng)建另一個(gè)函數(shù)，通過另一個(gè)函數(shù)訪問這個(gè)函數(shù)的局部變量,利用閉包可以突破作用鏈域
閉包的特性：
函數(shù)內(nèi)再嵌套函數(shù)
內(nèi)部函數(shù)可以引用外層的參數(shù)和變量
參數(shù)和變量不會(huì)被垃圾回收機(jī)制回收
說說你對(duì)閉包的理解
使用閉包主要是為了設(shè)計(jì)私有的方法和變量污朽。閉包的優(yōu)點(diǎn)是可以避免全局變量的污染散吵，缺點(diǎn)是閉包會(huì)常駐內(nèi)存，會(huì)增大內(nèi)存使用量膘壶，使用不當(dāng)很容易造成內(nèi)存泄露错蝴。在js中洲愤，函數(shù)即閉包颓芭，只有函數(shù)才會(huì)產(chǎn)生作用域的概念
閉包 的最大用處有兩個(gè)，一個(gè)是可以讀取函數(shù)內(nèi)部的變量柬赐，另一個(gè)就是讓這些變量始終保持在內(nèi)存中
閉包的另一個(gè)用處亡问，是封裝對(duì)象的私有屬性和私有方法
好處：能夠?qū)崿F(xiàn)封裝和緩存等；
壞處：就是消耗內(nèi)存肛宋、不正當(dāng)使用會(huì)造成內(nèi)存溢出的問題
使用閉包的注意點(diǎn)
由于閉包會(huì)使得函數(shù)中的變量都被保存在內(nèi)存中州藕，內(nèi)存消耗很大，所以不能濫用閉包酝陈，否則會(huì)造成網(wǎng)頁的性能問題床玻，在IE中可能導(dǎo)致內(nèi)存泄露
解決方法是，在退出函數(shù)之前沉帮，將不使用的局部變量全部刪除
作用域鏈的作用是保證執(zhí)行環(huán)境里有權(quán)訪問的變量和函數(shù)是有序的，作用域鏈的變量只能向上訪問穆壕，變量訪問到window對(duì)象即被終止待牵，作用域鏈向下訪問變量是不被允許的
簡單的說，作用域就是變量與函數(shù)的可訪問范圍喇勋，即作用域控制著變量與函數(shù)的可見性和生命周期
3缨该、JavaScript原型，原型鏈 ? 有什么特點(diǎn)川背？
每個(gè)對(duì)象都會(huì)在其內(nèi)部初始化一個(gè)屬性贰拿，就是prototype(原型)蛤袒，當(dāng)我們?cè)L問一個(gè)對(duì)象的屬性時(shí)
如果這個(gè)對(duì)象內(nèi)部不存在這個(gè)屬性，那么他就會(huì)去prototype里找這個(gè)屬性壮不，這個(gè)prototype又會(huì)有自己的prototype汗盘，于是就這樣一直找下去，也就是我們平時(shí)所說的原型鏈的概念
關(guān)系：instance.constructor.prototype = instance.__proto__
特點(diǎn)：
JavaScript對(duì)象是通過引用來傳遞的询一，我們創(chuàng)建的每個(gè)新對(duì)象實(shí)體中并沒有一份屬于自己的原型副本隐孽。當(dāng)我們修改原型時(shí)，與之相關(guān)的對(duì)象也會(huì)繼承這一改變
當(dāng)我們需要一個(gè)屬性的時(shí)健蕊，Javascript引擎會(huì)先看當(dāng)前對(duì)象中是否有這個(gè)屬性菱阵， 如果沒有的
就會(huì)查找他的Prototype對(duì)象是否有這個(gè)屬性，如此遞推下去缩功，一直檢索到?Object?內(nèi)建對(duì)象
事件代理（Event Delegation），又稱之為事件委托嫡锌。是?JavaScript?中常用綁定事件的常用技巧虑稼。顧名思義，“事件代理”即是把原本需要綁定的事件委托給父元素势木，讓父元素?fù)?dān)當(dāng)事件監(jiān)聽的職務(wù)蛛倦。事件代理的原理是DOM元素的事件冒泡。使用事件代理的好處是可以提高性能
可以大量節(jié)省內(nèi)存占用啦桌，減少事件注冊(cè)溯壶，比如在table上代理所有td的click事件就非常棒
可以實(shí)現(xiàn)當(dāng)新增子對(duì)象時(shí)無需再次對(duì)其綁定
5、Javascript如何實(shí)現(xiàn)繼承甫男？
構(gòu)造繼承
原型繼承
實(shí)例繼承
拷貝繼承
原型prototype機(jī)制或apply和call方法去實(shí)現(xiàn)較簡單且改，建議使用構(gòu)造函數(shù)與原型混合方式
functionParent(){this.name='wang';? ? }functionChild(){this.age=28;? ? }Child.prototype=newParent();//繼承了Parent，通過原型vardemo=newChild();alert(demo.age);alert(demo.name);//得到被繼承的屬性}
this總是指向函數(shù)的直接調(diào)用者（而非間接調(diào)用者）
如果有new關(guān)鍵字又跛，this指向new出來的那個(gè)對(duì)象
在事件中，this指向觸發(fā)這個(gè)事件的對(duì)象若治，特殊的是慨蓝，IE中的attachEvent中的this總是指向全局對(duì)象Window
W3C中定義事件的發(fā)生經(jīng)歷三個(gè)階段：捕獲階段（capturing）直砂、目標(biāo)階段（targetin）菌仁、冒泡階段（bubbling）
冒泡型事件：當(dāng)你使用事件冒泡時(shí)，子級(jí)元素先觸發(fā)静暂，父級(jí)元素后觸發(fā)
捕獲型事件：當(dāng)你使用事件捕獲時(shí)济丘，父級(jí)元素先觸發(fā)，子級(jí)元素后觸發(fā)
DOM事件流：同時(shí)支持兩種事件模型：捕獲型事件和冒泡型事件
阻止冒泡：在W3c中，使用stopPropagation（）方法摹迷；在IE下設(shè)置cancelBubble = true
阻止捕獲：阻止事件的默認(rèn)行為疟赊，例如click - 后的跳轉(zhuǎn)。在W3c中峡碉，使用preventDefault（）方法近哟，在IE下設(shè)置window.event.returnValue = false
創(chuàng)建一個(gè)空對(duì)象鲫寄，并且?this?變量引用該對(duì)象吉执，同時(shí)還繼承了該函數(shù)的原型
屬性和方法被加入到?this?引用的對(duì)象中
新創(chuàng)建的對(duì)象由?this?所引用，并且最后隱式的返回?this
Ajax的原理簡單來說是在用戶和服務(wù)器之間加了—個(gè)中間層(AJAX引擎)戳玫，通過XmlHttpRequest對(duì)象來向服務(wù)器發(fā)異步請(qǐng)求，從服務(wù)器獲得數(shù)據(jù)未斑，然后用javascript來操作DOM而更新頁面咕宿。使用戶操作與服務(wù)器響應(yīng)異步化。這其中最關(guān)鍵的一步就是從服務(wù)器獲得請(qǐng)求數(shù)據(jù)
Ajax的過程只涉及JavaScript蜡秽、XMLHttpRequest和DOM府阀。XMLHttpRequest是ajax的核心機(jī)制
//1. 創(chuàng)建連接varxhr=null;? ? xhr=newXMLHttpRequest()//2. 連接服務(wù)器xhr.open('get', url,true)//3. 發(fā)送請(qǐng)求xhr.send(null);//4. 接受請(qǐng)求xhr.onreadystatechange=function(){if(xhr.readyState==4){if(xhr.status==200){success(xhr.responseText);? ? ? ? ? ? }else{//failfail&&fail(xhr.status);? ? ? ? ? ? }? ? ? ? }? ? }
ajax 有那些優(yōu)缺點(diǎn)?
優(yōu)點(diǎn)：
通過異步模式，提升了用戶體驗(yàn).
優(yōu)化了瀏覽器和服務(wù)器之間的傳輸芽突，減少不必要的數(shù)據(jù)往返试浙，減少了帶寬占用.
Ajax在客戶端運(yùn)行，承擔(dān)了一部分本來由服務(wù)器承擔(dān)的工作诉瓦，減少了大用戶量下的服務(wù)器負(fù)載川队。
Ajax可以實(shí)現(xiàn)動(dòng)態(tài)不刷新（局部刷新）
缺點(diǎn)：
安全問題?AJAX暴露了與服務(wù)器交互的細(xì)節(jié)力细。
對(duì)搜索引擎的支持比較弱睬澡。
不容易調(diào)試。
jsonp煞聪、?iframe、window.name逝慧、window.postMessage昔脯、服務(wù)器上設(shè)置代理頁面
立即執(zhí)行函數(shù),不暴露私有成員
varmodule1=(function(){var_count=0;varm1=function(){//...};varm2=function(){//...};return{ m1:m1, m2:m2 }; })();
defer沈堡，只支持IE
async：
創(chuàng)建script静陈，插入到DOM中，加載完畢后callBack
內(nèi)存泄漏指任何對(duì)象在您不再擁有或需要它之后仍然存在
setTimeout?的第一個(gè)參數(shù)使用字符串而非函數(shù)的話拐格，會(huì)引發(fā)內(nèi)存泄漏
閉包使用不當(dāng)
數(shù)據(jù)體積方面
JSON相對(duì)于XML來講捏浊，數(shù)據(jù)的體積小，傳遞的速度更快些撞叨。
數(shù)據(jù)交互方面
JSON與JavaScript的交互更加方便金踪，更容易解析處理，更好的數(shù)據(jù)交互
數(shù)據(jù)描述方面
JSON對(duì)數(shù)據(jù)的描述性比XML較差
傳輸速度方面
JSON的速度要遠(yuǎn)遠(yuǎn)快于XML
WebPack?是一個(gè)模塊打包工具热康，你可以使用WebPack管理你的模塊依賴，并編繹輸出模塊們所需的靜態(tài)文件劣领。它能夠很好地管理姐军、打包Web開發(fā)中所用到的HTML、Javascript尖淘、CSS以及各種靜態(tài)文件（圖片奕锌、字體等）彼硫，讓開發(fā)過程更加高效阿蝶。對(duì)于不同類型的資源，webpack有對(duì)應(yīng)的模塊加載器夸浅。webpack模塊打包器會(huì)分析模塊間的依賴關(guān)系趁桃，最后 生成了優(yōu)化且合并后的靜態(tài)資源
CommonJS是服務(wù)器端模塊的規(guī)范，Node.js采用了這個(gè)規(guī)范卫病。CommonJS規(guī)范加載模塊是同步的油啤，也就是說，只有加載完成蟀苛，才能執(zhí)行后面的操作益咬。AMD規(guī)范則是非同步加載模塊，允許指定回調(diào)函數(shù)
AMD推薦的風(fēng)格通過返回一個(gè)對(duì)象做為模塊對(duì)象帜平，CommonJS的風(fēng)格通過對(duì)module.exports或exports的屬性賦值來達(dá)到暴露模塊對(duì)象的目的
sql注入原理
就是通過把SQL命令插入到Web表單遞交或輸入域名或頁面請(qǐng)求的查詢字符串，最終達(dá)到欺騙服務(wù)器執(zhí)行惡意的SQL命令
總的來說有以下幾點(diǎn)
永遠(yuǎn)不要信任用戶的輸入裆甩，要對(duì)用戶的輸入進(jìn)行校驗(yàn)冗锁，可以通過正則表達(dá)式，或限制長度嗤栓，對(duì)單引號(hào)和雙"-"進(jìn)行轉(zhuǎn)換等
永遠(yuǎn)不要使用動(dòng)態(tài)拼裝SQL冻河，可以使用參數(shù)化的SQL或者直接使用存儲(chǔ)過程進(jìn)行數(shù)據(jù)查詢存取
永遠(yuǎn)不要使用管理員權(quán)限的數(shù)據(jù)庫連接，為每個(gè)應(yīng)用使用單獨(dú)的權(quán)限有限的數(shù)據(jù)庫連接
不要把機(jī)密信息明文存放，請(qǐng)加密或者h(yuǎn)ash掉密碼和敏感的信息
XSS原理及防范
Xss(cross-site scripting)攻擊指的是攻擊者往Web頁面里插入惡意html標(biāo)簽或者javascript代碼芋绸。比如：攻擊者在論壇中放一個(gè)看似安全的鏈接媒殉，騙取用戶點(diǎn)擊后，竊取cookie中的用戶私密信息摔敛；或者攻擊者在論壇中加一個(gè)惡意表單廷蓉，當(dāng)用戶提交表單的時(shí)候，卻把信息傳送到攻擊者的服務(wù)器中马昙，而不是用戶原本以為的信任站點(diǎn)
XSS防范方法
首先代碼里對(duì)用戶輸入的地方和變量都需要仔細(xì)檢查長度和對(duì)”<”,”>”,”;”,”’”等字符做過濾桃犬；其次任何內(nèi)容寫到頁面之前都必須加以encode，避免不小心把html tag?弄出來行楞。這一個(gè)層面做好攒暇，至少可以堵住超過一半的XSS 攻擊
XSS與CSRF有什么區(qū)別嗎？
XSS是獲取信息子房，不需要提前知道其他用戶頁面的代碼和數(shù)據(jù)包形用。CSRF是代替用戶完成指定的動(dòng)作，需要知道其他用戶頁面的代碼和數(shù)據(jù)包证杭。要完成一次CSRF攻擊田度，受害者必須依次完成兩個(gè)步驟
登錄受信任網(wǎng)站A，并在本地生成Cookie
在不登出A的情況下解愤，訪問危險(xiǎn)網(wǎng)站B
CSRF的防御
服務(wù)端的CSRF方式方法很多樣镇饺，但總的思想都是一致的，就是在客戶端頁面增加偽隨機(jī)數(shù)
通過驗(yàn)證碼的方法
工廠模式：
工廠模式解決了重復(fù)實(shí)例化的問題，但還有一個(gè)問題,那就是識(shí)別問題哼鬓，因?yàn)楦緹o法
主要好處就是可以消除對(duì)象間的耦合监右，通過使用工程方法而不是new關(guān)鍵字
構(gòu)造函數(shù)模式
使用構(gòu)造函數(shù)的方法，即解決了重復(fù)實(shí)例化的問題魄宏，又解決了對(duì)象識(shí)別的問題秸侣，該模式與工廠模式的不同之處在于
直接將屬性和方法賦值給?this對(duì)象;
同源策略指的是：協(xié)議，域名椭坚，端口相同予跌，同源策略是一種安全協(xié)議
舉例說明：比如一個(gè)黑客程序，他利用Iframe把真正的銀行登錄頁面嵌到他的頁面上善茎，當(dāng)你使用真實(shí)的用戶名券册，密碼登錄時(shí)，他的頁面就可以通過Javascript讀取到你的表單中input中的內(nèi)容，這樣用戶名烁焙，密碼就輕松到手了航邢。
20、offsetWidth/offsetHeight,clientWidth/clientHeight與scrollWidth/scrollHeight的區(qū)別
offsetWidth/offsetHeight返回值包含content + padding + border骄蝇，效果與e.getBoundingClientRect()相同
clientWidth/clientHeight返回值只包含content + padding膳殷，如果有滾動(dòng)條，也不包含滾動(dòng)條
scrollWidth/scrollHeight返回值包含content + padding + 溢出內(nèi)容的尺寸
對(duì)象字面量：?var obj = {};
構(gòu)造函數(shù)：?var obj = new Object();
Object.create():?var obj = Object.create(Object.prototype);
png24位的圖片在iE6瀏覽器上出現(xiàn)背景岔激，解決方案是做成PNG8
瀏覽器默認(rèn)的margin和padding不同勒极。解決方案是加一個(gè)全局的*{margin:0;padding:0;}來統(tǒng)一,，但是全局效率很低虑鼎，一般是如下這樣解決：
body,ul,li,ol,dl,dt,dd,form,input,h1,h2,h3,h4,h5,h6,p{margin:0;padding:0;}
IE下,event對(duì)象有x,y屬性,但是沒有pageX,pageY屬性
Firefox下,event對(duì)象有pageX,pageY屬性,但是沒有x,y屬性.
依照?Promise/A+?的定義，Promise?有四種狀態(tài)：
pending:?初始狀態(tài), 非?fulfilled?或?rejected.
fulfilled:?成功的操作.
rejected:?失敗的操作.
settled: Promise已被fulfilled或rejected炫彩，且不是pending
另外掀鹅，?fulfilled與?rejected一起合稱?settled
Promise?對(duì)象用來進(jìn)行延遲(deferred) 和異步(asynchronous) 計(jì)算
Promise 的構(gòu)造函數(shù)
構(gòu)造一個(gè)?Promise，最基本的用法如下：
varpromise=newPromise(function(resolve,reject) {if(...) {//succeedresolve(result);? ? ? ? }else{//failsreject(Error(errMessage));? ? ? ? }? ? });
Promise?實(shí)例擁有?then?方法（具有?then?方法的對(duì)象媒楼，通常被稱為thenable）乐尊。它的使用方法如下：
promise.then(onFulfilled, onRejected)
接收兩個(gè)函數(shù)作為參數(shù)，一個(gè)在?fulfilled?的時(shí)候被調(diào)用划址，一個(gè)在rejected的時(shí)候被調(diào)用扔嵌，接收參數(shù)就是?future，onFulfilled?對(duì)應(yīng)resolve,?onRejected對(duì)應(yīng)?reject
jquery源碼封裝在一個(gè)匿名函數(shù)的自執(zhí)行環(huán)境中痢缎，有助于防止變量的全局污染，然后通過傳入window對(duì)象參數(shù)世澜，可以使window對(duì)象作為局部變量使用独旷，好處是當(dāng)jquery中訪問window對(duì)象的時(shí)候，就不用將作用域鏈退回到頂層作用域了寥裂，從而可以更快的訪問window對(duì)象嵌洼。同樣，傳入undefined參數(shù)封恰，可以縮短查找undefined時(shí)的作用域鏈
jquery將一些原型屬性和方法封裝在了jquery.prototype中麻养，為了縮短名稱，又賦值給了jquery.fn诺舔，這是很形象的寫法
有一些數(shù)組或?qū)ο蟮姆椒ń?jīng)常能使用到鳖昌，jQuery將其保存為局部變量以提高訪問速度
jquery實(shí)現(xiàn)的鏈?zhǔn)秸{(diào)用可以節(jié)約代碼备畦，所返回的都是同一個(gè)對(duì)象，可以提高代碼效率
Vue.js?一個(gè)用于創(chuàng)建?web?交互界面的庫糕档，是一個(gè)精簡的?MVVM允粤。它通過雙向數(shù)據(jù)綁定把?View?層和?Model?層連接了起來。實(shí)際的?DOM?封裝和輸出格式都被抽象為了Directives?和?Filters
AngularJS?是一個(gè)比較完善的前端MVVM框架翼岁，包含模板类垫，數(shù)據(jù)雙向綁定，路由琅坡，模塊化悉患，服務(wù)，依賴注入等所有功能榆俺，模板功能強(qiáng)大豐富售躁，自帶了豐富的?Angular指令
react?React?僅僅是?VIEW?層是facebook公司。推出的一個(gè)用于構(gòu)建UI的一個(gè)庫茴晋，能夠?qū)崿F(xiàn)服務(wù)器端的渲染陪捷。用了virtual dom，所以性能很好诺擅。
特點(diǎn)：
1、它是一個(gè)Javascript運(yùn)行環(huán)境
2烁涌、依賴于Chrome V8引擎進(jìn)行代碼解釋
3苍碟、事件驅(qū)動(dòng)
4、非阻塞I/O
5撮执、單進(jìn)程微峰，單線程
優(yōu)點(diǎn)：
高并發(fā)（最重要的優(yōu)點(diǎn)）
缺點(diǎn)：
1、只支持單核CPU抒钱，不能充分利用CPU
2蜓肆、可靠性低，一旦代碼某個(gè)環(huán)節(jié)崩潰谋币，整個(gè)系統(tǒng)都崩潰
CommonJS是服務(wù)器端模塊的規(guī)范瑞信，Node.js采用了這個(gè)規(guī)范厉颤。CommonJS規(guī)范加載模塊是同步的，也就是說凡简，只有加載完成逼友，才能執(zhí)行后面的操作。AMD規(guī)范則是非同步加載模塊秤涩，允許指定回調(diào)函數(shù)
AMD推薦的風(fēng)格通過返回一個(gè)對(duì)象做為模塊對(duì)象帜乞，CommonJS的風(fēng)格通過對(duì)module.exports或exports的屬性賦值來達(dá)到暴露模塊對(duì)象的目的
內(nèi)存泄漏指任何對(duì)象在您不再擁有或需要它之后仍然存在
setTimeout?的第一個(gè)參數(shù)使用字符串而非函數(shù)的話黎烈，會(huì)引發(fā)內(nèi)存泄漏
閉包、控制臺(tái)日志匀谣、循環(huán)（在兩個(gè)對(duì)象彼此引用且彼此保留時(shí)照棋，就會(huì)產(chǎn)生一個(gè)循環(huán)）
cookie
session
url重寫
隱藏input
ip地址
Undefined烈炭、Null、Boolean宝恶、Number符隙、String
Object?是?JavaScript?中所有對(duì)象的父對(duì)象
數(shù)據(jù)封裝類對(duì)象：Object霹疫、Array、Boolean综芥、Number?和?String
其他對(duì)象：Function丽蝎、Arguments、Math膀藐、Date征峦、RegExp、Error
31消请、說幾條寫JavaScript的基本規(guī)范栏笆？
不要在同一行聲明多個(gè)變量
請(qǐng)使用===/!==來比較true/false或者數(shù)值
使用對(duì)象字面量替代new Array這種形式
不要使用全局函數(shù)
Switch語句必須帶有default分支
If語句必須使用大括號(hào)
for-in循環(huán)中的變量 應(yīng)該使用var關(guān)鍵字明確限定作用域，從而避免作用域污
32臊泰、JavaScript有幾種類型的值蛉加？，你能畫一下他們的內(nèi)存圖嗎缸逃？
棧：原始數(shù)據(jù)類型（Undefined针饥，Null，Boolean需频，Number丁眼、String）
堆：引用數(shù)據(jù)類型（對(duì)象、數(shù)組和函數(shù)）
兩種類型的區(qū)別是：存儲(chǔ)位置不同昭殉；
原始數(shù)據(jù)類型直接存儲(chǔ)在棧(stack)中的簡單數(shù)據(jù)段苞七，占據(jù)空間小藐守、大小固定，屬于被頻繁使用數(shù)據(jù)蹂风，所以放入棧中存儲(chǔ)卢厂；
引用數(shù)據(jù)類型存儲(chǔ)在堆(heap)中的對(duì)象,占據(jù)空間大、大小不固定,如果存儲(chǔ)在棧中惠啄，將會(huì)影響程序運(yùn)行的性能慎恒；引用數(shù)據(jù)類型在棧中存儲(chǔ)了指針，該指針指向堆中該實(shí)體的起始地址撵渡。當(dāng)解釋器尋找引用值時(shí)融柬，會(huì)首先檢索其
在棧中的地址，取得地址后從堆中獲得實(shí)體
33趋距、javascript創(chuàng)建對(duì)象的幾種方式粒氧？
javascript創(chuàng)建對(duì)象簡單的說,無非就是使用內(nèi)置對(duì)象或各種自定義對(duì)象，當(dāng)然還可以用JSON棚品；但寫法有很多種靠欢，也能混合使用
對(duì)象字面量的方式
person={firstname:"Mark",lastname:"Yun",age:25,eyecolor:"black"};
用function來模擬無參的構(gòu)造函數(shù)
functionPerson(){}varperson=newPerson();//定義一個(gè)function，如果使用new"實(shí)例化",該function可以看作是一個(gè)Classperson.name="Mark";person.age="25";person.work=function(){alert(person.name+"hello...");? ? }person.work();
用function來模擬參構(gòu)造函數(shù)來實(shí)現(xiàn)（用this關(guān)鍵字定義構(gòu)造的上下文屬性）
functionPet(name,age,hobby){this.name=name;//this作用域：當(dāng)前對(duì)象this.age=age;this.hobby=hobby;this.eat=function(){alert("我叫"+this.name+",我喜歡"+this.hobby+",是個(gè)程序員");? ? ? }? ? }varmaidou=newPet("麥兜",25,"coding");//實(shí)例化铜跑、創(chuàng)建對(duì)象maidou.eat();//調(diào)用eat方法
用工廠方式來創(chuàng)建（內(nèi)置對(duì)象）
var wcDog =new Object();
? ? wcDog.name="旺財(cái)";
? ? wcDog.age=3;
? ? wcDog.work=function(){
? ? ? alert("我是"+wcDog.name+",汪汪汪......");
? ? }
? ? wcDog.work();
用原型方式來創(chuàng)建
function Dog(){
? ? }
? ? Dog.prototype.name="旺財(cái)";
? ? Dog.prototype.eat=function(){
? ? alert(this.name+"是個(gè)吃貨");
? ? }
? ? var wangcai =new Dog();
? ? wangcai.eat();
用混合方式來創(chuàng)建
function Car(name,price){
? ? ? this.name=name;
? ? ? this.price=price;
? ? }
? ? Car.prototype.sell=function(){
? ? ? alert("我是"+this.name+"门怪，我現(xiàn)在賣"+this.price+"萬元");
? ? ? }
? ? var camry =new Car("凱美瑞",27);
? ? camry.sell();
它的功能是把對(duì)應(yīng)的字符串解析成JS代碼并運(yùn)行
應(yīng)該避免使用eval掷空，不安全，非常耗性能（2次囤锉，一次解析成js語句坦弟，一次執(zhí)行）
由JSON字符串轉(zhuǎn)換為JSON對(duì)象的時(shí)候可以用eval，var obj =eval('('+ str +')')
35官地、null酿傍，undefined 的區(qū)別？
undefined?表示不存在這個(gè)值驱入。
undefined?:是一個(gè)表示"無"的原始值或者說表示"缺少值"赤炒，就是此處應(yīng)該有一個(gè)值，但是還沒有定義亏较。當(dāng)嘗試讀取時(shí)會(huì)返回?undefined
例如變量被聲明了莺褒，但沒有賦值時(shí)，就等于undefined
null?表示一個(gè)對(duì)象被定義了雪情，值為“空值”
null?: 是一個(gè)對(duì)象(空對(duì)象, 沒有任何屬性和方法)
例如作為函數(shù)的參數(shù)遵岩，表示該函數(shù)的參數(shù)不是對(duì)象；
在驗(yàn)證null時(shí)巡通，一定要使用===?尘执，因?yàn)?==無法分別null?和undefined
36舍哄、["1", "2", "3"].map(parseInt) 答案是多少？
[1, NaN, NaN]因?yàn)?parseInt?需要兩個(gè)參數(shù)?(val, radix)正卧，其中radix?表示解析時(shí)用的基數(shù)蠢熄。
map傳了?3個(gè)(element, index, array)跪解，對(duì)應(yīng)的?radix?不合法導(dǎo)致解析失敗炉旷。
37、javascript 代碼中的"use strict";是什么意思 ? 使用它區(qū)別是什么叉讥？
use strict是一種ECMAscript 5?添加的（嚴(yán)格）運(yùn)行模式,這種模式使得 Javascript 在更嚴(yán)格的條件下運(yùn)行,使JS編碼更加規(guī)范化的模式,消除Javascript語法的一些不合理窘行、不嚴(yán)謹(jǐn)之處，減少一些怪異行為
JSON(JavaScript Object Notation)?是一種輕量級(jí)的數(shù)據(jù)交換格式
它是基于JavaScript的一個(gè)子集。數(shù)據(jù)格式簡單, 易于讀寫, 占用帶寬小
JSON字符串轉(zhuǎn)換為JSON對(duì)象:
var obj =eval('('+ str +')');
var obj = str.parseJSON();
var obj = JSON.parse(str);
JSON對(duì)象轉(zhuǎn)換為JSON字符串：
var last=obj.toJSONString();
var last=JSON.stringify(obj);
defer和async、動(dòng)態(tài)創(chuàng)建DOM方式（用得最多）六孵、按需異步載入js
同步：瀏覽器訪問服務(wù)器請(qǐng)求，用戶看得到頁面刷新劫窒，重新發(fā)請(qǐng)求,等請(qǐng)求完本今，頁面刷新，新內(nèi)容出現(xiàn)主巍，用戶看到新內(nèi)容,進(jìn)行下一步操作
異步：瀏覽器訪問服務(wù)器請(qǐng)求冠息，用戶正常操作，瀏覽器后端進(jìn)行請(qǐng)求孕索。等請(qǐng)求完逛艰，頁面不刷新，新內(nèi)容也會(huì)出現(xiàn)搞旭，用戶看到新內(nèi)容
41散怖、漸進(jìn)增強(qiáng)和優(yōu)雅降級(jí)
漸進(jìn)增強(qiáng) ：針對(duì)低版本瀏覽器進(jìn)行構(gòu)建頁面，保證最基本的功能选脊，然后再針對(duì)高級(jí)瀏覽器進(jìn)行效果杭抠、交互等改進(jìn)和追加功能達(dá)到更好的用戶體驗(yàn)。
優(yōu)雅降級(jí) ：一開始就構(gòu)建完整的功能恳啥，然后再針對(duì)低版本瀏覽器進(jìn)行兼容
defer并行加載js文件，會(huì)按照頁面上script標(biāo)簽的順序執(zhí)行
async并行加載js文件钝的，下載完成立即執(zhí)行翁垂，不會(huì)按照頁面上script標(biāo)簽的順序執(zhí)行
變量必須聲明后再使用
函數(shù)的參數(shù)不能有同名屬性，否則報(bào)錯(cuò)
不能使用with語句
禁止this指向全局對(duì)象
44沿猜、attribute和property的區(qū)別是什么枚荣？
attribute是dom元素在文檔中作為html標(biāo)簽擁有的屬性；
property就是dom元素在js中作為對(duì)象擁有的屬性啼肩。
對(duì)于html的標(biāo)準(zhǔn)屬性來說橄妆，attribute和property是同步的，是會(huì)自動(dòng)更新的
但是對(duì)于自定義的屬性來說祈坠，他們是不同步的
新增模板字符串（為JavaScript提供了簡單的字符串插值功能）
箭頭函數(shù)
for-of（用來遍歷數(shù)據(jù)—例如數(shù)組中的值。）
arguments對(duì)象可被不定參數(shù)和默認(rèn)參數(shù)完美代替赦拘。
ES6將promise對(duì)象納入規(guī)范慌随，提供了原生的Promise對(duì)象。
增加了let和const命令躺同，用來聲明變量阁猜。
增加了塊級(jí)作用域。
let命令實(shí)際上就增加了塊級(jí)作用域蹋艺。
還有就是引入module模塊的概念
46剃袍、ECMAScript6 怎么寫class么，為什么會(huì)出現(xiàn)class這種東西?
這個(gè)語法糖可以讓有OOP基礎(chǔ)的人更快上手js车海，至少是一個(gè)官方的實(shí)現(xiàn)了
但對(duì)熟悉js的人來說笛园，這個(gè)東西沒啥大影響；一個(gè)Object.creat()搞定繼承侍芝，比class簡潔清晰的多
47研铆、什么是面向?qū)ο缶幊碳懊嫦蜻^程編程，它們的異同和優(yōu)缺點(diǎn)
面向過程就是分析出解決問題所需要的步驟州叠，然后用函數(shù)把這些步驟一步一步實(shí)現(xiàn)棵红，使用的時(shí)候一個(gè)一個(gè)依次調(diào)用就可以了
面向?qū)ο笫前褬?gòu)成問題事務(wù)分解成各個(gè)對(duì)象，建立對(duì)象的目的不是為了完成一個(gè)步驟咧栗，而是為了描敘某個(gè)事物在整個(gè)解決問題的步驟中的行為
面向?qū)ο笫且怨δ軄韯澐謫栴}逆甜，而不是步驟
基本思想是使用對(duì)象致板，類交煞，繼承，封裝等基本概念來進(jìn)行程序設(shè)計(jì)
優(yōu)點(diǎn)
易維護(hù)
采用面向?qū)ο笏枷朐O(shè)計(jì)的結(jié)構(gòu)斟或，可讀性高素征，由于繼承的存在，即使改變需求，那么維護(hù)也只是在局部模塊御毅，所以維護(hù)起來是非常方便和較低成本的
易擴(kuò)展
開發(fā)工作的重用性根欧、繼承性高，降低重復(fù)工作量端蛆。
縮短了開發(fā)周期
49凤粗、對(duì)web標(biāo)準(zhǔn)、可用性今豆、可訪問性的理解
可用性（Usability）：產(chǎn)品是否容易上手嫌拣，用戶能否完成任務(wù)，效率如何晚凿，以及這過程中用戶的主觀感受可好亭罪，是從用戶的角度來看產(chǎn)品的質(zhì)量瘦馍〖呋啵可用性好意味著產(chǎn)品質(zhì)量高，是企業(yè)的核心競(jìng)爭力
可訪問性（Accessibility）：Web內(nèi)容對(duì)于殘障用戶的可閱讀和可理解性
可維護(hù)性（Maintainability）：一般包含兩個(gè)層次情组，一是當(dāng)系統(tǒng)出現(xiàn)問題時(shí)燥筷，快速定位并解決問題的成本，成本低則可維護(hù)性好院崇。二是代碼是否容易被人理解肆氓，是否容易修改和增強(qiáng)功能。
//event(事件)工具集谢揪，來源：github.com/markyunmarkyun.Event={//視能力分別使用dom0||dom2||IE方式 來綁定事件//參數(shù)： 操作的元素,事件名稱 ,事件處理程序addEvent:function(element,type,handler) {if(element.addEventListener) {//事件類型、需要執(zhí)行的函數(shù)捐凭、是否捕捉element.addEventListener(type, handler,false);? ? ? ? ? ? }elseif(element.attachEvent) {element.attachEvent('on'+type,function() {handler.call(element);? ? ? ? ? ? ? ? });? ? ? ? ? ? }else{? ? ? ? ? ? ? ? element['on'+type]=handler;? ? ? ? ? ? }? ? ? ? },//移除事件removeEvent:function(element,type,handler) {if(element.removeEventListener) {element.removeEventListener(type, handler,false);? ? ? ? ? ? }elseif(element.datachEvent) {element.detachEvent('on'+type, handler);? ? ? ? ? ? }else{? ? ? ? ? ? ? ? element['on'+type]=null;? ? ? ? ? ? }? ? ? ? },//阻止事件 (主要是事件冒泡拨扶，因?yàn)镮E不支持事件捕獲)stopPropagation:function(ev) {if(ev.stopPropagation) {ev.stopPropagation();? ? ? ? ? ? }else{ev.cancelBubble=true;? ? ? ? ? ? }? ? ? ? },//取消事件的默認(rèn)行為preventDefault:function(event) {if(event.preventDefault) {event.preventDefault();? ? ? ? ? ? }else{event.returnValue=false;? ? ? ? ? ? }? ? ? ? },//獲取事件目標(biāo)getTarget:function(event) {returnevent.target||event.srcElement;? ? ? ? }
functionisArray(arg) {if(typeofarg==='object') {returnObject.prototype.toString.call(arg)==='[object Array]';? ? }returnfalse;}
每次比較相鄰的兩個(gè)數(shù)患民，如果后一個(gè)比前一個(gè)小，換位置
vararr=[3,1,4,6,5,7,2];functionbubbleSort(arr) {for(vari=0; i
采用二分法匹颤，取出中間數(shù)，數(shù)組每次和中間數(shù)比較托猩，小的放到左邊印蓖，大的放到右邊
vararr=[3,1,4,6,5,7,2];functionquickSort(arr) {if(arr.length==0) {return[];//返回空數(shù)組}varcIndex=Math.floor(arr.length/2);varc=arr.splice(cIndex,1);varl=[];varr=[];for(vari=0; i
5、編寫一個(gè)方法 求一個(gè)字符串的字節(jié)長度
假設(shè)：一個(gè)英文字符占用一個(gè)字節(jié)京腥，一個(gè)中文字符占用兩個(gè)字節(jié)
functionGetBytes(str){varlen=str.length;varbytes=len;for(vari=0; i255) bytes++;? ? ? ? }returnbytes;? ? }alert(GetBytes("你好,as"));
6赦肃、bind的用法，以及如何實(shí)現(xiàn)bind的函數(shù)和需要注意的點(diǎn)
bind的作用與call和apply相同，區(qū)別是call和apply是立即調(diào)用函數(shù)摆尝，而bind是返回了一個(gè)函數(shù)温艇，需要調(diào)用的時(shí)候再執(zhí)行。 一個(gè)簡單的bind函數(shù)實(shí)現(xiàn)如下
Function.prototype.bind=function(ctx) {varfn=this;returnfunction() {fn.apply(ctx,arguments);? ? };};
網(wǎng)站重構(gòu)：在不改變外部行為的前提下勺爱，簡化結(jié)構(gòu)、添加可讀性讯检，而在網(wǎng)站前端保持一致的行為琐鲁。也就是說是在不改變UI的情況下，對(duì)網(wǎng)站進(jìn)行優(yōu)化人灼， 在擴(kuò)展的同時(shí)保持一致的UI
對(duì)于傳統(tǒng)的網(wǎng)站來說重構(gòu)通常是：
表格(table)布局改為DIV+CSS
使網(wǎng)站前端兼容于現(xiàn)代瀏覽器(針對(duì)于不合規(guī)范的CSS围段、如對(duì)IE6有效的)
對(duì)于移動(dòng)平臺(tái)的優(yōu)化
針對(duì)于SEO進(jìn)行優(yōu)化
高復(fù)用低耦合投放，這樣文件小奈泪，好維護(hù)量瓜，而且好擴(kuò)展筹陵。
3、對(duì)前端工程師這個(gè)職位是怎么樣理解的峻汉？它的前景會(huì)怎么樣烙样？
前端是最貼近用戶的程序員冯遂，比后端、數(shù)據(jù)庫谒获、產(chǎn)品經(jīng)理蛤肌、運(yùn)營、安全都近
實(shí)現(xiàn)界面交互
提升用戶體驗(yàn)
有了Node.js批狱，前端可以實(shí)現(xiàn)服務(wù)端的一些事情
前端是最貼近用戶的程序員裸准，前端的能力就是能讓產(chǎn)品從 90分進(jìn)化到 100 分，甚至更好精耐，
與團(tuán)隊(duì)成員狼速，UI設(shè)計(jì)，產(chǎn)品經(jīng)理的溝通卦停；
做好的頁面結(jié)構(gòu)向胡，頁面重構(gòu)和用戶體驗(yàn)；
為簡化用戶使用提供技術(shù)支持（交互部分）
為多個(gè)瀏覽器兼容性提供支持
為提高用戶瀏覽速度（瀏覽器性能）提供支持
為跨平臺(tái)或者其他基于webkit或其他渲染引擎的應(yīng)用提供支持
為展示數(shù)據(jù)提供支持（數(shù)據(jù)接口）
先期團(tuán)隊(duì)必須確定好全局樣式（globe.css）小槐，編碼模式(utf-8) 等拇派；
編寫習(xí)慣必須一致（例如都是采用繼承式的寫法荷辕，單樣式都寫成一行）；
標(biāo)注樣式編寫人件豌，各模塊都及時(shí)標(biāo)注（標(biāo)注關(guān)鍵樣式調(diào)用的地方）疮方；
頁面進(jìn)行標(biāo)注（例如 頁面 模塊 開始和結(jié)束）；
CSS跟HTML?分文件夾并行存放茧彤，命名都得統(tǒng)一（例如style.css）骡显；
JS?分文件夾存放 命名以該JS功能為準(zhǔn)的英文翻譯。
圖片采用整合的?images.png png8?格式文件使用 - 盡量整合在一起使用方便將來的管理
面試完你還有什么問題要問的嗎
你有什么愛好?
你最大的優(yōu)點(diǎn)和缺點(diǎn)是什么?
你為什么會(huì)選擇這個(gè)行業(yè)曾掂，職位?
你覺得你適合從事這個(gè)崗位嗎?
你有什么職業(yè)規(guī)劃?
你對(duì)工資有什么要求?
如何看待前端開發(fā)惫谤？
未來三到五年的規(guī)劃是怎樣的？
自我介紹
你的項(xiàng)目中技術(shù)難點(diǎn)是什么珠洗？遇到了什么問題溜歪？你是怎么解決的？
你認(rèn)為哪個(gè)項(xiàng)目做得最好许蓖？
最近在看哪些前端方面的書蝴猪？
平時(shí)是如何學(xué)習(xí)前端開發(fā)的？
你最有成就感的一件事
你是怎么學(xué)習(xí)前端的
