前端程序員面試分類真題13

前端程序員面試分類真題13簡(jiǎn)答題1.

請(qǐng)用多種方式獲取當(dāng)前時(shí)間的毫秒數(shù)。正確答案：有4種方式獲取當(dāng)前毫秒數(shù)。其中3種方式要先創(chuàng)建Date對(duì)象，然后再使用一元加法運(yùn)算符、getTime()或valu（江南博哥）eOf()才能得到當(dāng)前毫秒數(shù)，另一種是用Date對(duì)象的靜態(tài)方法now()獲取當(dāng)前時(shí)間的毫秒數(shù)，具體代碼如下所示。

vardate=newDate();

+date;

date.getTime();

date.valueOf();

Date.now();[考點(diǎn)]日期和正則表達(dá)式

2.

在網(wǎng)頁(yè)中實(shí)現(xiàn)倒計(jì)時(shí)，能夠動(dòng)態(tài)顯示“××天××?xí)r××分××秒”。正確答案：先將兩個(gè)日期對(duì)象相減，得到時(shí)間間隔的毫秒數(shù)；再將毫秒數(shù)換算成天、時(shí)、分和秒：然后把得到的結(jié)果賦給文檔中的一個(gè)元素，作為它的內(nèi)容顯示；最后用定時(shí)器循環(huán)執(zhí)行前面的兩步，就能實(shí)現(xiàn)倒計(jì)時(shí)，具體如下所示。

＜divid="date"＞＜/div＞

＜script＞

varend=newDate("2020-3-1200:00");

//截止日期

functioncountdown(){

varnow=newDate();

varday,hour,minute,second,str,

remainder=end-now;

if(remainder＜0){

return;

}

day=Math.floor(remainder/1000/60/60/24);

//天數(shù)

hour=Math.floor(remainder/1000/60/60%24);

//小時(shí)

minute=Math.floor(remainder/1000/60%60);

//分鐘

second=Math.floor(remainder/1000%60);

//秒數(shù)

str=day+"天"+hour+"時(shí)"+minute+"分"+second+"秒";

document.getElementById("date").innerHTML=str;

setTimeout(countdown,1000);

}

countdown();

＜/script＞[考點(diǎn)]日期和正則表達(dá)式

3.

如何判斷某一年是閏年?正確答案：因?yàn)殚c年的二月份有29天，所以只要獲得這一年二月份的天數(shù)就能判斷是否是閏年。在構(gòu)造函數(shù)Date()中，把月份設(shè)為3月，也就是2，天數(shù)設(shè)為0，就能得到上個(gè)月的最后一天，代碼如下所示。

functionisLeapYear(year){

returnnewDate(year,2,0).getDate()==29;

}[考點(diǎn)]日期和正則表達(dá)式

4.

如何計(jì)算兩個(gè)日期相隔的天數(shù)?正確答案：兩個(gè)Date對(duì)象相減可以得到日期之間的毫秒數(shù)，算出毫秒后，再換算成天，1天有24小時(shí)，1小時(shí)有60分鐘，1分鐘有60秒，1秒有1000毫秒，代碼如下所示。

functiondateInterval(start,end){

vardiff=Math.abs(start-end),

//取絕對(duì)值

days=Math.ceil(diff/1000/60/60/24);

//向上取整

returndays;

}[考點(diǎn)]日期和正則表達(dá)式

5.

請(qǐng)編寫一個(gè)格式化字符串的函數(shù)，例如傳入“我的名字叫{0}”和“strick”，返回“我的名字叫strick”。正確答案：這個(gè)格式化字符串的函數(shù)包含2個(gè)參數(shù)，第一個(gè)參數(shù)是需要格式化的字符串，第二個(gè)參數(shù)是一個(gè)數(shù)組，數(shù)組的元素可替換對(duì)應(yīng)的占位符。由于構(gòu)造函數(shù)RegExp()能動(dòng)態(tài)創(chuàng)建正則表達(dá)式，因此可方便地實(shí)現(xiàn)替換邏輯，具體如下所示。

functionstrFormat(format,args){

if(arguments.length＜2){

returnformat;

}

for(varkeyinargs){

varvalue=args[key];

if(undefined!=value){

format=format.replace(newRegExp("\\{"+key+"\\}","gm"),value);

}

}

returnformat;

}[考點(diǎn)]日期和正則表達(dá)式

6.

用JavaScript封裝一個(gè)函數(shù)，可實(shí)現(xiàn)整數(shù)的千分位逗號(hào)分隔符(不用考慮小數(shù))，例如12345用12,345表示。正確答案：先將整數(shù)轉(zhuǎn)換為字符串，再用replace()方法為其添加千分位逗號(hào)分隔符，具體如下所示。

functionthousandBitSeparator(num){

returnnum.toString().replace(/(\d)(?=(\d{3})+$)/g,function(match){

returnmatch+",";

});

}

在上面的代碼中，正則表達(dá)式首先捕獲一個(gè)數(shù)字，再用零寬正向先行斷言(?=)自定義匹配條件，匹配的條件是當(dāng)前數(shù)字之后的數(shù)字個(gè)數(shù)是3的倍數(shù)。注意，正則表達(dá)式中的元字符“$”不能省略，并且零寬斷言中匹配到的內(nèi)容不會(huì)被捕獲。[考點(diǎn)]日期和正則表達(dá)式

7.

編寫一個(gè)函數(shù)，用于清除字符串前后的空格。正確答案：使用String對(duì)象的replace()方法，再借助正則表達(dá)式來(lái)去除字符串前后的空格，代碼如下所示。

functiontrim(str){

returnstr.replace(/^\s+|\s+$/g,"");

}

在上面的正則表達(dá)式中，元字符“^”匹配行的開始，元字符“$”匹配行的結(jié)束；字符類“\s”表示空格；豎線(|)表示子表達(dá)式之間“或”的關(guān)系；標(biāo)志字符串“g”表示全局模式匹配，可找到文本中的所有匹配，而不是只匹配第一個(gè)。[考點(diǎn)]日期和正則表達(dá)式

8.

如何將字符串“get-element-by-id”轉(zhuǎn)化成駝峰表示法的“getElementById”?正確答案：可以使用String對(duì)象中的replace()方法執(zhí)行字符替換，replace()的第二個(gè)參數(shù)可以定義為一個(gè)回調(diào)函數(shù)，該函數(shù)的參數(shù)如下表所列?；卣{(diào)函數(shù)的參數(shù)參數(shù)描述match匹配的文本p1、p2...pn分組中匹配的文本，即捕獲的文本，p1表示第一個(gè)index匹配的文本在原字符串中的索引input被檢索的字符串

下面利用這個(gè)回調(diào)函數(shù)，在函數(shù)中將連接符和字符的組合(如“-e”、“-b”等)替換為一個(gè)大寫字符(如“E”、“B”等)，如下所示。

varstr="get-element-by-id";

str.replace(/-([a-z])/g,function(match,p1,index,input){

returnp1.toUpperCase();

});[考點(diǎn)]日期和正則表達(dá)式

9.

用數(shù)組方法把下面數(shù)組中的元素加起來(lái)，并把得到的和賦給result變量。

vararr=[1,2,3,4,5],result;正確答案：可以使用縮減數(shù)組的reduce()方法，這個(gè)方法會(huì)將數(shù)組計(jì)算成一個(gè)值。此方法接收兩個(gè)參數(shù)，第一個(gè)參數(shù)是回調(diào)函數(shù)，第二個(gè)參數(shù)是初始值(可選)，如果沒有設(shè)置，那么默認(rèn)會(huì)將數(shù)組中的第一個(gè)元素作為初始值?；卣{(diào)函數(shù)有4個(gè)參數(shù)：累積值、當(dāng)前元素、當(dāng)前元素的索引和原始數(shù)組。具體實(shí)現(xiàn)如以下代碼所示。

result=arr.reduce(function(accumulator,current,index,array){

returnaccumulator+current;

});[考點(diǎn)]數(shù)組

10.

不用循環(huán)語(yǔ)句(for、while等)來(lái)創(chuàng)建一個(gè)長(zhǎng)度為50的數(shù)組，每個(gè)元素的值等于它的索引。正確答案：先聲明一個(gè)長(zhǎng)度為51的空數(shù)組，然后用1把數(shù)組銜接為字符串，再將字符串分割為數(shù)組，數(shù)組中每個(gè)元素的值都為字符串“1”，最后用數(shù)組的map()方法迭代每個(gè)元素，把元素的值改為它的索引，如下所示。

Array(51).join("1").split("").map(function(value,index){

returnindex;

});[考點(diǎn)]數(shù)組

11.

設(shè)計(jì)一個(gè)函數(shù)來(lái)補(bǔ)全整數(shù)的前置0，例如為3補(bǔ)全兩個(gè)前置0，得到的結(jié)果為“003”。正確答案：設(shè)計(jì)的函數(shù)有兩個(gè)參數(shù)，第一個(gè)參數(shù)是待補(bǔ)全的整數(shù)，第二個(gè)參數(shù)是指定的位數(shù)，例如補(bǔ)全4位的整數(shù)，如果傳入1，那么返回“0001”；如果傳入123，那么返回“0123”。在函數(shù)中，首先創(chuàng)建一個(gè)指定長(zhǎng)度的空數(shù)組，然后將空數(shù)組用“0”合并，接著和傳入的整數(shù)拼接，最后調(diào)用String對(duì)象的slice()方法，并傳入一個(gè)負(fù)數(shù)，用于去除多余的零，具體代碼如下所示。

functionprefixZero(integer,digit){

return(newArray(digit).join("0")+integer),slice(-digit);

}[考點(diǎn)]數(shù)組

12.

有一個(gè)數(shù)組，其值為[1,[2,[3,4,2],2],5,[6]]，如何才能輸出[1,2,3,4,2,2,5,6]?正確答案：利用數(shù)組的toString()方法可將數(shù)組轉(zhuǎn)換為用逗號(hào)銜接的字符串，再用split()方法把字符串用逗號(hào)分隔成數(shù)組，最后用map()方法把新數(shù)組內(nèi)的每個(gè)元素轉(zhuǎn)換成數(shù)字，具體實(shí)現(xiàn)如下所示。

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

varresult=arr.toString().split(",")

.map(function(value,index,array){

return+value;

});[考點(diǎn)]數(shù)組

13.

split()方法與join()方法有哪些區(qū)別?正確答案：首先，兩者所屬的對(duì)象不同，split()方法屬于String和RegExp對(duì)象，而join()方法屬于Array對(duì)象；其次，兩者的功能不同，split()方法能將字符串分割為數(shù)組，join()方法能將數(shù)組中的元素銜接成一個(gè)字符串。[考點(diǎn)]數(shù)組

14.

用JavaScript對(duì)下面數(shù)組進(jìn)行降序排列，即根據(jù)a屬性的值從大到小排列。

vararr=[{a:3},{a:2},{a:1},{a:5},{a:4}];正確答案：可以用數(shù)組的排序方法sort()實(shí)現(xiàn)，該方法能接收一個(gè)比較函數(shù)。比較函數(shù)有兩個(gè)參數(shù)：x和y，也就是數(shù)組的兩個(gè)元素，根據(jù)函數(shù)的返回值，改變這兩個(gè)元素在數(shù)組中的位置，有如下3種移位規(guī)則：

(1)當(dāng)返回值大于0時(shí)，x會(huì)被移到y(tǒng)的后面。

(2)當(dāng)返回值等于0時(shí)，x和y的位置不改變。

(3)當(dāng)返回值小于0時(shí)，x會(huì)被移到y(tǒng)的前面。

根據(jù)上面的規(guī)則，可以用下面的代碼實(shí)現(xiàn)排序。還要注意一點(diǎn)，sort()方法會(huì)改變?cè)紨?shù)組，所以不用再給arr重新賦值。

arr.sort(function(x,y){

returnx.a＞y.a;

});[考點(diǎn)]數(shù)組

15.

實(shí)現(xiàn)一個(gè)isArray()函數(shù)，可判斷傳入的參數(shù)是否是數(shù)組。正確答案：ECMAScript5為Array對(duì)象添加了isArray()方法，專門用于檢測(cè)對(duì)象是否是數(shù)組，但并不是所有瀏覽器都支持。對(duì)于那些比較舊的瀏覽器，需要借助基礎(chǔ)對(duì)象Object的原型方法toString()，它能返回格式為“[objectType]”的字符串，其中Type是對(duì)象的類型，此方法能檢測(cè)出的對(duì)象有Number、Array、Date、RegExp等。調(diào)用toString()方法的時(shí)候也要注意，不能直接使用，必須使用函數(shù)的方法call()或apply()間接調(diào)用，因?yàn)閷?duì)象有可能重寫了此方法。具體寫法如下所示。

functionisArray(obj){

if(Array.isArray){

returnArray.isArray(obj);

}

vartoString=Ototype.toString;

returntoString.call(obj)==="[objectArray]";[考點(diǎn)]數(shù)組

16.

如何讓數(shù)組中的元素能夠隨機(jī)排序?正確答案：要打亂數(shù)組內(nèi)的元素，可以使用Fisher-Yates亂序算法，這是一種經(jīng)典的洗牌算法。在現(xiàn)實(shí)生活中，如果要洗牌，那么最隨機(jī)的做法就是從牌堆里隨便抽一張出來(lái)，然后放在一邊，之后再?gòu)氖Ｏ碌呐评镏貜?fù)之前的操作，直到所有牌都被抽出來(lái)并放到了另一堆中。抽象到代碼中，思路與之類似，只是操作細(xì)節(jié)略有不同。首先隨機(jī)從數(shù)組中取出一個(gè)元素，然后把該元素插到最后面，同時(shí)把被換走的元素插到剛剛的隨機(jī)位置。一輪過后，就只需在剩下的n-1個(gè)元素中再進(jìn)行相同的操作，直至第一個(gè)，如下所示。

functionshuffle(arr){

varlength=arr.length,

temp,index;

for(vari=length-1;i＞=0;i--){

index=Math.floor(Math.random()*i);//向下取整

temp=arr[index];

//取出隨機(jī)元素

arr[index]=arr[i];

//將最后面的元素放到上步隨機(jī)元素的位置

arr[i]=temp;

//將隨機(jī)元素插到最后面

}

returnarr;

}[考點(diǎn)]數(shù)組

17.

下面是一個(gè)有序的數(shù)組，接下來(lái)用二分查找搜索某個(gè)值，判斷它是否在數(shù)組中。

vararr=[1,2,3,4,5,6];正確答案：二分查找的前置條件是數(shù)組要有序，因?yàn)榇颂幰褲M足這個(gè)條件，所以可以省去排序的操作。二分查找是將搜索值與中間位置的元素進(jìn)行比較，然后以這個(gè)元素為分界點(diǎn)，把數(shù)組分成左右兩部分。如果和當(dāng)前中間位置的元素匹配，那么就結(jié)束查找，否則繼續(xù)和左邊或右邊部分中間位置的元素進(jìn)行比較，再把這部分子數(shù)組分成兩半。就這樣反復(fù)比較，反復(fù)縮小范圍，直至結(jié)束。具體的寫法如下所示。

functionbinarySearch(target,arr){

varstart=0,

//起始位置

end=arr.length-1,

//結(jié)束位置

middle,

element;

while(start＜=end){

middle=Math.floor((start+end)/2);

//向下取整

element=arr[middle];

//中間位置的元素

if(target==element)

//目標(biāo)元素匹配成功

returnmiddle;

elseif(target＞element)

//在右邊部分查找

start=middle+1;

else

//在左邊部分查找

end=middle-1;

}

return-1;

}[考點(diǎn)]數(shù)組

18.

下面是一個(gè)帶重復(fù)元素的數(shù)組，請(qǐng)將重復(fù)的元素只保留一個(gè)，多余的全部刪除。

vararr=[1,5,4,5,2,6,6,"1"];正確答案：可以用一種空間換時(shí)間的方法。先創(chuàng)建一個(gè)空對(duì)象和空數(shù)組，然后遍歷帶重復(fù)元素的數(shù)組，把此數(shù)組的元素存為對(duì)象的屬性，并判斷對(duì)象是否已包含此屬性。如果未包含，那么把當(dāng)前元素插入到空數(shù)組中，否則跳過，具體如下所示。

functiondistinct(arr){

varobj={},

//空對(duì)象

result=[],

//空數(shù)組

length=arr.length;

arr.forEach(function(value,index){

if(!obj[value]){

obj[value]=true;

result.push(value);

}

});

returnresult;

}

在上面代碼的if條件語(yǔ)句中，判斷依據(jù)是對(duì)象是否包含指定的屬性，當(dāng)引用對(duì)象沒有屬性時(shí)，得到的值是undefined，執(zhí)行邏輯非返回的結(jié)果是true。除此以外，還要注意一點(diǎn)，上面是通過方括號(hào)來(lái)讀取和寫入屬性的值，而方括號(hào)內(nèi)必須是一個(gè)計(jì)算結(jié)果為字符串的表達(dá)式，這就導(dǎo)致一個(gè)問題，如果傳入一個(gè)數(shù)字1和一個(gè)字符串“1”，那么這兩個(gè)會(huì)被認(rèn)為是同一個(gè)值，有一個(gè)會(huì)被過濾掉。為了避免出現(xiàn)這個(gè)問題，可以在遍歷的時(shí)候再加一次判斷，如下所示。

arr.forEach(function(value,index){

if(!obj[valuel){

obj[value]=true;

result.push(value);

}elseif(result.indexOf(value)==-1){

result.push(value);

}

});[考點(diǎn)]數(shù)組

19.

找出下面數(shù)組