2019拼多多前端筆試


 

 一.單選題 

1.

輸出為→5 5 5 5 5

setTimeout會在設定時間后將任務放進隊列中排隊,但當前線程中有for循環,會等到for循環結束后才會執行排着的5個回調函數,這時i已變為5,故一次性輸出5個5。詳見徹底理解setTimeout()

 

2.

輸出為456,因為鍵名只能為字符串,如果鍵名為對象,瀏覽器會默認調用toString()方法,將對象變成字符串"[object Object]"。兩次都輸入的是對象,則鍵名為[Object Object]的值最終覆蓋成了456。a對象最終為{[object Object]:456}。

(這里[object Object],object的prototype鏈中都沒有實現自己的toString()的話, 把object轉換為String時就會調用Object.prototype.toString, 輸出的格式是[object 對象的類型])。

3.

沒有任何變化,既沒有上移也沒有下移。只有margin-left和margin-top為負值時,元素才會發生偏移,margin-bottom和margin-right為負值時元素不偏移,但margin-bottom為負值會影響后面的元素,margin-right為負值會使自身寬度變大(不設寬度時)。當margin值取百分數時,是以最近的父元素的寬度為基准取值的。詳見margin賦值為負值的幾種效果(負值像素,負值百分數)

4.

輸出為object。

typeof的運算數未定義,返回的就是 “undefined”.

運算數為數字 typeof(x) = “number”

字符串 typeof(x) = “string”

布爾值 typeof(x) = “boolean”

對象,數組和null typeof(x) = “object”

函數 typeof(x) = “function”

5.

undefined

6.

undefined

變量聲明會提升到function最開頭,但賦值發生在最后,則上述代碼等價於

var a="aaa";
(function (){

var a;
console.log(a);
a="bbb";
})()

打印a的時候,a並沒有在function內賦值,所以是undefined

7.

6

8.

mousedown focus mouseup click

9.

解決回調陷阱常用方法:

  • function拆解
  • 事件發布/訂閱模式
  • Promise
  • Generator
  • async / await

詳見JavaScript異步編程__“回調地獄”的一些解決方案

 10.

a b d c

詳見http://es6.ruanyifeng.com/#docs/promise

11.

position:relative不會

12.

round() 方法可把一個數字舍入為最接近的整數。

floor() 方法可對一個數進行下舍入。

ceil() 方法可對一個數進行上舍入。

parseInt() 函數可解析一個字符串,並返回一個整數。

 經測試,若輸入小數,parseInt() 函數會返回整數部分,因為對於整數來說,小數點是無效字符。詳見ECMAScript 類型轉換

 

二.不定項選擇

 

 

 

三.填空題

apply(),call(),bind()

this指向詳解及改變它的指向的方法

 

輸出1

 

四.簡答題

1.

跨域,指的是瀏覽器不能執行其他網站的腳本。瀏覽器執行javascript腳本時,會檢查這個腳本屬於哪個頁面,如果不是同源頁面,就不會被執行。(所謂同源是指,域名,協議,端口均相同

跨域產生的原因:瀏覽器的同源策略,“同源策略限制了從同一個源加載的文檔或腳本如何與來自另一個源的資源進行交互。這是一個用於隔離潛在惡意文件的重要安全機制。”

跨域方法:

解決限制接口請求的方法:

(1)通過jsonp跨域。需要目標服務器配合一個callback函數。JSONP 在 HTML 標簽里,一些標簽比如 script、img 這樣的獲取資源的標簽是沒有跨域限制的。

(2)使用window.name+iframe來進行跨域

(3)通過CORS解決AJAX跨域。CORS 是一個 W3C 標准,全稱是 "跨域資源共享"(Cross-origin resource sharing)跨域資源共享 CORS 詳解。

(4)通過Nginx反向代理

(5)圖片ping或script標簽跨域

解決限制Dom 查詢的方法:
(1)postMessage window.postMessage() 是 HTML5 的一個接口,專注實現不同窗口不同頁面的跨域通訊。

(2)document.domain 這種方式只適合主域名相同,但子域名不同的 iframe 跨域。

詳見不要再問我跨域的問題了   八種方式實現跨域請求

2.

 

function duplicates(arr) {
     var newArr=[];
     arr.sort();
     for (var i = 0 ;i<arr.length;i++){
         if (arr[i]==arr[i+ 1 ]&&(newArr.indexOf(arr[i])==- 1 ) ){
             newArr.push(arr[i]);
             i++;
 
         }
     }
 
return newArr;}

 3.

JavaScript的number類型按照ECMA的JavaScript標准,它的Number類型就是IEEE 754的雙精度數值。IEEE 754標准就是一個對實數進行計算機編碼的標准。為了處理方便,這個標准引入了大量的折衷和妥協,建立在這種表達方式上的算法(例如除法運算)也一樣。由於數值表達方式存在“缺陷”,運算結果不可避免地堆聚起越來越多的誤差。按IEEE 754格式保存的浮點數精度相當於帶有15、16或17位小數位數的十進制小數,由於存在二進制和十進制的轉換問題,具體的位數會發生變化。要獲得最高的轉換精度,必須指定17位的小數——此時可以相信前15位的精度。因此JavaScript小數在做四則運算時,精度會丟失。

(因為計算機是二進制來表示浮點數的,無法准確表示一個浮點數,只能逼近。)

參考:javascript中0.1 + 0.2 != 0.3?

4.

map和foreach區別:

forEach()方法:對數組的每一個元素都執行一次提供的函數。該方法不會改變原來的數組,只是將數組中的每一項作為callback的參數執行一次。

map()方法:map()方法創建一個新的數組,其結果是該數組中的每個元素都調用一次callback后返回的結果,同樣,該方法不改變原有的數組,返回值: 新數組,每個元素都是回調函數的結果。

5.

function log(){
     var args = Array.prototype.slice.call(arguments).map(stringify);
    var t=args.toString().replace(',',' ')
     console.log( '(app)' +t)
}
function stringify(arg) {
     return arg;
}

 

6.

null表示"沒有對象",即該處不應該有值,代表一個空對象指針,使用typeof運算得到 “object”。

典型用法是:

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

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

undefined表示"缺少值",就是此處應該有一個值,但是還沒有定義。

典型用法是:

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

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

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

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

7.

無法直接調用數組方法或期望length屬性有什么特殊的行為,不具有數組的push,pop等方法,但仍可以對真正數組遍歷方法來遍歷它們。典型的是函數的argument參數,還有像調用getElementsByTagName,document.childNodes之類的,它們都返回NodeList對象都屬於偽數組。可以使用Array.prototype.slice.call(fakeArray)將數組轉化為真正的Array對象。

8.

 

/*方法一: BFC(塊級格式化上下文)*/
     .container{
         width:1000px;height:400px;border: 1px solid red;
     }
     .left{
         width:200px;height:100%;background: gray;
         float: left;
     }
     .rigth{
         overflow:hidden;  /* 觸發bfc */
         background: green;
     }
 
/*方法二: flex布局 */
     .container{
         width:1000px;height:400px;border:1px solid red;
         display:flex;         /*flex布局*/
     }
     .left{
         width:200px; height:100%;background:gray;
         flex:none;
     }
     .right{
         height:100%;background:green;
         flex:1;        /*flex布局*/
     }
 
/* 方法三: table布局 */
     .container{
         width:1000px;height:400px;border:1px solid red;
         display:table;         /*table布局*/
     }
     .left{
         width:200px; height:100%;background:gray;
         display:table-cell;
     }
     .right{
         height:100%;background:green;
         display: table-cell;
     }
 
/*方法四: css計算寬度calc*/
     .container{
         width:1000px;height:400px;border:1px solid red;
     }
     .left{
         width:200px;height: 100 %;background:gray;
         float :left;
     }
     .right{
         height: 100 %;background:green;
         float :right;
         width:calc( 100 % - 200px);
     }
</style>

   

 

 

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM