最全的前端面試題 前端面試題集合

HTML+CSS
1.對WEB標(biāo)準(zhǔn)以及W3C的理解與認(rèn)識
標(biāo)簽閉合、標(biāo)簽小寫、不亂嵌套、提高搜索機(jī)器人搜索幾率、使用外 鏈css和js腳本、結(jié)構(gòu)行為表現(xiàn)的分離、文件下載與頁面速度更快、內(nèi)容能被更多的用戶所訪問、內(nèi)容能被更廣泛的設(shè)備所訪問、更少的代碼和組件,容易維 護(hù)、改版方便,不需要變動頁面內(nèi)容、提供打印版本而不需要復(fù)制內(nèi)容、提高網(wǎng)站易用性;
2.xhtml和html有什么區(qū)別
HTML是一種基本的WEB網(wǎng)頁設(shè)計語言,XHTML是一個基于XML的置標(biāo)語言最主要的不同:
XHTML 元素必須被正確地嵌套。
XHTML 元素必須被關(guān)閉。
標(biāo)簽名必須用小寫字母。
XHTML 文檔必須擁有根元素。
3.Doctype? 嚴(yán)格模式與混雜模式-如何觸發(fā)這兩種模式,區(qū)分它們有何意義?
用于聲明文檔使用那種規(guī)范(html/Xhtml)一般為 嚴(yán)格過度 基于框架的html文檔加入XMl聲明可觸發(fā),解析方式更改為IE5.5 擁有IE5.5的bug
4.行內(nèi)元素有哪些?塊級元素有哪些?CSS的盒模型?
塊級元素:div p h1 h2 h3 h4 form ul
行內(nèi)元素: a b br i span input select
Css盒模型:內(nèi)容,border ,margin,padding
5.CSS引入的方式有哪些? link和@import的區(qū)別是?
內(nèi)聯(lián) 內(nèi)嵌 外鏈 導(dǎo)入
區(qū)別 :同時加載
前者無兼容性,后者CSS2.1以下瀏覽器不支持
Link 支持使用javascript改變樣式,后者不可
6.CSS選擇符有哪些?哪些屬性可以繼承?優(yōu)先級算法
如何計算?
內(nèi)聯(lián)和important哪個優(yōu)先級高?
標(biāo)簽選擇符 類選擇符 id選擇符
繼承不如指定 Id>class>標(biāo)簽選擇
后者優(yōu)先級高
7.前端頁面有哪三層構(gòu)成,分別是什么?作用是什么?
結(jié)構(gòu)層 Html 表示層 CSS 行為層 js
8.css的基本語句構(gòu)成是?
選擇器{屬性1:值1;屬性2:值2;……}
9.你做的頁面在哪些流覽器測試過?這些瀏覽器的內(nèi)
核分別是什么?
Ie(Ie內(nèi)核) 火狐(Gecko) 谷歌(webkit) opear(Presto)
10.寫出幾種IE6 BUG的解決方法
1.雙邊距BUG float引起的 使用display
2.3像素問題 使用float引起的 使用dislpay:inline -3px
3.超鏈接hover 點(diǎn)擊后失效 使用正確的書寫順序 link visited hover active
4.Ie z-index問題 給父級添加position:relative
5.Png 透明 使用js代碼 改
6.Min-height 最小高度 !Important 解決’
7.select 在ie6下遮蓋 使用iframe嵌套
8.為什么沒有辦法定義1px左右的寬度容器(IE6默認(rèn)的行
高造成的,使用over:hidden,zoom:0.08 line-height:1px)
11.標(biāo)簽上title與alt屬性的區(qū)別是什么?
Alt 當(dāng)圖片不顯示是 用文字代表。
Title 為該屬性提供信息
12.描述css reset的作用和用途。
Reset重置瀏覽器的css默認(rèn)屬性 瀏覽器的品種不同,
樣式不同,然后重置,讓他們統(tǒng)一
13.解釋css sprites,如何使用。
Css 精靈 把一堆小的圖片整合到一張大的圖片上,
減輕服務(wù)器對圖片的請求數(shù)量
14.瀏覽器標(biāo)準(zhǔn)模式和怪異模式之間的區(qū)別是什么?
盒子模型 渲染模式的不同
使用 window.top.document.compatMode
可顯示為什么模式
15.你如何對網(wǎng)站的文件和資源進(jìn)行優(yōu)化?期待的解決方案包括:
文件合并
文件最小化/文件壓縮
使用CDN托管
緩存的使用
16.什么是語義化的HTML?
直觀的認(rèn)識標(biāo)簽 對于搜索引擎的抓取有好處
17.清除浮動的幾種方式,各自的優(yōu)缺點(diǎn)
1.使用空標(biāo)簽清除浮動 clear:both(理論上能清楚
任何標(biāo)簽,,,增加無意義的標(biāo)簽)
2.使用overflow:auto(空標(biāo)簽元素清除浮動而不得
不增加無意代碼的弊端,,使用zoom:1用于兼容IE)
3.是用afert偽元素清除浮動(用于非IE瀏覽器)
Javascript
1.javascript的typeof返回哪些數(shù)據(jù)類型
Object number function boolean underfind
2.例舉3種強(qiáng)制類型轉(zhuǎn)換和2種隱式類型轉(zhuǎn)換?
強(qiáng)制(parseInt,parseFloat,number)
隱式(== – ===)
3.split() join() 的區(qū)別
前者是切割成數(shù)組的形式,后者是將數(shù)組轉(zhuǎn)換成字符串
4.數(shù)組方法pop() push() unshift() shift()
Push()尾部添加 pop()尾部刪除
Unshift()頭部添加 shift()頭部刪除
5.事件綁定和普通事件有什么區(qū)別
6.IE和DOM事件流的區(qū)別
1.執(zhí)行順序不一樣、
2.參數(shù)不一樣
3.事件加不加on
4.this指向問題
7.IE和標(biāo)準(zhǔn)下有哪些兼容性的寫法
Var ev = ev || window.event
document.documentElement.clientWidth || document.body.clientWidth
Var target = ev.srcElement||ev.target
8.ajax請求的時候get 和post方式的區(qū)別
一個在url后面 一個放在虛擬載體里面
有大小限制
安全問題
應(yīng)用不同 一個是論壇等只需要請求的,一個是類似修改密碼的
9.call和apply的區(qū)別
Object.call(this,obj1,obj2,obj3)
Object.apply(this,arguments)
10.ajax請求時,如何解釋json數(shù)據(jù)
使用eval parse 鑒于安全性考慮 使用parse更靠譜
11.b繼承a的方法
12.寫一個獲取非行間樣式的函數(shù)
function getStyle(obj, attr, value) { if (!value) { if (obj.currentStyle) { return obj.currentStyle(attr) } else { obj.getComputedStyle(attr, false) } } else { obj.style[attr] = value } }
13.事件委托是什么
讓利用事件冒泡的原理,讓自己的所觸發(fā)的事件,讓他的父元素代替執(zhí)行!
http://www.dbjr.com.cn/article/116997.htm例子可見此鏈接
14.閉包是什么,有什么特性,對頁面有什么影響
閉包就是能夠讀取其他函數(shù)內(nèi)部變量的函數(shù)。
1、將變量 i 保存給在每個段落對象(p)上
1. function init1() {
2. var pAry = document.getElementsByTagName("p");
3. for( var i=0; i<pAry.length; i++ ) {
4. pAry[i].i = i;
5. pAry[i].onclick = function() {
6. alert(this.i);
7. }
8. }
9. }
2、將變量 i 保存在匿名函數(shù)自身
1. function init2() {
2. var pAry = document.getElementsByTagName("p");
3. for( var i=0; i<pAry.length; i++ ) {
4. (pAry[i].onclick = function() {
5. alert(arguments.callee.i);
6. }).i = i;
7. }
8. }
3、加一層閉包,i 以函數(shù)參數(shù)形式傳遞給內(nèi)層函數(shù)
1. function init3() {
2. var pAry = document.getElementsByTagName("p");
3. for( var i=0; i<pAry.length; i++ ) {
4. (function(arg){
5. pAry[i].onclick = function() {
6. alert(arg);
7. };
8. })(i);//調(diào)用時參數(shù)
9. }
10.}
4、加一層閉包,i 以局部變量形式傳遞給內(nèi)層函數(shù)
1. function init4() {
2. var pAry = document.getElementsByTagName("p");
3. for( var i=0; i<pAry.length; i++ ) {
4. (function () {
5. var temp = i;//調(diào)用時局部變量
6. pAry[i].onclick = function() {
7. alert(temp);
8. }
9. })();
10. }
11.}
5、加一層閉包,返回一個函數(shù)作為響應(yīng)事件(注意與3的細(xì)微區(qū)別)
1. function init5() {
2. var pAry = document.getElementsByTagName("p");
3. for( var i=0; i < pAry.length; i++ ) {
4. pAry[i].onclick = function(arg) {
5. return function() {//返回一個函數(shù)
6. alert(arg);
7. }
8. }(i);
9. }
10.}
6、用Function實(shí)現(xiàn),實(shí)際上每產(chǎn)生一個函數(shù)實(shí)例就會產(chǎn)生一個閉包
1. function init6() {
2. var pAry = document.getElementsByTagName("p");
3. for( var i=0; i<pAry.length; i++ ) {
4. pAry[i].onclick = new Function("alert(" + i + ");");//new一次就產(chǎn)生一個函數(shù)實(shí)例
5. }
6. }
7、用Function實(shí)現(xiàn),注意與6的區(qū)別
1. function init7() {
2. var pAry = document.getElementsByTagName("p");
3. for( var i=0; i<pAry.length; i++ ) {
4. pAry[i].onclick = Function('alert('+i+')');
5. }
6. }
15.如何阻止事件冒泡和默認(rèn)事件
canceBubble return false
16.添加 刪除 替換 插入到某個接點(diǎn)的方法
obj.appendChidl()
obj.innersetBefore
obj.replaceChild
obj.removeChild
17.解釋jsonp的原理,以及為什么不是真正的ajax
動態(tài)創(chuàng)建script標(biāo)簽,回調(diào)函數(shù)
Ajax是頁面無刷新請求數(shù)據(jù)操作
18.javascript的本地對象,內(nèi)置對象和宿主對象
本地對象為array obj regexp等可以new實(shí)例化
內(nèi)置對象為gload Math 等不可以實(shí)例化的
宿主為瀏覽器自帶的document,window 等
19.document load 和document ready的區(qū)別
Document.onload 是在結(jié)構(gòu)和樣式加載完才執(zhí)行js
Document.ready原生種沒有這個方法,jquery中有
$().ready(function)
20.”==”和“===”的不同
前者會自動轉(zhuǎn)換類型
后者不會
21.javascript的同源策略
一段腳本只能讀取來自于同一來源的窗口和文檔的屬性,
這里的同一來源指的是主機(jī)名、協(xié)議和端口號的組合
22.編寫一個數(shù)組去重的方法
function oSort(arr)
{
var result ={};
var newArr=[];
for(var i=0;i < arr.length;i++)
{
if(!result[arr])
{
newArr.push(arr)
result[arr]=1
}
}
return newArr
}
23.媒體選擇器
@media (min-width: 992px) and (max-width: 1199px)
@media screen and (min-width: 768px)
HTML&CSS
1. 常用那幾種瀏覽器測試?有哪些內(nèi)核(Layout Engine)?
(Q1)瀏覽器:IE,Chrome,F(xiàn)ireFox,Safari,Opera。
(Q2)內(nèi)核:Trident,Gecko,Presto,Webkit。
2. 說下行內(nèi)元素和塊級元素的區(qū)別?行內(nèi)塊元素的兼容性使用?(IE8 以下)
(Q1)行內(nèi)元素:會在水平方向排列,不能包含塊級元素,設(shè)置width無效,
height無效(可以設(shè)置line-height),margin上下無效,padding上下無效。
塊級元素:各占據(jù)一行,垂直方向排列。從新行開始結(jié)束接著一個斷行。
(Q2)兼容性:display:inline-block;*display:inline;*zoom:1;
3.清除浮動有哪些方式?比較好的方式是哪一種?
(Q1)
(1)父級div定義height。
(2)結(jié)尾處加空div標(biāo)簽clear:both。
(3)父級div定義偽類:after和zoom。
(4)父級div定義overflow:hidden。
(5)父級div定義overflow:auto。
(6)父級div也浮動,需要定義寬度。
(7)父級div定義display:table。
(8)結(jié)尾處加br標(biāo)簽clear:both。
(Q2)比較好的是第3種方式,好多網(wǎng)站都這么用。
4.box-sizing常用的屬性有哪些?分別有什么作用?
(Q1)box-sizing: content-box|border-box|inherit;
(Q2)content-box:寬度和高度分別應(yīng)用到元素的內(nèi)容框。
在寬度和高度之外繪制元素的內(nèi)邊距和邊框(元素默認(rèn)效果)。
border-box:元素指定的任何內(nèi)邊距和邊框都將在已設(shè)定的
寬度和高度內(nèi)進(jìn)行繪制。通過從已設(shè)定的寬度和高度分別減
去邊框和內(nèi)邊距才能得到內(nèi)容的寬度和高度。
5.Doctype作用?標(biāo)準(zhǔn)模式與兼容模式各有什么區(qū)別?
(Q1)>!DOCTYPE<告知瀏覽器的解析器用什么文檔
標(biāo)準(zhǔn)解析這個文檔。DOCTYPE不存在或格式不正確會導(dǎo)致文
檔以兼容模式呈現(xiàn)。
(Q2)標(biāo)準(zhǔn)模式的排版和JS運(yùn)作模式都是以該瀏覽器支持的最
高標(biāo)準(zhǔn)運(yùn)行。在兼容模式中,頁面以寬松的向后兼容的方式
顯示,模擬老式瀏覽器的行為以防止站點(diǎn)無法工作。
6.HTML5 為什么只需要寫 >!DOCTYPE HTML<?
HTML5不基于 SGML,因此不需要對DTD進(jìn)行引用,但是
需要doctype來規(guī)范瀏覽器的行為(讓瀏覽器按照它們
應(yīng)該的方式來運(yùn)行)。
而HTML4.01基于SGML,所以需要對DTD進(jìn)行引用,才能
告知瀏覽器文檔所使用的文檔類型。
7.頁面導(dǎo)入樣式時,使用link和@import有什么區(qū)別?
(1)link屬于XHTML標(biāo)簽,除了加載CSS外,還能用
于定義RSS, 定義rel連接屬性等作用;而@import是CSS提
供的,只能用于加載CSS;
(2)頁面被加載的時,link會同時被加載,而@import引用
的CSS會等到頁面被加載完再加載;
(3)import是CSS2.1 提出的,只在IE5以上才能被識別,
而link是XHTML標(biāo)簽,無兼容問題;
8.介紹一下你對瀏覽器內(nèi)核的理解?
主要分成兩部分:渲染引擎(layout engineer或
Rendering Engine)和JS引擎。
渲染引擎:負(fù)責(zé)取得網(wǎng)頁的內(nèi)容(HTML、XML、圖像等等)、
整理訊息(例如加入CSS等),以及計算網(wǎng)頁的顯示方式,
然后會輸出至顯示器或打印機(jī)。瀏覽器的內(nèi)核的不同對于
網(wǎng)頁的語法解釋會有不同,所以渲染的效果也不相同。
所有網(wǎng)頁瀏覽器、電子郵件客戶端以及其它需要編輯、
顯示網(wǎng)絡(luò)內(nèi)容的應(yīng)用程序都需要內(nèi)核。
JS引擎則:解析和執(zhí)行javascript來實(shí)現(xiàn)網(wǎng)頁的動態(tài)效果。
最開始渲染引擎和JS引擎并沒有區(qū)分的很明確,后來JS引擎
越來越獨(dú)立,內(nèi)核就傾向于只指渲染引擎。
9.html5有哪些新特性?如何處理HTML5新標(biāo)簽的瀏覽器兼
容問題?如何區(qū)分 HTML 和 HTML5?
(Q1)
HTML5 現(xiàn)在已經(jīng)不是 SGML 的子集,主要是關(guān)于圖像,位置,存儲,多任務(wù)等功能的增加。
(1)繪畫 canvas;
(2)用于媒介回放的 video 和 audio 元素;
(3)本地離線存儲 localStorage 長期存儲數(shù)據(jù),瀏覽器關(guān)閉后數(shù)據(jù)不丟失;
(4)sessionStorage 的數(shù)據(jù)在瀏覽器關(guān)閉后自動刪除;
(5)語意化更好的內(nèi)容元素,比如 article、footer、header、nav、section;
(6)表單控件,calendar、date、time、email、url、search;
(7)新的技術(shù)webworker, websocket, Geolocation;
(Q2)
IE8/IE7/IE6支持通過document.createElement方法產(chǎn)生的標(biāo)簽,
可以利用這一特性讓這些瀏覽器支持HTML5新標(biāo)簽,
瀏覽器支持新標(biāo)簽后,還需要添加標(biāo)簽?zāi)J(rèn)的樣式。
當(dāng)然也可以直接使用成熟的框架、比如html5shim;
>!--[if lt IE 9]<
>script< src="http://html5shim.googlecode.com/svn/trunk/html5.js">/script<
>![endif]--<
10.簡述一下你對HTML語義化的理解?
用正確的標(biāo)簽做正確的事情。
html語義化讓頁面的內(nèi)容結(jié)構(gòu)化,結(jié)構(gòu)更清晰,便于對瀏覽器、搜索引擎解析;
即使在沒有樣式CSS情況下也以一種文檔格式顯示,并且是容易閱讀的;
搜索引擎的爬蟲也依賴于HTML標(biāo)記來確定上下文和各個關(guān)鍵字的權(quán)重,利于SEO;
使閱讀源代碼的人對網(wǎng)站更容易將網(wǎng)站分塊,便于閱讀維護(hù)理解。
JavaScript
1.介紹js的基本數(shù)據(jù)類型
Undefined、Null、Boolean、Number、String
2.js有哪些內(nèi)置對象?
數(shù)據(jù)封裝類對象:Object、Array、Boolean、Number 和 String
其他對象:Function、Arguments、Math、Date、RegExp、Error
3.this對象的理解
this總是指向函數(shù)的直接調(diào)用者(而非間接調(diào)用者);
如果有new關(guān)鍵字,this指向new出來的那個對象;
在事件中,this指向觸發(fā)這個事件的對象,特殊的是,IE中
的attachEvent中的this總是指向全局對象Window;
4.eval是做什么的?
它的功能是把對應(yīng)的字符串解析成JS代碼并運(yùn)行;
應(yīng)該避免使用eval,不安全,非常耗性能(2次,一次解析成js語句,一次執(zhí)行)。
由JSON字符串轉(zhuǎn)換為JSON對象的時候可以用eval,var obj =eval('('+ str +')');
5.DOM怎樣添加、移除、移動、復(fù)制、創(chuàng)建和查找節(jié)點(diǎn)
// 創(chuàng)建新節(jié)點(diǎn)
createDocumentFragment() //創(chuàng)建一個DOM片段
createElement() //創(chuàng)建一個具體的元素
createTextNode() //創(chuàng)建一個文本節(jié)點(diǎn)
// 添加、移除、替換、插入
appendChild()
removeChild()
replaceChild()
insertBefore() //在已有的子節(jié)點(diǎn)前插入一個新的子節(jié)點(diǎn)
// 查找
getElementsByTagName() //通過標(biāo)簽名稱
getElementsByName() //通過元素的Name屬性的值
(IE容錯能力較強(qiáng),會得到一個數(shù)組,其中包括id等于name值的)
getElementById() //通過元素Id,唯一性
6.null和undefined的區(qū)別?
null是一個表示"無"的對象,轉(zhuǎn)為數(shù)值時為0;undefined是一
個表示"無"的原始值,轉(zhuǎn)為數(shù)值時為NaN。
undefined:
(1)變量被聲明了,但沒有賦值時,就等于undefined。
(2) 調(diào)用函數(shù)時,應(yīng)該提供的參數(shù)沒有提供,該參數(shù)等于undefined。
(3)對象沒有賦值的屬性,該屬性的值為undefined。
(4)函數(shù)沒有返回值時,默認(rèn)返回undefined。
null:
(1) 作為函數(shù)的參數(shù),表示該函數(shù)的參數(shù)不是對象。
(2) 作為對象原型鏈的終點(diǎn)。
7.new操作符具體干了什么呢?
(1)創(chuàng)建一個空對象,并且 this 變量引用該對象,
同時還繼承了該函數(shù)的原型。
(2)屬性和方法被加入到 this 引用的對象中。
(3)新創(chuàng)建的對象由 this 所引用,并且最后隱式的返回 this 。
8.JSON 的了解?
JSON(JavaScript Object Notation) 是一種輕
量級的數(shù)據(jù)交換格式。它是基于JavaScript的一個子集。
數(shù)據(jù)格式簡單, 易于讀寫, 占用帶寬小。
格式:采用鍵值對,例如:{'age':'12', 'name':'back'}
9.call() 和 apply() 的區(qū)別和作用?
apply()函數(shù)有兩個參數(shù):第一個參數(shù)是上下文,第二個
參數(shù)是參數(shù)組成的數(shù)組。如果上下文是null,則使用全局對象代替。
如:function.apply(this,[1,2,3]);
call()的第一個參數(shù)是上下文,后續(xù)是實(shí)例傳入的參數(shù)序列。
如:function.call(this,1,2,3);
10.如何獲取UA?
function whatBrowser() {
document.Browser.Name.value=navigator.appName;
document.Browser.Version.value=navigator.appVersion;
document.Browser.Code.value=navigator.appCodeName;
document.Browser.Agent.value=navigator.userAgent;
}
其他
1.HTTP狀態(tài)碼知道哪些?
100 Continue 繼續(xù),一般在發(fā)送post請求時,已發(fā)送了
http header之后服務(wù)端將返回此信息,表示確認(rèn),之后發(fā)送具體參數(shù)信息
200 OK 正常返回信息
201 Created 請求成功并且服務(wù)器創(chuàng)建了新的資源
202 Accepted 服務(wù)器已接受請求,但尚未處理
301 Moved Permanently 請求的網(wǎng)頁已永久移動到新位置。
302 Found 臨時性重定向。
303 See Other 臨時性重定向,且總是使用 GET 請求新的 URI。
304 Not Modified 自從上次請求后,請求的網(wǎng)頁未修改過。
400 Bad Request 服務(wù)器無法理解請求的格式,客戶端不應(yīng)當(dāng)嘗試再次使用相同的內(nèi)容發(fā)起請求。
401 Unauthorized 請求未授權(quán)。
403 Forbidden 禁止訪問。
404 Not Found 找不到如何與 URI 相匹配的資源。
500 Internal Server Error 最常見的服務(wù)器端錯誤。
503 Service Unavailable 服務(wù)器端暫時無法處理請求(可能是過載或維護(hù))。
2.你有哪些性能優(yōu)化的方法?
(1) 減少http請求次數(shù):CSS Sprites, JS、CSS源碼壓縮、圖片大
小控制合適;網(wǎng)頁Gzip,CDN托管,data緩存 ,圖片服務(wù)器。
(2) 前端模板 JS+數(shù)據(jù),減少由于HTML標(biāo)簽導(dǎo)致的帶寬浪費(fèi),
前端用變量保存AJAX請求結(jié)果,每次操作本地變量,不用請求,減少請求次數(shù)
(3) 用innerHTML代替DOM操作,減少DOM操作次數(shù),優(yōu)化javascript性能。
(4) 當(dāng)需要設(shè)置的樣式很多時設(shè)置className而不是直接操作style。
(5) 少用全局變量、緩存DOM節(jié)點(diǎn)查找的結(jié)果。減少IO讀取操作。
(6) 避免使用CSS Expression(css表達(dá)式)又稱Dynamic properties(動態(tài)屬性)。
(7) 圖片預(yù)加載,將樣式表放在頂部,將腳本放在底部 加上時間戳。
3.什么叫優(yōu)雅降級和漸進(jìn)增強(qiáng)?
優(yōu)雅降級:Web站點(diǎn)在所有新式瀏覽器中都能正常工作,如果用戶使
用的是老式瀏覽器,則代碼會檢查以確認(rèn)它們是否能正常工作。
由于IE獨(dú)特的盒模型布局問題,針對不同版本的IE的hack實(shí)踐
過優(yōu)雅降級了,為那些無法支持功能的瀏覽器增加候選方案,
使之在舊式瀏覽器上以某種形式降級體驗(yàn)卻不至于完全失效.
漸進(jìn)增強(qiáng):從被所有瀏覽器支持的基本功能開始,逐步地添加那些
只有新式瀏覽器才支持的功能,向頁面增加無害于基礎(chǔ)瀏覽器的額
外樣式和功能的。當(dāng)瀏覽器支持時,它們會自動地呈現(xiàn)出來并發(fā)揮作用。
4.哪些常見操作會造成內(nèi)存泄漏?
內(nèi)存泄漏指任何對象在您不再擁有或需要它之后仍然存在。
垃圾回收器定期掃描對象,并計算引用了每個對象的其他對象的數(shù)量。
如果一個對象的引用數(shù)量為 0(沒有其他對象引用過該對象),
或?qū)υ搶ο蟮奈┮灰檬茄h(huán)的,那么該對象的內(nèi)存即可回收。
setTimeout 的第一個參數(shù)使用字符串而非函數(shù)的話,會引發(fā)內(nèi)存泄漏。
閉包、控制臺日志、循環(huán)(在兩個對象彼此引用且彼此保留時,就會產(chǎn)生一個循環(huán))
5.線程與進(jìn)程的區(qū)別
一個程序至少有一個進(jìn)程,一個進(jìn)程至少有一個線程.
線程的劃分尺度小于進(jìn)程,使得多線程程序的并發(fā)性高。
另外,進(jìn)程在執(zhí)行過程中擁有獨(dú)立的內(nèi)存單元,而多個線程共享內(nèi)存,
從而極大地提高了程序的運(yùn)行效率。
線程在執(zhí)行過程中與進(jìn)程還是有區(qū)別的。每個獨(dú)立的線程有一個程
序運(yùn)行的入口、順序執(zhí)行序列和程序的出口。但是線程不能夠獨(dú)立
執(zhí)行,必須依存在應(yīng)用程序中,由應(yīng)用程序提供多個線程執(zhí)行控制。
從邏輯角度來看,多線程的意義在于一個應(yīng)用程序中,有多個執(zhí)行
部分可以同時執(zhí)行。但操作系統(tǒng)并沒有將多個線程看做多個獨(dú)立的
應(yīng)用,來實(shí)現(xiàn)進(jìn)程的調(diào)度和管理以及資源分配。這就是進(jìn)程和線程
的重要區(qū)別。
前端開發(fā)工程師面試題 Javascript
1. 要動態(tài)改變層中內(nèi)容可以使用的方法有(AB )
a)innerHTML
b)innerText
c)通過設(shè)置層的隱藏和顯示來實(shí)現(xiàn)
d)通過設(shè)置層的樣式屬性的display屬性
2. 當(dāng)按鍵盤A時,使用onKeyDown事件打印event.keyCode的結(jié)果是(A )
a)65
b)13
c)97
d)37
3. 在javascript里,下列選項(xiàng)中不屬于數(shù)組方法的是(B);
a)sort()
b)length()
c)concat()
d)reverse()
4. 下列哪一個選項(xiàng)可以用來檢索被選定的選項(xiàng)的索引號?(B)
a)disabled
b)selectedIndex
c)option
d)multiple
5. 希望圖片具有”提交”按鈕同樣的功能,該如何編寫表單提交?(A )
a)在圖片的onClick事件中手動提交
b)在圖片上添加onSubmit事件
c)在圖片的onSubmit事件中手動提交
d)在表單中自動提交
6. 使div層和文本框處在同一行的代碼正確的是(D );
a)
b)
c)
d)
7. 下列選項(xiàng)中,描述正確的是(選擇兩項(xiàng)) 。( AD )
a)options.add(new Option(‘a’,'A’))可以動態(tài)添加一個下拉列表選項(xiàng)
b)option.add(new Option(‘a’,'A’))可以動態(tài)添加一個下拉列表選項(xiàng)
c)new Option(‘a’,'A’)中’a'表示列表選項(xiàng)的值,’A'用于在頁面中顯示
d)new Option(‘a’,'A’)中’A'表示列表選項(xiàng)的值,’a'用于在頁面中顯示
8. 、 var emp = new Array(3);
for(var i in emp)
以下答案中能與for循環(huán)代碼互換的是: (選擇一項(xiàng))。(D )
A for(var i =0; i
B for(var i =0; i
C for(var i =0; i
D for(var i =0; i
9. 制作級聯(lián)菜單功能時調(diào)用的是下拉列表框的(A )事件。
a)onChange
b)onFocus
c)selected
d)onClick
10. 下列聲明數(shù)組的語句中,錯誤的選項(xiàng)是( C )。
a)Var arry= new Array()
b)Var arry=new Array(3)
c)Var arry[]=new Array(3)(4)
d)Var arry=new Array(‘3’,’4’)
11. 下列屬性哪一個能夠?qū)崿F(xiàn)層的隱藏?(C )
a)display:fals
b)display:hidden
c)display:none
d)display:” ”
12. 下列哪一個選項(xiàng)不屬于document對象的方法?(D )
a)focus()
b)getElementById()
c)getElementsByName()
d)bgColor()
13. 下列哪項(xiàng)是按下鍵盤事件(AB )
a)onKeyDown
b)onKeyPress
c)keyCode
d)onMouseOver
14. javascript進(jìn)行表單驗(yàn)證的目的是(B )
a)把用戶的正確信息提交給服務(wù)器
b)檢查提交的數(shù)據(jù)必須符合實(shí)際
c)使得頁面變得美觀、大方
d)減輕服務(wù)器端的壓力
15. 、 display屬性值的常用取值不包括(C )
a)inline
b)block
c)hidden
d)none
16. 以下有關(guān)pixelTop屬性與top屬性的說法正確的是。(D )
a)都是Location對象的屬性
b)使用時返回值都是字符串
c)都是返回以像素為單位的數(shù)值
d)以上都不對
17. 使用open方法打開具有瀏覽器工具條,地址欄,菜單欄的窗口,下列選項(xiàng)正確的是__D__
a)open("x.html","HI","toolbas=1,scrollbars=1,status=1");
b)open("HI","scrollbars=1,location=1,status=1");
c)open("x.html","status=yes,menubar=1,location=1");
d)open("x.html","HI","toolbas=yes,menubar=1,location=1");
18. 下面關(guān)閉名為mydiv的層的代碼正確的是(C )
a)document.getElementByIdx_x_x_x(mydiv).style.display="none";
b)document.getElementByIdx_x_x_x("mydiv").style.display=none;
c)document.getElementByIdx_x_x_x("mydiv").style.display="none";
d)document.getElementByIdx_x_x_x("mydiv").style.display=="none";
19. 為什么要使用Div+CSS布局
形式與內(nèi)容分離
大大減少頁面代碼,提高頁面瀏覽速度
結(jié)構(gòu)清晰,有利于SEO
縮短改版時間, 布局更方便
一次設(shè)計,多次使用
20. Block元素的特點(diǎn)是什么?哪些元素默認(rèn)為Block元素
總是在新行上開始;
高度,行高以及頂和底邊距都可控制;
寬度缺省是它的容器的100%,除非設(shè)定一個寬度
是塊元素的有:,,
,
, 和21. 、 inline元素的特點(diǎn)是什么?哪些元素屬于inline元素?
和其他元素都在一行上;
高,行高及頂和底邊距不可改變;
寬度就是它的文字或圖片的寬度,不可改變。
是inline元素的有:, , ,
, ,
和。
22. 、 javascript中表達(dá)式parseInt(“X8X8”)+paseFloat(‘8’)的結(jié)果是什么?( C)
a)8+8
b)88
c)16
d)“8”+’8
23. String對象的方法不包括(C )
a)charAt();
b)substring()
c)length
d)toUpperCase()
24. 關(guān)于setTimeout(“check”,10)中說法正確的是( D)
a)程序循環(huán)執(zhí)行10次
b)Check函數(shù)每10秒執(zhí)行一次
c)10做為參數(shù)傳給函數(shù)check
d)Check函數(shù)每10毫秒執(zhí)行一次
25. 以下哪個單詞不屬于javascript關(guān)鍵字:(C)
a)with
b)parent
c)class
d)void
前言
本文總結(jié)了一些優(yōu)質(zhì)的前端面試題(多數(shù)源于網(wǎng)絡(luò)),初學(xué)者閱后也要用心鉆研其中的原理,重要知識需要系統(tǒng)學(xué)習(xí),透徹學(xué)習(xí),形成自己的知識鏈。萬不可投機(jī)取巧,只求面試過關(guān)是錯誤的!
面試有幾點(diǎn)需注意:(來源程劭非老師 github:@wintercn)
面試題目: 根據(jù)你的等級和職位變化,入門級到專家級:范圍↑、深度↑、方向↑。
題目類型: 技術(shù)視野、項(xiàng)目細(xì)節(jié)、理論知識題,算法題,開放性題,案例題。
進(jìn)行追問: 可以確保問到你開始不懂或面試官開始不懂為止,這樣可以大大延展題目的區(qū)分度和深度,知道你的實(shí)際能力。因?yàn)檫@種關(guān)聯(lián)知識是長時期的學(xué)習(xí),絕對不是臨時記得住的。
回答問題再棒,面試官(可能是你的直接領(lǐng)導(dǎo)面試),會考慮我要不要這個人做我的同事?所以態(tài)度很重要。(感覺更像是相親)
資深的工程師能把 absolute 和 relative 弄混,這樣的人不要也罷,因?yàn)閳F(tuán)隊(duì)需要的你這個人具有可以依靠的才能(靠譜)。
前端開發(fā)面試知識點(diǎn)大綱:
HTML&CSS:
對Web標(biāo)準(zhǔn)的理解、瀏覽器內(nèi)核差異、兼容性、hack、CSS基本功:布局、盒子模型、選擇器優(yōu)先級及使用、HTML5、CSS3、移動端適應(yīng)
JavaScript:
數(shù)據(jù)類型、面向?qū)ο?、繼承、閉包、插件、作用域、跨域、原型鏈、模塊化、自定義事件、內(nèi)存泄漏、事件機(jī)制、異步裝載回調(diào)、模板引擎、Nodejs、JSON、ajax等。
其他:
HTTP、安全、正則、優(yōu)化、重構(gòu)、響應(yīng)式、移動端、團(tuán)隊(duì)協(xié)作、可維護(hù)、SEO、UED、架構(gòu)、職業(yè)生涯
作為一名前端工程師,無論工作年頭長短都應(yīng)該必須掌握的知識點(diǎn):
此條由 王子墨 發(fā)表在 前端隨筆
1、DOM結(jié)構(gòu) —— 兩個節(jié)點(diǎn)之間可能存在哪些關(guān)系以及如何在節(jié)點(diǎn)之間任意移動。
2、DOM操作 ——如何添加、移除、移動、復(fù)制、創(chuàng)建和查找節(jié)點(diǎn)等。
3、事件 —— 如何使用事件,以及IE和標(biāo)準(zhǔn)DOM事件模型之間存在的差別。
4、XMLHttpRequest —— 這是什么、怎樣完整地執(zhí)行一次GET請求、怎樣檢測錯誤。
5、嚴(yán)格模式與混雜模式 —— 如何觸發(fā)這兩種模式,區(qū)分它們有何意義。
6、盒模型 —— 外邊距、內(nèi)邊距和邊框之間的關(guān)系,及IE8以下版本的瀏覽器中的盒模型
7、塊級元素與行內(nèi)元素 —— 怎么用CSS控制它們、以及如何合理的使用它們
8、浮動元素——怎么使用它們、它們有什么問題以及怎么解決這些問題。
9、HTML與XHTML——二者有什么區(qū)別,你覺得應(yīng)該使用哪一個并說出理由。
10、JSON —— 作用、用途、設(shè)計結(jié)構(gòu)。
相關(guān)文章
- 這篇文章主要介紹了前端HTML+CSS筆試題面試題,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2019-10-15
- 這篇文章主要介紹了騰訊前端面試題相關(guān)知識點(diǎn),整理總結(jié)了騰訊前端面試中所涉及的相關(guān)基礎(chǔ)知識點(diǎn)與疑難問題,需要的朋友可以參考下2019-08-27
- 這篇文章主要介紹了這是今年前端最常見的面試題,面試其實(shí)是一個交流想法的地方,挑戰(zhàn)人們的思考方式,并客觀地分析給定的問題,下面就一起來了解一下2019-07-18
- 這里就先針對let、this相關(guān)的題,可能比較類似,針對性的多做相似題加深印象。本文是小編給大家整理的關(guān)于前端常見面試題總結(jié),感興趣的朋友一起看看吧2019-11-12
- 本文是小編給大家收藏整理的一些關(guān)于前端高頻率出現(xiàn)的面試題,非常不錯,具有一定的參考借鑒價值,需要的朋友跟隨小編一起看看吧2019-05-20
- 求職者怎樣才能成功的面試上HTML5開發(fā)工程師崗位呢?除了要有一份精美的簡歷,還得做好充足的面試準(zhǔn)備,其中最重要的是需要了解一些用人企業(yè)常問的HTML5面試題和套路,下面2018-07-03
BAT及各大互聯(lián)網(wǎng)公司2014前端筆試面試題(Html,Css篇)
很多面試題是我自己面試BAT親身經(jīng)歷碰到的。整理分享出來希望更多的前端er共同進(jìn)步吧,不僅適用于求職者,對于鞏固復(fù)習(xí)前端基礎(chǔ)更是大有裨益2014-10-29- 本文給大家分享面試官常問的前端面試題,感興趣的朋友跟隨小編一起看看吧2019-11-08