2020前端JavaScript面試題精選(不斷更新)

1 .介紹JavaScript的基本數據類型

Number、String 、Boolean 、Null、Undefined Object 是 JavaScript 中所有對象的父對象
數據封裝類對象:Object、Array、Boolean、Number 和 String
其他對象:Function、Arguments、Math、Date、RegExp、Error
新類型:Symbol

2.eval是做什麼的?

它的功能是把對應的字符串解析成JS代碼並運行; 應該避免使用eval,不安全,非常耗性能(2次,一次解析成js語句,一次執行)。
由JSON字符串轉換爲JSON對象的時候可以用eval,var obj =eval(’(’+ str +’)’);

3.Javascript中,有一個函數,執行時對象查找時,永遠不會去查找原型,這個函數是?

hasOwnProperty
javaScript中hasOwnProperty函數方法是返回一個布爾值,指出一個對象是否具有指定名稱的屬性。此方法無法檢查該對象的原型鏈中是否具有該屬性;該屬性必須是對象本身的一個成員。
使用方法: object.hasOwnProperty(proName) 其中參數object是必選項。一個對象的實例。
proName是必選項。一個屬性名稱的字符串值。 如果 object
具有指定名稱的屬性,那麼JavaScript中hasOwnProperty函數方法返回 true,反之則返回 false。

4.js延遲加載的方式有哪些?

defer和async、動態創建DOM方式(用得最多)、按需異步載入js

5.如何判斷當前腳本運行在瀏覽器還是node環境中?

this === window ? ‘browser’ : ‘node’;
通過判斷Global對象是否爲window,如果不爲window,當前腳本沒有運行在瀏覽器中

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

強制(parseInt(),parseFloat(),Number())
隱式(== ,!=)

7.split() 、join() 的區別

前者是切割成數組的形式,後者是將數組轉換成字符串

8.數組方法pop() push() unshift() shift()map()filter()

push()尾部添加 pop()尾部刪除
unshift()頭部添加 shift()頭部刪除
map() : 遍歷數組中的元素,返回一個新數組(包含回調函數返回的數據)
filter():遍歷數組中的元素, 返回一個新數組(包含回調函數返回true的元素)

9.如何阻止事件冒泡和事件默認行爲

//阻止事件冒泡

if(typeof ev.stopPropagation=='function') {  //標準的

    ev.stopPropagation();

} else { //非標準IE

    window.event.cancelBubble = true;

}

//阻止事件默認行爲
return false
window.onload 和document ready的區別
window.onload 是在dom文檔樹加載完和所有文件加載完之後執行一個函數 document.ready原生中
沒有這個方法,jquery中有 $().ready(function),在dom文檔樹加 載完之後執行一個函數
(注意,這裏面的文檔樹加載完不代表全部文件加載完)。
$(document).ready要比window.onload先執行
window.onload只能出來一次,$(document).ready可以出現多次

10.“ == ” 和 “ === ”的不同

前者會自動轉換類型
後者不會

11.當一個DOM節點被點擊時候,我們希望能夠執行一個函數,應該怎麼做?

直接在DOM裏綁定事件:<div οnclick=”test()”></div>
在JS裏通過onclick綁定:xxx.onclick = test
通過事件添加進行綁定:addEventListener(xxx, ‘click’, test)

12.Javascript的事件流模型都有什麼?

“事件冒泡”:事件開始由最具體的元素接受,然後逐級向上傳播
“事件捕捉”:事件由最不具體的節點先接收,然後逐級向下,一直到最具體的
“DOM事件流”:三個階段:事件捕捉,目標階段,事件冒泡

13.截取字符串abcdefg的efg

alert('abcdefg'.substring(4));

14.字符串反轉,如將 ‘12345678’ 變成 ‘87654321’

//思路:先將字符串轉換爲數組 split(),
利用數組的反序函數 reverse()顛倒數組,再利用 jion() 轉換爲字符串

var str = '12345678';
str = str.split('').reverse().join('');

15.哪些操作會造成內存泄漏?

內存泄漏指任何對象在您不再擁有或需要它之後仍然存在。

垃圾回收器定期掃描對象,並計算引用了每個對象的其他對象的數量。
如果一個對象的 引用數量爲0(沒有其他對象引用過該對象),或對該對象的惟一引用是循環的,那麼 該對象的內存即可回收。

  1. setTimeout 的第一個參數使用字符串而非函數的話,會引發內存泄漏。
  2. 閉包
  3. 控制檯日誌
  4. 循環(在兩個對象彼此引用且彼此保留時,就會產生一個循環)

16.typeof運算符返回值中有一個跟javascript數據類型不一致,它是?如何判斷是不是數組?

Array,Array.isArray(data)

17.window.location.search() 返回的是什麼?

http://localhost:8080/xxx?ver=1.0&id=123

返回值:?ver=1.0&id=timlq 也就是問號後面的部分

18.window.location.reload() 作用?

刷新當前頁面。

19.javascript 中的垃圾回收機制?

在Javascript中,如果一個對象不再被引用,那麼這個對象就會被GC回收。如果兩個對象互相引用,而不再
被第3者所引用,那麼這兩個互相引用的對象也會被回收。因爲函數a被b引用,b又被a外的c引用,這就是爲什麼 函數a執行後不會被回收的原因。

20.簡述readonly與disabled的區別

ReadOnly和Disabled的作用是使用戶不能夠更改表單域中的內容. 但是二者還是有着一些區別的:
1、Readonly只針對input(text/password)和textarea有效,而disabled對於所有的表單
元素有效,包括select,radio,checkbox,button等。
2、在表單元素使用了disabled後,我們將表單以POST或者GET的方式提交的話,這
個元素的值不會被傳遞出去,而readonly會將該值傳遞出去

21.用JavaScript實現升序排序。數據爲23、45、18、37、92、13、24

//升序算法

function sort(arr){

    for (var i = 0; i <arr.length; i++) {

        for (var j = 0; j <arr.length-i; j++) {

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

                var c=arr[j];//交換兩個變量的位置

                arr[j]=arr[j+1];

                arr[j+1]=c;

            }

        };

    };

    return arr.toString();

}

console.log(sort([23,45,18,37,92,13,24]));

22.請說出三種減低頁面加載時間的方法

1、壓縮css、js文件

2、合併js、css文件,減少http請求

3、外部js、css文件放在最底下

4、減少dom操作,儘可能用變量替代不必要的dom操作

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章