小红书2020校招前端笔试题卷一
題目1-下列說(shuō)法正確的是()多選
A: requestAnimationFrame(foo) 確保使瀏覽器在下一次重繪之前調(diào)用 foo 方法B: 在 addEventListener 的處理方法中使用 e.preventDefault() 可以阻止事件冒泡C: 把 <script> 標(biāo)簽的引入放在文檔末尾可以確保腳本下載和執(zhí)行均在文檔解析完成后發(fā)生D: 多個(gè) <script> 標(biāo)簽使用 defer 屬性引入腳本時(shí),可以確保腳本的執(zhí)行是按照其被引入的順序的- 答案
- A,C,D
- 解析
- 更詳細(xì)的script的defer和async可以看這位博主的
A選項(xiàng):
window.requestAnimationFrame() 告訴瀏覽器——你希望執(zhí)行一個(gè)動(dòng)畫(huà),并且要求瀏覽器在下次重繪之前調(diào)用指定的回調(diào)函數(shù)更新動(dòng)畫(huà)。該方法需要傳入一個(gè)回調(diào)函數(shù)作為參數(shù),該回調(diào)函數(shù)會(huì)在瀏覽器下一次重繪之前執(zhí)行
BCD選項(xiàng):
-
B: 記住,阻止事件默認(rèn)行為是preventDefault 停止事件冒泡是stopPropagation (記住關(guān)鍵字就好了,阻止和停止這二個(gè)關(guān)鍵字)
-
C: 由于js是單線程的,要么css在解析,要么js在解析,所以某一個(gè)時(shí)刻要么只有js,要么只有css在運(yùn)行,所以把script放在最后可以等待css解析完成后執(zhí)行js腳本
-
D: <script defer></script>
- 具有defer特性的腳本不會(huì)阻塞頁(yè)面,相當(dāng)于遇到了就丟到后臺(tái)去執(zhí)行
- 具有defer特征的腳本總是到等到DOM解析完畢,但在 DOMContentLoaded 事件之前執(zhí)行。
- 具有defer特征的腳本保持其引入順序執(zhí)行,(有多個(gè)defer,則執(zhí)行順序按照引入順序來(lái)執(zhí)行)
假設(shè),我們有兩個(gè)具有 defer 特性的腳本:long.js 在前,small.js 在后。
<script defer src="https://javascript.info/article/script-async-defer/long.js"></script> <script defer src="https://javascript.info/article/script-async-defer/small.js"></script>瀏覽器掃描頁(yè)面尋找腳本,然后并行下載它們,以提高性能。因此,在上面的示例中,兩個(gè)腳本是并行下載的。small.js 可能會(huì)先下載完成。
……但是,defer 特性除了告訴瀏覽器“不要阻塞頁(yè)面”之外,還可以確保腳本執(zhí)行的相對(duì)順序。因此,即使 small.js 先加載完成,它也需要等到 long.js 執(zhí)行結(jié)束才會(huì)被執(zhí)行。
當(dāng)我們需要先加載 JavaScript 庫(kù),然后再加載依賴(lài)于它的腳本時(shí),這可能會(huì)很有用。
總結(jié):
? 使用 defer 屬性可以讓腳本在文檔完全呈現(xiàn)之后再執(zhí)行,延遲腳本總是按照指定它們的順序執(zhí)行。
? 使用 async 屬性可以表示當(dāng)前腳本不必等待其他腳本,也不必阻塞文檔呈現(xiàn)。不能保證異步腳本按照它們?cè)陧?yè)面中出現(xiàn)的順序執(zhí)行。
題目2-請(qǐng)根據(jù)下面的示例描述原型鏈與繼承的關(guān)系并解釋原因:
class A {} class B extends A {} const a = new A() const b = new B() a.__proto__ === b.__proto__ === B.__proto === B.prototype.__proto__ === b.__proto__.__proto__ ===-
答案
a.__proto__ === A.prototype b.__proto__ === B.prototype B.__proto__ === A B.prototype.__proto__ === A.prototype b.__proto__.__proto__ === A.prorotype
解析
- 這位博主寫(xiě)的很詳細(xì)
大概意思就是如圖
題目3-ajax 的 readyState 有哪幾個(gè)狀態(tài),含義分別是什么?
有5個(gè)狀態(tài),分別是
0 : 代表open方法還沒(méi)有被調(diào)用
1: 代表send方法還沒(méi)有被調(diào)用
2: 還沒(méi)有收到響應(yīng)(剛剛發(fā)送)
3: 收到一部分響應(yīng)(數(shù)據(jù)流一樣慢慢來(lái))
4: 收到全部數(shù)據(jù)(數(shù)據(jù)傳輸完成)
補(bǔ)充:
使用XMLHttpRequest發(fā)送ajax請(qǐng)求
var xhr = new XMLHttpRequest(); xhr.open("get","http://127.0.0.1:8000"); xhr.send(); xhr.onreadystatechange = function() {// xhr.readyState === 4 && xhr.status >=200 && xhr.stats <300也可以if(xhr.readyState === 4 && xhr.status === 200){console.log(xhr.responseText);} } xhr.onerror = function (error) {console.log(error) };使用javascript實(shí)現(xiàn)每隔三位使用逗號(hào)分隔一次
代碼:參考大佬的
function paddingNum(num){//記錄下是正數(shù)還是負(fù)數(shù)let flag = num > 0 ? true : false;//取絕對(duì)值并轉(zhuǎn)化為字符串num = Math.abs(num)+"";//獲取整數(shù)部分和小數(shù)部分let [numberLeft,numberRight] = num.split(".");//沒(méi)有小數(shù)位就用空字符串填充下numberRight = numberRight ? "."+numberRight : "";//暫存數(shù)字let temp = "";while(numberLeft.length > 3){//每次截取整數(shù)部分后3個(gè)字符串temp = "," + numberLeft.slice(-3) + temp;//將整數(shù)部分除去最后三個(gè)字符串numberLeft = numberLeft.slice(0,numberLeft.length - 3);}//循環(huán)結(jié)束,最后長(zhǎng)度小于3,就將剩余的連接上return flag ? numberLeft+temp+numberRight : "-"+numberLeft+temp+numberRight; }當(dāng)然,你需要的話也可以用這種方法
const paddingNum = num => (num).toLocaleString('en-US')//寫(xiě)復(fù)雜點(diǎn)就是 function paddingNum(num){let temp = num.toLocaleString('en-US');return temp; }題目3-給定長(zhǎng)度為n的整數(shù)數(shù)組nums,其中n > 1,返回輸出數(shù)組output ,其中output[i] 等于nums中除nums[i] 之外其余各元素的乘積
代碼:
function productExceptSelf(numArray) {let tempArray = [];numArray.forEach(item1 => {let num = 1;numArray.forEach(item2 => {if (item1 != item2) {num = num * item2;}});tempArray.push(num);});return tempArray; }題目4-薯隊(duì)長(zhǎng)帶著小紅薯參加密室逃脫團(tuán)建游戲,首先遇到了反轉(zhuǎn)游戲,小紅薯們根據(jù)游戲提示收集了多個(gè)單詞線索,并將單詞按要求加一個(gè)空格組 成了句子,最終要求把句子按單詞反轉(zhuǎn)解密。 說(shuō)明:收集的時(shí)候單詞前后可能會(huì)有多個(gè)空格,反轉(zhuǎn)后單詞不能有多個(gè)空格,具體見(jiàn)輸入輸出樣例。
輸入描述:
輸入一個(gè)字符串。包含空格和可見(jiàn)字符。長(zhǎng)度<=100000。
輸出描述:
輸出一個(gè)字符串,表示反轉(zhuǎn)后結(jié)果。
示例1
輸入 the sky is blue!輸出 blue! is sky the代碼:
<script>console.log(reverse("the sky is blue!"));function reverse(str) {//匹配任何非空白字符。等價(jià)于[^ \f\n\r\t\v]。var a = str.match(/(\S+)/g);//調(diào)用數(shù)組的方法a = a.reverse();return a.join(" ");} </script> 測(cè)試數(shù)據(jù) jifgykoserhurjkcnhskdncvgkiyhnsjdukzecrunyst 827136547tr8yh74f8o9l3w92qujwhe8iu7ryhf uincymh9oxw,z.ej/09l8kyut8w9o,x.9elo58km4yu ;78p0[2845){*(){P:T*#Q)I(OPUQjfpii[upOYHUIYG 9430q80965tpyw4[h 898888888888888888888888888888888888888888 iouy4ewrt8iu7hgfo2UIYTRFYJHMGDSAI f87e6rwtyugfhkjhki ZHONGGUOGONGCHANDANGWANSUI MAOZHUXIWANSUI總結(jié)
以上是生活随笔為你收集整理的小红书2020校招前端笔试题卷一的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問(wèn)題。