怎樣找到前端面試題

paragraph

㈡ 2020年Web前端面試題匯總(一)

今天小編要跟大家分享的文章是關於2020年Web前端面試題匯總。由於內容較多小編分開為大家介紹，今天首先來和小編一起看一看第一部分的內容，希望這些面試題能夠對正准備找Web前端相關工作的小夥伴們有所幫助。

1.說幾條寫JavaScript的基本規范?


1)不要在同一行聲明多個變數;


2)請使用===/!==來比較true/false或者數值;


3)使用對象字面量替代newObject這種形式;


4)減少使用全局函數,全局變數;


5)switch語句必須帶有default分支;


6)if語句必須使用大括弧;


7)for-in循環中的變數;


應該使用var關鍵字明確限定作用域;


從而避免作用域全局污染。


2.說說平衡二叉樹?


平衡二叉搜索樹(Self-balancingbinarysearchtree)


又被稱為AVL樹。


具有以下性質：


1)它是一棵空樹或它的左右兩個子樹


的高度差的絕對值不超過1，


並且左右兩個子樹都是一棵平衡二叉樹。


2)平衡二叉樹必定是二叉搜索樹，反之則不一定。


3)平衡二叉樹的常用實現方法有紅黑樹、AVL、


替罪羊樹、Treap、伸展樹等。


最小二叉平衡樹的節點的公式如下：


F(n)=F(n-1)+F(n-2)+1備註：1是根節點，


F(n-1)是左子樹的節點數量，


F(n-2)是右子樹的節點數量。


3.清除浮動和解決垂直外邊距重疊的解決方案?


問題描述:


1)父元素沒有設置寬高，尺寸由子元素撐起;


子元素一旦浮動，父元素高度會發生塌陷。


2)子元素設置margin-top會作用的父元素的margin-top;


此時會造成垂直外邊距重疊。


.clearfix::after,.clearfix::before{


content:''


display:table;


clear:both;


}


4.sessionStorage、localStorage和cookie?


相同點:


都用於瀏覽器端存儲的緩存數據;


不同點:


1)存儲內容是否發送到伺服器端


當設置了Cookie後，數據會發送到伺服器端，


造成一定的寬頻浪費;xxxstorage則會將數據保存


到本地，不會造成寬頻浪費;


2)數據存儲大小不同


Cookie數據不能超過4K，適用於會話標識;


xxxstorage數據存儲可以達到5M;


3)數據存儲的有效期限不同


cookie只在設置了Cookid過期時間


之前一直有效，即使關閉窗口或者瀏覽器;


sessionStorage,僅在關閉瀏覽器之前有效;


localStorage,數據存儲永久有效;


4)作用域不同


cookie和localStorage是在同源同窗口中


都是共享的;


sessionStorage不在不同的瀏覽器窗口


中共享，即使是同一個頁面;


5.判斷一個單詞是否是迴文?


迴文是指把相同的詞彙或句子，


在下文中調換位置或顛倒過來，


產生首尾回環的情景，


叫做迴文，也叫回環。


比如cacac，redivider。


letcheckPalindrom=(str)=>{


returnstr===


str.split('').reverse().join('');


}


6.不藉助臨時變數，進行兩個整數的交換?


輸入a=3,b=1,


輸出a=1,b=3


letswap=(a,b)=>{


b=b-a;


a=a+b;


b=a-b;


return[a,b];


}


7.請寫出至少5個html5新增的標簽，並說明其語義和應用場景?


section：定義文檔中的一個章節;


nav：定義只包含導航鏈接的章節;


header：定義頁面或章節的頭部;


它經常包含logo、頁面標題和導航性的目錄。


footer：定義頁面或章節的尾部;


它經常包含版權信息、法律信息鏈接和反饋建議用的地址。


aside：定義和頁面內容關聯度較低的內容，


如果被刪除，剩下的內容仍然很合理。


8.get和post請求在緩存方面的區別?


get請求類似於查找的過程，用戶獲取數據，


可以不用每次都與資料庫連接，所以可以使用緩存。


post不同，post做的一般是修改和刪除的工作，


所以必須與資料庫交互，所以不能使用緩存。


因此get請求適合於請求緩存。


9.如何解決非同步回調地獄?


promise、generator、async/await


10.圖片的懶載入和預載入?


預載入：提前載入圖片，


當用戶需要查看時可直接


從本地緩存中渲染。


懶載入：懶載入的主要目的


是作為伺服器前端的優化，


減少請求數或延遲請求數。


兩種技術的本質：


兩者的行為是相反的，


一個是提前載入，


一個是遲緩甚至不載入。


懶載入對伺服器前端有一定


的緩解壓力作用，


預載入則會增加伺服器前端壓力。


11.bind，apply，call的區別?


通過apply和call改變函數的this指向，


這兩個函數的第一個參數都是一樣的，


表示要改變指向的那個對象，


第二個參數，apply是數組，


而call則是arg1,arg2...這種形式。


通過bind改變this作用域


會返回一個新的函數，


這個函數不會馬上執行。


12.js怎麼控制一次載入一張圖片，載入完後再載入下一張?


方法一:





varobj=newImage();


obj.src="#/21.jpg";


obj.onload=function(){


document.getElementById("pic")


.innnerHTML="";


}


載入中

㈢ 前端開發工程師面試題目大全

HTML

Doctype作用？嚴格模式與混雜模式如何區分？它們有何意義?


HTML5為什麼只需要寫？


行內元素有哪些？塊級元素有哪些？空(void)元素有那些？


頁面導入樣式時，使用link和@import有什麼區別？


介紹一下你對瀏覽器內核的理解？


常見的瀏覽器內核有哪些？


html5有哪些新特性、移除了那些元素？如何處理HTML5新標簽的瀏覽器兼容問題？如何區分HTML和HTML5？


簡述一下你對HTML語義化的理解？


HTML5的離線儲存怎麼使用，工作原理能不能解釋一下？


瀏覽器是怎麼對HTML5的離線儲存資源進行管理和載入的呢？


請描述一下cookies，sessionStorage和localStorage的區別？


iframe有那些缺點？


Label的作用是什麼？是怎麼用的？（加for或包裹）


HTML5的form如何關閉自動完成功能？


如何實現瀏覽器內多個標簽頁之間的通信?(阿里)


webSocket如何兼容低瀏覽器？(阿里)


頁面可見性（PageVisibilityAPI）可以有哪些用途？


如何在頁面上實現一個圓形的可點擊區域？


實現不使用border畫出1px高的線，在不同瀏覽器的Quirksmode和CSSCompat模式下都能保持同一效果。


網頁驗證碼是幹嘛的，是為了解決什麼安全問題？


title與h1的區別、b與strong的區別、i與em的區別？


CSS


介紹一下標準的CSS的盒子模型？低版本IE的盒子模型有什麼不同的？


CSS選擇符有哪些？哪些屬性可以繼承？


CSS優先順序演算法如何計算？


CSS3新增偽類有那些？


如何居中div？如何居中一個浮動元素？如何讓絕對定位的div居中？


display有哪些值？說明他們的作用。


position的值relative和absolute定位原點是？


CSS3有哪些新特性？


請解釋一下CSS3的Flexbox（彈性盒布局模型）,以及適用場景？


用純CSS創建一個三角形的原理是什麼？


css多列等高如何實現？


一個滿屏品字布局如何設計?


經常遇到的瀏覽器的兼容性有哪些？原因，解決方法是什麼，常用hack的技巧？


li與li之間有看不見的空白間隔是什麼原因引起的？有什麼解決辦法？


為什麼要初始化CSS樣式?


absolute的containingblock計算方式跟正常流有什麼不同？


CSS里的visibility屬性有個collapse屬性值是幹嘛用的？在不同瀏覽器下以後什麼區別？


position跟display、margincollapse、overflow、float這些特性相互疊加後會怎麼樣？


對BFC規范(塊級格式化上下文：blockformattingcontext)的理解？


CSS權重優先順序是如何計算的？


請解釋一下為什麼需要清除浮動？清除浮動的方式


zoom:1的清楚浮動原理?


移動端的布局用過媒體查詢嗎？


使用CSS預處理器嗎？喜歡那個？


CSS優化、提高性能的方法有哪些？


瀏覽器是怎樣解析CSS選擇器的？


在網頁中的應該使用奇數還是偶數的字體？為什麼呢？


margin和padding分別適合什麼場景使用？


抽離樣式模塊怎麼寫，說出思路，有無實踐經驗？[阿里航旅的面試題]


元素豎向的百分比設定是相對於容器的高度嗎？


全屏滾動的原理是什麼？用到了CSS的那些屬性？


什麼是響應式設計？響應式設計的基本原理是什麼？如何兼容低版本的IE？


視差滾動效果，如何給每頁做不同的動畫？（回到頂部，向下滑動要再次出現，和只出現一次分別怎麼做？）


::before和:after中雙冒號和單冒號有什麼區別？解釋一下這2個偽元素的作用。


如何修改chrome記住密碼後自動填充表單的黃色背景？


你對line-height是如何理解的？


設置元素浮動後，該元素的display值是多少？（自動變成display:block）


怎麼讓Chrome支持小於12px的文字？


讓頁面里的字體變清晰，變細用CSS怎麼做？（-webkit-font-smoothing:antialiased;）


font-style屬性可以讓它賦值為「oblique」oblique是什麼意思？


position:fixed;在android下無效怎麼處理？


如果需要手動寫動畫，你認為最小時間間隔是多久，為什麼？（阿里）


display:inline-block什麼時候會顯示間隙？(攜程)


overflow:scroll時不能平滑滾動的問題怎麼處理？


有一個高度自適應的div，裡面有兩個div，一個高度100px，希望另一個填滿剩下的高度。


png、jpg、gif這些圖片格式解釋一下，分別什麼時候用。有沒有了解過webp？


什麼是Cookie隔離？（或者說：請求資源的時候不要讓它帶cookie怎麼做）


style標簽寫在body後與body前有什麼區別？


什麼是CSS預處理器/後處理器？


JavaScript


介紹JavaScript的基本數據類型。


說說寫JavaScript的基本規范？


JavaScript原型，原型鏈?有什麼特點？


JavaScript有幾種類型的值？（堆：原始數據類型和棧：引用數據類型），你能畫一下他們的內存圖嗎？


Javascript如何實現繼承？


Javascript創建對象的幾種方式？


Javascript作用鏈域?


談談this對象的理解。


eval是做什麼的？


什麼是window對象?什麼是document對象?


null，undefined的區別？


寫一個通用的事件偵聽器函數(機試題)。


["1","2","3"].map(parseInt)答案是多少？


關於事件，IE與火狐的事件機制有什麼區別？如何阻止冒泡？


什麼是閉包（closure），為什麼要用它？


javascript代碼中的"usestrict";是什麼意思?使用它區別是什麼？


如何判斷一個對象是否屬於某個類？


new操作符具體幹了什麼呢?


用原生JavaScript的實現過什麼功能嗎？


Javascript中，有一個函數，執行時對象查找時，永遠不會去查找原型，這個函數是？


對JSON的了解？


[].forEach.call($$("*"),function(a){a.style.outline="1pxsolid#"+(~~(Math.random()*(1<<24))).toString(16)})能解釋一下這段代碼的意思嗎？


js延遲載入的方式有哪些？


Ajax是什麼?如何創建一個Ajax？


同步和非同步的區別?


如何解決跨域問題?


頁面編碼和被請求的資源編碼如果不一致如何處理？


模塊化開發怎麼做？


AMD（Moles/Asynchronous-Definition）、CMD（CommonMoleDefinition）規范區別？


requireJS的核心原理是什麼？（如何動態載入的？如何避免多次載入的？如何緩存的？）


JS模塊載入器的輪子怎麼造，也就是如何實現一個模塊載入器？


談一談你對ECMAScript6的了解？


ECMAScript6怎麼寫class，為什麼會出現class這種東西?


非同步載入的方式有哪些？


documen.write和innerHTML的區別?


DOM操作——怎樣添加、移除、移動、復制、創建和查找節點?


.call()和.apply()的作用和區別？


數組和對象有哪些原生方法，列舉一下？


JS怎麼實現一個類。怎麼實例化這個類


JavaScript中的作用域與變數聲明提升？


如何編寫高性能的Javascript？


那些操作會造成內存泄漏？


JQuery的源碼看過嗎？能不能簡單概況一下它的實現原理？


jQuery.fn的init方法返回的this指的是什麼對象？為什麼要返回this？


jquery中如何將數組轉化為json字元串，然後再轉化回來？


jQuery的屬性拷貝(extend)的實現原理是什麼，如何實現深拷貝？


jquery.extend與jquery.fn.extend的區別？


jQuery的隊列是如何實現的？隊列可以用在哪些地方？


談一下Jquery中的bind(),live(),delegate(),on()的區別？


JQuery一個對象可以同時綁定多個事件，這是如何實現的？


是否知道自定義事件。jQuery里的fire函數是什麼意思，什麼時候用？


jQuery是通過哪個方法和Sizzle選擇器結合的？（jQuery.fn.find()進入Sizzle）


針對jQuery性能的優化方法？


Jquery與jQueryUI有啥區別？


JQuery的源碼看過嗎？能不能簡單說一下它的實現原理？


jquery中如何將數組轉化為json字元串，然後再轉化回來？


jQuery和Zepto的區別？各自的使用場景？


針對jQuery的優化方法？


Zepto的點透問題如何解決？


jQueryUI如何自定義組件?


需求：實現一個頁面操作不會整頁刷新的網站，並且能在瀏覽器前進、後退時正確響應。給出你的技術實現方案？


如何判斷當前腳本運行在瀏覽器還是node環境中？（阿里）


移動端最小觸控區域是多大？


jQuery的slideUp動畫，如果目標元素是被外部事件驅動,當滑鼠快速地連續觸發外部元素事件,動畫會滯後的反復執行，該如何處理呢?


把Script標簽放在頁面的最底部的body封閉之前和封閉之後有什麼區別？瀏覽器會如何解析它們？


移動端的點擊事件的有延遲，時間是多久，為什麼會有？怎麼解決這個延時？（click有300ms延遲,為了實現safari的雙擊事件的設計，瀏覽器要知道你是不是要雙擊操作。）


知道各種JS框架(Angular,Backbone,Ember,React,Meteor,Knockout...)么?能講出他們各自的優點和缺點么?


Underscore對哪些JS原生對象進行了擴展以及提供了哪些好用的函數方法？


解釋JavaScript中的作用域與變數聲明提升？


那些操作會造成內存泄漏？


JQuery一個對象可以同時綁定多個事件，這是如何實現的？


Node.js的適用場景？


(如果會用node)知道route,middleware,cluster,nodemon,pm2,server-siderendering么?


解釋一下Backbone的MVC實現方式？


什麼是「前端路由」?什麼時候適合使用「前端路由」?「前端路由」有哪些優點和缺點?


知道什麼是webkit么?知道怎麼用瀏覽器的各種工具來調試和debug代碼么?


如何測試前端代碼么?知道BDD,TDD,UnitTest么?知道怎麼測試你的前端工程么(mocha,sinon,jasmin,qUnit..)?


前端templating(Mustache,underscore,handlebars)是幹嘛的,怎麼用?


簡述一下Handlebars的基本用法？


簡述一下Handlerbars的對模板的基本處理流程，如何編譯的？如何緩存的？


用js實現千位分隔符?(提示：正則+replace)


檢測瀏覽器版本版本有哪些方式？


WhatisaPolyfill?


做的項目中，有沒有用過或自己實現一些polyfill方案（兼容性處理方案）？


我們給一個dom同時綁定兩個點擊事件，一個用捕獲，一個用冒泡。會執行幾次事件，會先執行冒泡還是捕獲？


使用JS實現獲取文件擴展名？


答案自己先慢慢找哈。

㈣ 2019Web前端面試題及答案匯總-Jquery篇

今天小編要跟大家分享的文章是關於2019Web前端面試題及答案匯總-Jquery篇。相信最近准備參加Web前端面試的小夥伴一定不在少數，為了幫助大家順利的通過面試成為一名優秀的Web前端工程師，小編為大家准備了前端面試題系列，通過Web知識的整理以及經驗的總結，希望能幫到更多的前端面試者。

Jquery相關


1、jQuery庫中的$()是什麼?


$()函數是jQuery()函數的別稱。$()函數用於將任何對象包裹成jQuery對象，接著你就被允許調用定義在jQuery
對象上的多個不同方法。你可以將一個選擇器字元串傳入$()函數，它會返回一個包含所有匹配的DOM元素數組的jQuery對象。


2、如何找到所有HTMLselect標簽的選中項?


$('[name=selectname]:selected')


3、$(this)和this關鍵字在jQuery中有何不同?


$(this)返回一個jQuery對象，你可以對它調用多個jQuery方法，比如用text()獲取文本，用val()
獲取值等等。


而this代表當前元素，它是JavaScript關鍵詞中的一個，表示上下文中的當前DOM元素。你不能對它調用jQuery方法，直到它被
$()函數包裹，例如$(this)。


4、jquery怎麼移除標簽onclick屬性?


獲得a標簽的onclick屬性:$("a").attr("onclick")


刪除onclick屬性：$("a").removeAttr("onclick")


設置onclick屬性：$("a").attr("onclick","test();")


5、jquery中addClass、removeClass、toggleClass的使用。


$(selector).addClass(class)：為每個匹配的元素添加指定的類名


$(selector).removeClass(class)：從所有匹配的元素中刪除全部或者指定的類，刪除class中某個值;


$(selector).toggleClass(class)：如果存在(不存在)就刪除(添加)一個類


$(selector).removeAttr(class);刪除class這個屬性;


6、JQuery有幾種選擇器?


(1)、基本選擇器：#id，class,element,*;


(2)、層次選擇器：parent>child，prev+next，prev~siblings


(3)、基本過濾器選擇器：:first，:last，:not，:even，:odd，:eq，:gt，:lt


(4)、內容過濾器選擇器：:contains，:empty，:has，:parent


(5)、可見性過濾器選擇器：:hidden，:visible


(6)、屬性過濾器選擇器：[attribute]，[attribute=value]，[attribute!=value]
，[attribute^=value]，[attribute$=value]，[attribute*=value]


(7)、子元素過濾器選擇器：:nth-child，:first-child，:last-child，:only-child


(8)、表單選擇器：:input，:text，:password，:radio，:checkbox，:submit等;


(9)、表單過濾器選擇器：:enabled，:disabled，:checked，:selected


7、jQuery中的Delegate()函數有什麼作用?


delegate()會在以下兩個情況下使用到：


1)、如果你有一個父元素，需要給其下的子元素添加事件，這時你可以使用delegate()了，代碼如下：


$("ul").delegate("li","click",function(){$(this).hide();});


2)、當元素在當前頁面中不可用時，可以使用delegate()


8、$(document).ready()方法和window.onload有什麼區別?


(1)、window.onload方法是在網頁中所有的元素(包括元素的所有關聯文件)完全載入到瀏覽器後才執行的。


(2)、$(document).ready()方法可以在DOM載入就緒時就對其進行操縱，並調用執行綁定的函數。


9、如何用jQuery禁用瀏覽器的前進後退按鈕?


實現代碼如下：



$(document).ready(function(){

window.history.forward(1);

//ORwindow.history.forward(-1);

});



10、jquery中$.get()提交和$.post()提交有區別嗎?


相同點：都是非同步請求的方式來獲取服務端的數據;


異同點：


1、請求方式不同：$.get()方法使用GET方法來進行非同步請求的。$.post()方法使用POST方法來進行非同步請求的。


2、參數傳遞方式不同：get請求會將參數跟在URL後進行傳遞，而POST請求則是作為HTTP消息的實體內容發送給Web伺服器的，這種傳遞是對用戶不可見的。


3、數據傳輸大小不同：get方式傳輸的數據大小不能超過2KB而POST要大的多


4、安全問題：GET方式請求的數據會被瀏覽器緩存起來，因此有安全問題。


11、寫出一個簡單的$.ajax()的請求方式?

$.ajax({

url:'http://www..com',

type:'POST',

data:data,

cache:true,

headers:{},

beforeSend：function(){},

success:function(){},

error:function(){},

complete:function(){}

});

ja

以上就是小編今天為大家分享的關於2019Web前端面試題及答案匯總-a
Jquery篇的文章，希望本篇文章中的面試題能夠對正准備參加Web前端面試的小夥伴們有所幫助。想要了解更多Web前端方面的知識記得關注北大青鳥Web前端培訓官網。最後祝願小夥伴們面試成功成為一名優秀的Web前端工程師。

㈤ Web前端面試題匯總之JavaScript篇

今天小編要跟大家分享的文章是關於web前端面試題匯總之JavaScript篇。正在從事web前端學習和准備找工作的小夥伴們來和小編一起看一看吧，希望本篇文章能夠對大家有所幫助。

1，介紹js的基本數據類型。


Undefined、Null、Boolean、Number、String


2，介紹js有哪些內置對象?


Object是JavaScript中所有對象的父對象


數據封裝類對象：Object、Array、Boolean、Number和String


其他對象：Function、Arguments、Math、Date、RegExp、Error


3，說幾條寫JavaScript的基本規范?，


1.不要在同一行聲明多個變數。


2.請使用===/!==來比較true/false或者數值


3.使用對象字面量替代newArray這種形式


4.不要使用全局函數。


5.Switch語句必須帶有default分支


6.函數不應該有時候有返回值，有時候沒有返回值。


7.For循環必須使用大括弧


8.If語句必須使用大括弧


9.for-in循環中的變數應該使用var關鍵字明確限定作用域，從而避免作用域污染。


4，JavaScript原型，原型鏈?有什麼特點?


每個對象都會在其內部初始化一個屬性，就是prototype(原型)，當我們訪問一個對象的屬性時，


如果這個對象內部不存在這個屬性，那麼他就會去prototype里找這個屬性，這個prototype又會有自己的prototype，


於是就這樣一直找下去，也就是我們平時所說的原型鏈的概念。


關系：instance.constructor.prototype=instance.__proto__


特點：


JavaScript對象是通過引用來傳遞的，我們創建的每個新對象實體中並沒有一份屬於自己的原型副本。當我們修改原型時，與之相關的對象也會繼承這一改變。


當我們需要一個屬性的時，Javascript引擎會先看當前對象中是否有這個屬性，如果沒有的話，


就會查找他的Prototype對象是否有這個屬性，如此遞推下去，一直檢索到Object內建對象。


functionFunc(){}


Func.prototype.name="Sean";


Func.prototype.getInfo=function(){returnthis.name;}


varperson=newFunc();


//現在可以參考


varperson=Object.create(oldObject);


console.log(person.getInfo());


//它擁有了Func的屬性和方法//"Sean"console.log(Func.prototype);


//Func{name="Sean",getInfo=function()}復制代碼


5，JavaScript有幾種類型的值?，你能畫一下他們的內存圖嗎?


棧：原始數據類型(Undefined，Null，Boolean，Number、String)


堆：引用數據類型(對象、數組和函數)


兩種類型的區別是：存儲位置不同;


原始數據類型直接存儲在棧(stack)中的簡單數據段，占據空間小、大小固定，屬於被頻繁使用數據，所以放入棧中存儲;


引用數據類型存儲在堆(heap)中的對象,占據空間大、大小不固定,如果存儲在棧中，將會影響程序運行的性能;引用數據類型在棧中存儲了指針，該指針指向堆中該實體的起始地址。當解釋器尋找引用值時，會首先檢索其


在棧中的地址，取得地址後從堆中獲得實體


6，Javascript如何實現繼承?


1、構造繼承


2、原型繼承


3、實例繼承


4、拷貝繼承


原型prototype機制或apply和call方法去實現較簡單，建議使用構造函數與原型混合方式。


functionParent(){this.name='wang'}functionChild(){this.age=28;}
Child.prototype=newParent();//繼承了Parent，通過原型vardemo=newChild();
alert(demo.age);alert(demo.name);//得到被繼承的屬性復制代碼


7，Javascript作用鏈域?


作用域鏈的作用是保證執行環境里有權訪問的變數和函數是有序的，作用域鏈的變數只能向上訪問，變數訪問到window對象即被終止，作用域鏈向下訪問變數是不被允許的。


8，談談This對象的理解。


this總是指向函數的直接調用者(而非間接調用者);


如果有new關鍵字，this指向new出來的那個對象;


在事件中，this指向觸發這個事件的對象，特殊的是，IE中的attachEvent中的this總是指向全局對象Window;


this就是指的是當前對象


9，null，undefined的區別?


null表示一個對象被定義了，值為「空值」;


undefined表示不存在這個值。


typeofundefined//"undefined"


undefined:是一個表示"無"的原始值或者說表示"缺少值"，就是此處應該有一個值，但是還沒有定義。當嘗試讀取時會返回
undefined;


例如變數被聲明了，但沒有賦值時，就等於undefined


typeofnull//"object"


null:是一個對象(空對象,沒有任何屬性和方法);


例如作為函數的參數，表示該函數的參數不是對象;


注意：


在驗證null時，一定要使用===，因為==無法分別null和undefined


undefined表示"缺少值"，就是此處應該有一個值，但是還沒有定義。典型用法是：


(1)變數被聲明了，但沒有賦值時，就等於undefined。


(2)調用函數時，應該提供的參數沒有提供，該參數等於undefined。


(3)對象沒有賦值的屬性，該屬性的值為undefined。


(4)函數沒有返回值時，默認返回undefined。


null表示"沒有對象"，即該處不應該有值。典型用法是：


(1)作為函數的參數，表示該函數的參數不是對象。


(2)作為對象原型鏈的終點。


10，["1","2","3"].map(parseInt)答案是多少?


[1,NaN,NaN]因為parseInt需要兩個參數(val,radix)，


其中radix表示解析時用的基數。


map傳了3個(element,index,array)，對應的radix不合法導致解析失敗。


以上就是小編今天為大家分享的關於web前端面試題匯總之JavaScript篇的文章，希望本篇文章能夠對正在從事web前端工作的小夥伴們有所幫助，想要了解更多web前端知識記得關注北大青鳥web培訓官網，最後祝願小夥伴們工作順利，成為一名優秀的web前端工程師。

㈥ 前端面試題整理（一）

進程是CPU資源分配的最小單位，線程是CPU調度的最小單位

其中GUI渲染線程和JS引擎是無法同時工作的

默認情況下, TCP 連接會啟用延遲傳送演算法 (Nagle 演算法), 在數據發送之前緩存他們. 如果短時間有多個數據發送, 會緩沖到一起作一次發送 (緩沖大小見 socket.bufferSize), 這樣可以減少 IO 消耗提高性能.

如果是傳輸文件的話, 那麼根本不用處理粘包的問題, 來一個包拼一個包就好了. 但是如果是多條消息, 或者是別的用途的數據那麼就需要處理粘包.

可以參見網上流傳比較廣的一個例子, 連續調用兩次 send 分別發送兩段數據 data1 和 data2, 在接收端有以下幾種常見的情況:

A. 先接收到 data1, 然後接收到 data2 .
B. 先接收到 data1 的部分數據, 然後接收到 data1 餘下的部分以及 data2 的全部.
C. 先接收到了 data1 的全部數據和 data2 的部分數據, 然後接收到了 data2 的餘下的數據.
D. 一次性接收到了 data1 和 data2 的全部數據.
其中的 BCD 就是我們常見的粘包的情況. 而對於處理粘包的問題, 常見的解決方案有:

多次發送之前間隔一個等待時間
關閉 Nagle 演算法
進行封包/拆包

通過滑動窗口協議（連續ARQ協議）實現，保證了分組無差錯、有序接收、流量控制。接收方返回的ACK中會包含自己的接收窗口的大小，並且利用大小來控制發送方的數據發送。

當發送者收到了一個窗口為0的應答，發送者便停止發送，等待接收者的下一個應答。如果這個窗口不為0的應答在傳輸過程中丟失，發送者一直等待，接收者以為發送者收到該應答，等待接收新數據，這樣雙方就相互等待，從而產生死鎖

TCP使用了持續計時器。每當發送者收到一個0窗口的應答後就啟動該計時器。計時器到時便主動發送報文詢問接收者的窗口大小。若接收者仍然返回0窗口，則重置該計時器繼續等待；若窗口不為0，則標識應答報文丟失了，此時重置發送窗口開始發送，這樣就避免了死鎖的產生

擁塞控制是作用於網路的，防止網路負載過大，常用的方法：1.慢啟動、擁塞避免 2.快重傳、快恢復。流量控制是作用於接收者的，控制發送者的發送速度使接收者來得及接收，防止分組丟失

發送方維持一個叫做擁塞窗口CWnd的狀態變數，控制著傳輸速度，TCP開始發送報文時CWnd=1。一個傳輸輪次所經歷的時間就是往返時間RTT，每經過一個RTT並且按時收到確認，就將擁塞窗口CWnd加倍。還有一個叫慢啟動門限ssthresh的狀態變數，當CWnd<ssthresh時，使用慢啟動，當CWnd>=ssthresh改用擁塞避免演算法

每經過一個往返時間RTT就把發送方的擁塞窗口cwnd加1而不是加倍。無論在慢啟動階段還是擁塞避免階段，只要發送方沒有按時收到確認，就把慢啟動門限設置為出現擁塞時的擁塞窗口cwnd的一半（但不小於2）。然後把擁塞窗口cwnd重置為1，執行慢啟動演算法

接收方收到一個失序的報文段後就立刻發出重復確認而不是等到自己發送數據時捎帶確認。只要發送方一連收到三個重復確認就立即重傳對方尚未收到的報文段，而不是等待重傳計時器到期

當發送方連續收到三個重復確認時，把慢啟動門限ssthresh減半，但是並不執行慢開始演算法，而是將擁塞窗口cwnd設置為ssthresh減半後的值，直接執行擁塞避免演算法。快重傳配合快恢復的TCP Reno版本是目前使用最廣的版本。

幀：HTTP/2 數據通信的最小單位消息：指 HTTP/2 中邏輯上的 HTTP 消息。例如請求和響應等，消息由一個或多個幀組成。
流：存在於連接中的一個虛擬通道。流可以承載雙向消息，每個流都有一個唯一的整數ID

HTTP/1.x會在請求和響應中中重復地攜帶不常改變的、冗長的頭部數據，給網路帶來額外的負擔。

服務端可以在發送頁面HTML時主動推送其它資源，而不用等到瀏覽器解析到相應位置，發起請求再響應。例如服務端可以主動把JS和CSS文件推送給客戶端，而不需要客戶端解析HTML時再發送這些請求。

服務端可以主動推送，客戶端也有權利選擇是否接收。如果服務端推送的資源已經被瀏覽器緩存過，瀏覽器可以通過發送RST_STREAM幀來拒收。主動推送也遵守同源策略，伺服器不會隨便推送第三方資源給客戶端。

HTTP 1.x 中，如果想並發多個請求，必須使用多個 TCP 鏈接，且瀏覽器為了控制資源，還會對單個域名有 6-8個的TCP鏈接請求限制。

HTTP2中：

同域名下所有通信都在單個連接上完成。
單個連接可以承載任意數量的雙向數據流。
數據流以消息的形式發送，而消息又由一個或多個幀組成，多個幀之間可以亂序發送，因為根據幀首部的流標識可以重新組裝

前端面試與進階指南
從輸入URL到頁面載入的過程？如何由一道題完善自己的前端知識體系！

㈦ 前端面試題整理

JavaScript：

1.介紹一下isNaN函數？

如果參數不是數字類型的話isNaN返回true（函數名稱：isnan函數功能：判斷數組的元素是否是NaN。）


2.javascript都支持哪些布爾型的操作？


&&,||和！（&&邏輯與，||邏輯或，！邏輯非）


3.「1″+2+4在javascript中得到什麼？


因為「1」是String類型，所以所有的操作數都是String,結果為124


4.2+5+」8″得到的結果是什麼？


因為2和5是數字類型，8是字元串，所以得到的結果是78


5.javascript有幾種loop（循環）方法？


for,while,do-while，for...in語句用於遍歷數組或者對象的屬性（對數組或者對象的屬性進行循環操作）。


6.javascript如何創建一個新的對象？


varobj=newObject()或者varobj={}


7.如何為一個對象屬性賦值？


obj["age"]=17或者obj.age=17


8.如何為一個數組添加一個值？


arr[arr.length]=value;


9.javascript基本數據類型/javascript中的typeof返回哪些數據類型


Number類型、Boolean類型、Object類型、String類型、Null、Undefined類型/


10.例舉3種強制類型轉換和2種隱式類型轉換?


強制（parseInt,parseFloat,number）隱式（==_===）


11.數組方法pop()push()unshift()shift()


Push()尾部添加pop()尾部刪除Unshift()頭部添加shift()頭部刪除


12.閉包是什麼，有什麼特性，對頁面有什麼影響


閉包就是能夠讀取其他函數內部變數的函數。


13.添加刪除替換插入到某個接點的方法


obj.appendChild()obj.innersetBefore()obj.replaceChild()obj.removeChild()


14.javascript的本地對象，內置對象和宿主對象


本地對象為arrayobjregexp等可以new實例化


內置對象為gloadMath等不可以實例化的


宿主為瀏覽器自帶的document,window等


15.介紹一下eval()函數


eval()函數可計算某個字元串，並執行其中的的JavaScript代碼。


16.介紹一下JSON


JSON：JavaScript對象表示法（JavaScriptObjectNotation）。


JSON是存儲和交換文本信息的語法。類似XML。


JSON比XML更小、更快，更易解析。


17.jQueryUI與jquery的主要區別是：


(1)jQuery是一個js庫，主要提供的功能是選擇器，屬性修改和事件綁定等等。


(2)jQueryUI則是在jQuery的基礎上，利用jQuery的擴展性，設計的插件。提供了一些常用的界面元素，諸如對話框、拖動行為、改變大小行為等等。


(3)jQuery本身注重於後台，沒有漂亮的界面，而jQueryUI則補充了前者的不足，他提供了華麗的展示界面，使人更容易接受。既有強大的後台，又有華麗的前台。


html+css:


1.對WEB標准以及W3C的理解與認識:


標簽閉合、標簽小寫、不亂嵌套、提高搜索機器人搜索幾率、使用外鏈css和js腳本、結構行為表現的分離、文件下載與頁面速度更快、內容能被更多的用戶所訪問、內容能被更廣泛的設備所訪問、更少的代碼和組件，容易維護、改版方便，不需要變動頁面內容、提供列印版本而不需要復制內容、提高網站易用性；


2.xhtml和html有什麼區別:


HTML是一種基本的WEB網頁設計語言，XHTML是一個基於XML的置標語言


最主要的不同：


XHTML元素必須被正確地嵌套。


XHTML元素必須被關閉。


標簽名必須用小寫字母。


XHTML文檔必須擁有根元素。


3.行內元素有哪些?塊級元素有哪些?CSS的盒模型?


塊級元素：divph1h2h3h4formul


行內元素:abbrispaninputselect


Css盒模型:內容，border,margin，padding


4.前端頁面有哪三層構成，分別是什麼?作用是什麼?


結構層Html表示層CSS行為層js


5.寫出幾種IE6BUG的解決方法:


雙邊距BUGfloat引起的使用display


3像素問題使用float引起的使用dislpay:inline-3px


超鏈接hover點擊後失效使用正確的書寫順序linkvisitedhoveractive


Iez-index問題給父級添加position:relative


Png透明使用js代碼改


Min-height最小高度！Important解決』


select在ie6下遮蓋使用iframe嵌套


為什麼沒有辦法定義1px左右的寬度容器（IE6默認的行高造成的，使用over:hidden,zoom:0.08line-height:1px）


6.解釋csssprites，如何使用。


Css精靈把一堆小的圖片整合到一張大的圖片上，減輕伺服器對圖片的請求數量


7.你如何對網站的文件和資源進行優化?期待的解決方案包括：


文件合並


文件最小化/文件壓縮


使用CDN託管


緩存的使用


8.清除浮動的幾種方式，各自的優缺點：


使用空標簽清除浮動clear:both（理論上能清楚任何標簽，，，增加無意義的標簽）


使用overflow:auto（空標簽元素清除浮動而不得不增加無意代碼的弊端,,使用zoom:1用於兼容IE）


是用afert偽元素清除浮動(用於非IE瀏覽器)


9.瀏覽器內核


1、Trident內核：IE最先開發或使用的，也稱IE內核，360瀏覽器使用的也是IE內核；


2、Webkit內核：谷歌chrome瀏覽器最先開發或使用，也叫谷歌內核，楓樹瀏覽器、太陽花使用的也是谷歌內核；


3、Gecko內核：Netscape6開始採用的內核，後來的MozillaFireFox(火狐瀏覽器)也採用了該內核，K-Meleon瀏覽器也是使用這種內核；


4、Presto內核：目前只有Opera瀏覽器採用該內核

㈧ WEB前端面試題

第二章 面試題基礎篇

2.1 HTML面試題

面試題：行內元素有哪些？塊級元素有哪些？ 空(void)元素有那些？

面試題：頁面導入樣式時，使用link和@import有什麼區別？

面試題：title與h1的區別、b與strong的區別、i與em的區別？

面試題：img標簽的title和alt有什麼區別？

面試題：png、jpg、gif 這些圖片格式解釋一下，分別什麼時候用？

2.2 CSS面試題

面試題：css背景紋路

面試題：介紹一下CSS的盒子模型

面試題：CSS選擇符有哪些？哪些屬性可以繼承？

面試題：CSS優先順序演算法如何計算？

面試題：用CSS畫一個三角形

面試題：一個盒子不給寬度和高度如何水平垂直居中？

面試題：display有哪些值？說明他們的作用。

面試題：對BFC規范(塊級格式化上下文：block formatting context)的理解？

面試題：清除浮動有哪些方式？

面試題：在網頁中的應該使用奇數還是偶數的字體？為什麼呢？

面試題：寫一個左中右布局占滿屏幕，其中左、右倆塊固定寬200，中間自適應寬，要求先載入中間塊，請寫出結構及樣式。

面試題：什麼是CSS reset？

面試題：css sprite是什麼,有什麼優缺點

面試題：display: none;與visibility: hidden;的區別

面試題：position有哪些值?有什麼作用? 【特別多公司問】

面試題：line-height和height有什麼區別？

面試題：opacity 和 rgba區別

2.3 JavaScript基礎面試題

面試題：延遲載入JS有哪些方式？

面試題：JS數據類型有哪些？

面試題：null和undefined的區別

面試題：JS數據類型考題

面試題：==和===有什麼不同

面試題：JS微任務和宏任務

面試題：JS作用域考題

面試題：JS對象考題

面試題：JS作用域+this指向+原型 考題

面試題：JS判斷變數是不是數組，你能寫出哪些方法？

面試題：slice是幹嘛的、splice是否會改變原數組

面試題：JS數組去重

面試題：找出多維數組最大值

面試題：給字元串新增方法實現功能

面試題：找出字元串出現最多次數的字元以及次數

2.4 真正移動端 —— H5/C3面試題

面試題：什麼是語義化標簽

面試題：::before 和 :after中雙冒號和單冒號 有什麼區別？解釋一下這2個偽元素的作用。

面試題：如何關閉iOS鍵盤首字母自動大寫

面試題：怎麼讓Chrome支持小於12px 的文字？

面試題：rem和em有什麼樣區別

面試題：ios系統中元素被觸摸時產生的半透明灰色遮罩怎麼去掉

面試題：webkit表單輸入框placeholder的顏色值能改變嗎？

面試題：禁止ios 長按時不觸發系統的菜單，禁止ios&android長按時下載圖片

面試題：禁止ios和android用戶選中文字

面試題：自適應 [淘寶無線適配]

面試題：響應式

第三章 面試題進階篇

3.1 JavaScript進階面試題

面試題：new操作符具體做了什麼

面試題：閉包 【必須會】

面試題：原型鏈 【必須會】

面試題： JS繼承有哪些方式

面試題：說一下call、apply、bind區別

面試題：sort背後原理是什麼？

面試題：深拷貝和淺拷貝

面試題：localstorage、sessionstorage、cookie的區別

3.2 ES6面試題

面試題：var、let、const區別

面試題：作用域考題

面試題：將下列對象進行合並

面試題：箭頭函數和普通函數有什麼區別？

面試題：Promise有幾種狀態

面試題：find和filter的區別 【大廠】

面試題：some和every的區別 【大廠】

3.3 webpack面試題

面試題：webpack插件

3.4 Git面試題

面試題：git常用命令

面試題：解決沖突

面試題：GitFlow

第四章 面試題框架篇

4.1 區分初中高級的 —— Vue面試題

面試題：Vue2.x 生命周期有哪些？

1.系統自帶八個

2.當一旦進入到某個組件會執行哪些生命周期

3.$el和$data在哪個階段有

4.如果使用keep-alive會多倆個生命周期

5.如果加入keep-alive第一次進入組件會執行哪些生命周期

6.如果加入keep-alive第二次或者第N進入該組件會執行哪些生命周期

面試題：談談你對keep-alive的了解

面試題：v-if和v-show區別

面試題：v-if和v-for優先順序 2.x

面試題：ref是什麼？

面試題：nextTick是什麼？

面試題：Vue中如何做樣式穿透

面試題：scoped原理

面試題：Vuex是單向數據流還是雙向數據流？

面試題：講一下MVVM

面試題：雙向綁定原理

面試題：什麼是虛擬DOM

面試題：key是干什麼？

面試題：diff演算法

面試題：Vue組件傳值

面試題：props和data優先順序誰高？

面試題：computed、methods、watch有什麼區別？

面試題：Vuex

面試題：Vue路由

面試題：Vue項目打包後出現空白頁

4.2 微信小程序面試題

面試題：如何自定義頭部？

面試題：如何自定義底部？

4.3 uni-app面試題

面試題：生命周期

面試題：條件編譯

第五章 面試題性能優化篇

㈨ 2020年Web前端面試題及答案匯總

今天小編要跟大家分享的文章是關於2020年Web前端面試題及答案匯總。正准備參加Web前端面試的小夥伴們來和小編一起看一看吧，希望本篇文章能夠對大家有所幫助。

一、Mysql資料庫


1.MySQL中varchar與char的區別以及varchar(50)中的50代表的涵義?


答案：


Varchar是變長字元串，最多存儲的大小是65535位元組，查詢速度相對較慢;Char
是定常字元串，最多存儲的大小是255位元組，查詢速度相對較快;


varchar(50)表示：Mysql4.0表示存放50個位元組，5.0存放50個字元。


2.簡述瀏覽器打開#顯示頁面，中間都經過哪些過程?


答案：


向DNS伺服器獲取域名對應的IP地址並返回瀏覽器，通過IP地址向Web伺服器發請求，Web伺服器從文件伺服器獲取網頁中所需要的文件，從資料庫伺服器獲取網頁中所需要的數據，最後講完整的網頁相應給瀏覽器。


3.如何解決MySQL中存儲中文亂碼問題?


答案：


腳本文件採用UTF8編碼


客戶端連接資料庫使用UTF8編碼


伺服器端創建資料庫使用UTF8編碼


4.Float和Double的區別是什麼?


答案：


FLOAT(單精度浮點數)類型數據可以存儲至多8位十進制數，並在內存中佔4位元組。


DOUBLE(雙精度浮點數)類型數據可以存儲至多18位十進制數，並在內存中佔8位元組。


5.把數據id等於1的名字oldboy更改為oldgirl?


答案：


updatetestsetname='oldgirl'whereid=1;


6.如何登錄mysql數據?


答案：


mysql-uroot。


二、JS基礎


1.continue和break有什麼區別?


答案：


break和continue都是用來控制循環結構的：


break終止循環，跳出循環體執行循環後面的語句。


continue跳過本次循環，執行下一次循環。


2.i++和++i的區別?


答案：


i++：先用i值後加1,


++i：先加1後用i值，


計算：varn=5;求varnum=n+++++n+n+++++n+n;//37


3.JavaScript都有哪些數據類型?


答案：


原始類型：數值型/字元串型/布爾型/undefined/null


引用類型：對象


4.自調用函數是什麼?用於什麼地方?


答案：立即執行的函數。(function(){//函數體})();


用於創建一個局部作用域。


5.slice和splice有什麼區別?


答案：


slice截取子數組，從指定的數組中，截取幾個連續的元素組成一個新數組


splice允許從指定數組中，刪除一部分元素，同時再添加另一部分元素


6.typeof返回的類型有哪些?


答案：


number、string、boolean、undefined、object、function


ex:


vararr=[1,2,3,4,5];


console.log(typeof(arr));//object


functionmyDemo(){


returnfunctiontest(){};


}


console.log(typeof(myDemo()));//function


7.取1~11之間的隨機數(即包括1不包括11)?


答案：


Math.floor(Math.random()*10+1)


parseInt(Math.random()*10+1)


8.什麼是變數聲明提前?


答案：


使用var關鍵字聲明的變數，會將聲明提升到所在作用域的最前邊。。


9.push、pop、shift和unshift區別?


答案：


這兩組同為對數組的操作，並且會改變數組的本身的長度及內容。


不同的是push()、pop()是從數組的尾部進行增減，unshift()、shift()是從數組的頭部進行增減。。


10.例舉4種強制類型轉換和3種隱式類型轉換?


答案：


強制轉換：parseInt/parseFloat/Number/toString


隱式轉換：


字元串+數值數值轉字元串


數值+布爾型布爾型中true轉為1，false轉為0


字元串+布爾型布爾型轉為字元串。


11.函數聲明與函數表達式的區別?


答案：


相同點：兩者都可以創建函數。


不同點：函數聲明可以存在函數提升(前)，函數表達式不存在函數提升(前)。


//函數聲明


functionmyFunction(){


functioninnerFunction(){}


}


//以下為函數表達式


varmyFunc=function(){};


myFunc(function(){


returnfunction(){};


});


12.請指出JavaScript宿主對象和原生對象的區別?


答案：


宿主對象：指JavaScript解釋器提供的對象，由解釋器廠家自定義並提供實現，不同的解釋器提供的擴展對象存在較大的差異(DOM和BOM對象)。


原生對象：JavaScript語言本身預定義的對象，在ECMAScript標准中定義，由所有的解釋器廠家來提供具體實現(Array,Date,Math,Number,String,Boolean等)。


13.js中有哪些內置函數?


答案：Object,Array,Boolean,Number,String,Function,Date,Math,RegExp,
Error,Global


14.列舉出獲取日期相關函數


答案：


console.log(Date.now());//返回當前日期和時間񟬢/01/0100:00:00'之間的毫秒值


vardt=newDate();//獲取當前時間---年月日時分秒


console.log(dt.getTime());//返回當前日期和時間񟬢/01/0100:00:00'之間的毫秒值


console.log(dt.getFullYear());//年份


console.log(dt.getMonth()+1);//月份(0-11)


console.log(dt.getDate());//日期(0/1-31)


console.log(dt.getDay());//星期(0-6)


console.log(dt.getHours());//小時(0-23)


console.log(dt.getMinutes());//分鍾(0-59)


console.log(dt.getMilliseconds);//返回毫秒(0-999)


console.log(dt.getSeconds());//秒(0-59)


15.Math相關函數


答案：


Math.random()-返回0~1之間的隨機數


Math.abs(x)-返回數的絕對值


Math.ceil(x)-向上取整


Math.floor(x)-向下取整


Math.round()四捨五入


Math.max()和Max.min()獲取一組數據中的最大值和最小值


Math.PI獲取圓周率π的值Math.pow()獲取一個值的多少次冪


Math.sqrt()對數值開方


Math.pow(10，2)=100;


Math.sqrt(100)=10;


16.null和undefined的區別?


答案：


undefined是訪問一個未初始化的變數時返回的值，


null是訪問一個尚不存在的對象時所返回的值。因此，可以把undefined看作是空的變數，而null看作是空的對象。


17.==和===有什麼不同?


答案：


==抽象相等，比較時，會先進行類型轉換，然後再比較值;


===嚴格相等，判斷兩個值相等同時數據類型也得相同。


18.setTimeout和setInterval的區別是什麼?


答案：


二者都是用來設置定時操作的。


setTimeout:設置一個定時器，在定時器到期後執行一次函數或代碼段


setInterval:設置一個定時器，以固定的時間間隔重復調用一個函數或者代碼段


19.請說出以下代碼執行結果


for(vari=0;i<3;i++){


setTimeout(function(){


console.log(i);


},0);


console.log(i);


}


答案：012333，執行過程如下


vari=0;


console.log(i);i++;


console.log(i);i++;


console.log(i);i++;


setTimeout(function(){console.log(i);


},0);s


etTimeout(function(){


console.log(i);


},0);


setTimeout(function(){


console.log(i);


},0);//輸出012333


20.請說出(true+flase)>2+true的執行結果


答案：false


21.當前代碼塊輸出結果是什麼?


varz=10;


functionfoo(){console.log(z);}


(function(funArg){varz=20;funArg();})(foo);


答案：10，自調用函數。


22.setTimeout(function(){},10)表示什麼意思?


答案：每隔10毫秒調用一次函數。


23.程序中捕獲異常的方法?


答案：


try{


}catch(e){


}finally{


}


24.以下代碼執行結果?


varuname='jack'


functionchange(){


alert(uname)//?


varuname='lily'


alert(uname)//?


}


change()


答案：undefinedlily


25.如何使用npm下載express模塊?


答案：npminstallexpress


26.split和join的區別?


答案：split()將字元串按照指定的字元分割成一個數組，並返回


join()將數組用指定的字元連接成一個字元串，並返回


27.看下列代碼會有什麼樣的輸出?


varfoo="11"+2-"1";


console.log(foo);


console.log(typeoffoo);


答案：111number


28.foo=foo||bar，這行代碼是什麼意思?為什麼要這樣寫?


答案：這種寫法稱之為短路表達式


相當於：


varfoo;


if(foo){


foo=foo;


}else{


foo=bar;


}


常用於函數參數的空判斷


29.用js實現隨機選取10_100之間的10個數字，存入一個數組，並排序


答案：


functiongetRandom(istart,iend){


variChoice=iend-istart+1;


returnMath.floor(Math.random()*iChoice+istart);


}variArray=[];


for(vari=0;i<10;i++){


varresult=getRandom(10,100);


iArray.push(result);


}iArray.sort();


30.如何獲取javascript三個數中的最大值和最小值?


答案：Math.max(a,b,c);//最大值


Math.min(a,b,c)//最小值


31.實現冒泡排序?


vararray=[5,4,3,2,1];


vartemp=0;


for(vari=0;i

for(varj=0;j

if(array[j]>array[j+1]){


temp=array[j+1];


array[j+1]=array[j];


array[j]=temp;


}


}


三、NODEJS


1.同步和非同步有何區別?


答案：


同步：指發送一個請求,需要等待返回,然後才能夠發送下一個請求，有等待過程(在一個任務進行中時不能開啟其他的任務)。


非同步：指發送一個請求,不需要等待返回,隨時可以再發送下一個請求，即不需要等待(在一個任務進行中時可以開啟其他的任務)。


2.NodeJS中有哪些類型模塊，文件操作用哪一個模塊?


答案：


模塊類型：核心模塊、自定義模塊、第三方模塊。


文件操作：fs模塊


3.對NodeJS的優點和缺點提出自己的看法?


答案：CPU密集型任務的特點是進行大量的計算，消耗CPU資源，比如計算圓周率(上千位)、對視頻進行編碼等,全靠CPU的運算能力
(一般用C語言，java)IO(Input/
Output)密集型任務，這類任務的特點是CPU消耗很少，大部分時間都在等待IO操作。常見的大部分任務都是IO密集型任務，比如Web應用(一般用腳本語言：python/Nodejs)。Nodejs設計思想中以事件驅動、非同步、非堵塞I/O密集型為核心，他提供的大多數api都是基於事件的、非同步的風格。所以非常適合處理高並發請求。此外，與Node伺服器交互的客戶端代碼是由js語言編寫的，因此客戶端和伺服器端都用同一種語言編寫，減少了成本。


4.使用NodeJS完成登錄功能(編寫HTML頁面和路由介面中的代碼)?


答案：


HTML頁面：





用戶：



密碼：









user.js路由


constexpress=require('express');


constpool=require('../pool.js');


varrouter=express.Router();


router.post('/login',(req,res)=>{


varobj=req.body;


var$uname=obj.uname;


if(!$uname){


res.send({code:401,msg:'unamerequired'});


return;


}


var$upwd=obj.upwd;


if(!$upwd){res.send({code:402,msg:'upwdrequired'});


return;


}


varsql='SELECT*FROMxz_userWHEREuname=?ANDupwd=?'
pool.query(sql,[$uname,$upwd],(err,result)=>{


if(err)throwerr;


if(result.length>0){


res.send({code:200,msg:'loginsuccess'});


}else{


res.send({code:301,msg:'loginerror'});


}});


});


//路由器導出


mole.exports=router;


5.什麼是Nodejs?


Nodejs是一個JavaScript的運行環境，是一個伺服器端的「JavaScript解釋器」，用於方便高效地搭建一些響應速度快、易於擴展的網路應用。它採用事件驅動、非同步編程，為網路服務而設計

㈩ 前端面試題，哪裡能找到案例或解析