前端面試題總結——JS（持續更新中）

1.javascript的typeof返回哪些數據類型

Object number function boolean underfind string

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

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

3.split() join() 的區別

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

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

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

5.IE和DOM事件流的區別

1.執行順序不一樣、
2.參數不一樣
3.事件加不加on
4.this指向問題

6.IE和標準下有哪些兼容性的寫法

Var ev = ev || window.event
document.documentElement.clientWidth || document.body.clientWidth
Var target = ev.srcElement||ev.target

7.ajax請求的時候get 和post方式的區別

1.一個在url後面一個放在虛擬載體裏面
2.有大小限制
3.安全問題
4.應用不同一個是論壇等只需要請求的，一個是類似修改密碼的

8.call和apply的區別

Object.call(this,obj1,obj2,obj3)
Object.apply(this,arguments)

9.ajax請求時，如何解析json數據

使用eval parse 鑑於安全性考慮使用parse更靠譜

10.寫一個獲取非行間樣式的函數

function getStyle(obj, attr, value) {
if(!value) {
if(obj.currentStyle) {
return obj.currentStyle(attr)
}
else {
obj.getComputedStyle(attr, false)
}
}
else {
obj.style[attr]=value
}
}

11.事件委託(代理)是什麼

讓利用事件冒泡的原理，讓自己的所觸發的事件，讓他的父元素代替執行！

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

閉包就是能夠讀取其他函數內部變量的函數。
http://blog.csdn.net/gaoshanw… （問這個問題的不是一個公司）
也可以直接點擊此處查看之前更的關於閉包的文章

13.如何阻止事件冒泡和默認事件

stoppropagation / preventdefault

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

obj.appendChidl()
obj.innersetBefore
obj.replaceChild
obj.removeChild

15.解釋jsonp的原理，以及爲什麼不是真正的ajax

動態創建script標籤，回調函數
Ajax是頁面無刷新請求數據操作

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

本地對象爲array obj regexp等可以new實例化
內置對象爲gload Math 等不可以實例化的
宿主爲瀏覽器自帶的document,window 等

17.document load 和document ready的區別

頁面加載完成有兩種事件：
一.是ready，表示文檔結構已經加載完成（不包含圖片等非文字媒體文件）。
二.是onload，指示頁面包含圖片等文件在內的所有元素都加載完成。

18.””和“=”的不同

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

19.javascript的同源策略

同源策略是一個很重要的安全理念，它在保證數據的安全性方面有着重要的意義，
一段腳本只能讀取來自於同一來源的窗口和文檔的屬性，這裏的同一來源指的是協議、域名和端口號的組合

20.最快捷的數組求最大值

var arr = [ 1,5,1,7,5,9];
Math.max(...arr)  // 9

21.更短的數組去重寫法

[...new Set([2,"12",2,12,1,2,1,6,12,13,6])]

// [2, "12", 12, 1, 6, 13]

22.排序算法

升序：

var numberArray = [3,6,2,4,1,5];
numberArray.sort(function(a,b){  
   return a-b;
})
console.log(numberArray);

23.冒泡排序

var examplearr=[8,94,15,88,55,76,21,39];
function sortarr(arr){
    for(i=0;i<arr.length-1;i++){
        for(j=0;j<arr.length-1-i;j++){
            if(arr[j]>arr[j+1]){
                var temp=arr[j];
                arr[j]=arr[j+1];
                arr[j+1]=temp;
            }
        }
    }
    return arr;
}
sortarr(examplearr);
console.log(examplearr);

24.null和undefined的區別：

null：表示無值；undefined：表示一個未聲明的變量，或已聲明但沒有賦值的變量，
或一個並不存在的對象屬性。

25.使用閉包的注意點：

1.由於閉包會使得函數中的變量都被保存在內存中，內存消耗很大，所以不能濫用閉包，否則會造成網頁的性能問題，在IE中可能導致內存泄露。解決方法是，在退出函數之前，將不使用的局部變量全部刪除。

2.閉包會在父函數外部，改變父函數內部變量的值。所以，如果你把父函數當作對象（object）使用，把閉包當作它的公用方法（Public Method），把內部變量當作它的私有屬性（private value），這時一定要小心，不要隨便改變父函數內部變量的值。
（關於閉包，詳細瞭解請看JavaScript之作用域與閉包詳解）

26.請解釋JSONP的工作原理，以及它爲什麼不是真正的AJAX。

JSONP (JSON with Padding)是一個簡單高效的跨域方式，HTML中的script標籤可以加載並執行其他域的javascript，於是我們可以通過script標記來動態加載其他域的資源。例如我要從域A的頁面pageA加載域B的數據，那麼在域B的頁面pageB中我以JavaScript的形式聲明pageA需要的數據，然後在 pageA中用script標籤把pageB加載進來，那麼pageB中的腳本就會得以執行。JSONP在此基礎上加入了回調函數，pageB加載完之後會執行pageA中定義的函數，所需要的數據會以參數的形式傳遞給該函數。JSONP易於實現，但是也會存在一些安全隱患，如果第三方的腳本隨意地執行，那麼它就可以篡改頁面內容，截獲敏感數據。但是在受信任的雙方傳遞數據，JSONP是非常合適的選擇。

AJAX是不跨域的，而JSONP是一個是跨域的，還有就是二者接收參數形式不一樣！

27.請解釋變量聲明提升。

在函數執行時，把變量的聲明提升到了函數頂部，而其值定義依然在原來位置。

28.如何從瀏覽器的URL中獲取查詢字符串參數。

以下函數把獲取一個key的參數。

  function parseQueryString ( name ){
      name = name.replace(/[\[]/,"\\\[");
      var regexS = "[\\?&]"+name+"=([^&#]*)";
      var regex = new RegExp( regexS );
      var results = regex.exec( window.location.href );

      if(results == null) {
          return "";
      } else {
     return results[1];
     }
 }

29.arguments是什麼？

arguments雖然有一些數組的性質，但其並非真正的數組，只是一個類數組對象。
其並沒有數組的很多方法，不能像真正的數組那樣調用.jion(),.concat(),.pop()等方法。

30.什麼是”use strict”;?使用它的好處和壞處分別是什麼？

在代碼中出現表達式-“use strict”; 意味着代碼按照嚴格模式解析，這種模式使得Javascript在更嚴格的條件下運行。

好處：
1.消除Javascript語法的一些不合理、不嚴謹之處，減少一些怪異行爲;
2.消除代碼運行的一些不安全之處，保證代碼運行的安全；
3.提高編譯器效率，增加運行速度；

壞處：
1.同樣的代碼，在”嚴格模式”中，可能會有不一樣的運行結果；一些在”正常模式”下可以運行的語句，在”嚴格模式”下將不能運行。

31.什麼是回調函數？

1.就是一個函數的調用過程。那麼就從理解這個調用過程開始吧。
函數a有一個參數，這個參數是個函數b，當函數a執行完以後執行函數b。那麼這個過程就叫回調。

2.另外種解釋：開發網站的過程中，我們經常遇到某些耗時很長的javascript操作。其中，既有異步的操作（比如ajax讀取服務器數據），也有同步的操作（比如遍歷一個大型數組），它們都不是立即能得到結果的。
通常的做法是，爲它們指定回調函數（callback）。即事先規定，一旦它們運行結束，應該調用哪些函數。

32.使用 typeof bar === “object” 判斷 bar 是不是一個對象有神馬潛在的弊端？如何避免這種弊端？

let obj = {};
let arr = [];

console.log(typeof obj === 'object');  //true
console.log(typeof arr === 'object');  //true

從上面的輸出結果可知，typeof bar === “object” 並不能準確判斷 bar 就是一個 Object。可以通過 Object.prototype.toString.call(bar) === “[object Object]” 來避免這種弊端：

let obj = {};
let arr = [];

console.log(Object.prototype.toString.call(obj));  //[object Object]
console.log(Object.prototype.toString.call(arr));  //[object Array]

33.下面的代碼會輸出什麼？爲什麼？


    console.log(1 +  "2" + "2"); //122
    console.log(1 +  +"2" + "2"); //32
    console.log(1 +  -"1" + "2"); //02
    console.log(+"1" +  "1" + "2"); //112
    console.log( "A" - "B" + "2"); //NaN2
    console.log( "A" - "B" + 2); //NaN
    console.log('3' + 2 + 1);//321
    console.log(typeof +'3');  //number
    console.log(typeof (''+3));  //string
    console.log('a' * 'sd');   //NaN

34.邏輯運算

或邏輯時：當0在前面時console.log((0|| 2));則輸出爲後面的數，爲2；

當除0以爲的數在前面時console.log((2|| 0));則輸出爲2；

與邏輯時：當只要有0時console.log(0&&2 );則輸出都爲0；

     當不存在0時，console.log(1&&2 );則輸出都爲後面的一個，爲2；
                 console.log(2&&1 );則輸出爲1；

35.在 JavaScript，常見的 false 值：

0, ‘0’, +0, -0, false, ‘’,null,undefined,null,NaN

要注意空數組([])和空對象({}):


    console.log([] == false) //true
    console.log({} == false) //false
    console.log(Boolean([])) //true

36.解釋下面代碼的輸出

 var a={},
        b={key:'b'},
        c={key:'c'};

    a[b]=123;
    a[c]=456;

    console.log(a[b]);

因爲在設置對象屬性時，JS將隱式地stringify參數值。
在本例中，由於b和c都是對象，它們都將被轉換爲“[object object]”。
因此，a[b]和[c]都等價於[[object object]]，並且可以互換使用。
所以，設置或引用[c]與設置或引用a[b]完全相同。`

37.解釋下面代碼的輸出

(function(x) {
    return (function(y) {
        console.log(x);
    })(2)
})(1);

輸出1，閉包能夠訪問外部作用域的變量或參數。

38.請寫出以下輸出結果：

function Foo() {
    getName = function () { alert (1); };
    return this;
}
Foo.getName = function () { alert (2);};
Foo.prototype.getName = function () { alert (3);};
var getName = function () { alert (4);};
function getName() { alert (5);}

Foo.getName(); //2
getName(); //4
Foo().getName(); //1
getName(); //1
new Foo.getName(); //2
new Foo().getName(); //3
new new Foo().getName(); //3

39.談談你對Ajax的理解？(概念、特點、作用)

AJAX全稱爲“Asynchronous JavaScript And XML”（異步JavaScript和XML）是指一種創建交互式網頁應用的開發技術、改善用戶體驗，實現無刷新效果。

優點

a、不需要插件支持
b、優秀的用戶體驗
c、提高Web程序的性能
d、減輕服務器和帶寬的負擔

缺點

a、破壞瀏覽器“前進”、“後退”按鈕的正常功能，可以通過簡單的插件彌補
b、對搜索引擎的支持不足

40.說說你對延遲對象deferred的理解?

a、什麼是deferred對象

在回調函數方面，jQuery的功能非常弱。爲了改變這一點，jQuery開發團隊就設計了deferred對象。
簡單說，deferred對象就是jQuery的回調函數解決方案。在英語中，defer的意思是”延遲”，所以deferred對象的含義就是”延遲”到未來某個點再執行。
它解決了如何處理耗時操作的問題，對那些操作提供了更好的控制，以及統一的編程接口。

b、它的主要功能，可以歸結爲四點：

(1)、實現鏈式操作
(2)、指定同一操作的多個回調函數
(3)、爲多個操作指定回調函數
(4)、普通操作的回調函數接口

41.什麼是跨域，如何實現跨域訪問?

跨域是指不同域名之間相互訪問。
JavaScript同源策略的限制，A域名下的JavaScript無法操作B或是C域名下的對象

實現：

(1)、JSONP跨域：利用script腳本允許引用不同域下的js實現的，將回調方法帶入服務器，返回結果時回調。
1 通過jsonp跨域

    1.原生實現：

<script>
            var script = document.createElement('script');
            script.type = 'text/javascript';

            // 傳參並指定回調執行函數爲onBack
            script.src = 'http://www.....:8080/login?user=admin&callback=onBack';
            document.head.appendChild(script);

            // 回調執行函數
            function onBack(res) {
                alert(JSON.stringify(res));
            }
         </script>

2.document.domain + iframe跨域  
    此方案僅限主域相同，子域不同的跨域應用場景。
    1.父窗口：(http://www.domain.com/a.html)

  <iframe id="iframe" src="http://child.domain.com/b.html"></iframe>
        <script>
            document.domain = 'domain.com';
            var user = 'admin';
        </script>
            2.子窗口：(http://child.domain.com/b.html)

  <script>
            document.domain = 'domain.com';
            // 獲取父窗口中變量
            alert('get js data from parent ---> ' + window.parent.user);
        </script>
弊端：請看下面渲染加載優化

1、 nginx代理跨域
2、 nodejs中間件代理跨域
3、 後端在頭部信息裏面設置安全域名

(3)、跨域資源共享（CORS）
跨域資源共享（CORS）是一種網絡瀏覽器的技術規範，它爲Web服務器定義了一種方式，允許網頁從不同的域訪問其資源。

CORS與JSONP相比:

a、JSONP只能實現GET請求，而CORS支持所有類型的HTTP請求。
b、使用CORS，開發者可以使用普通的XMLHttpRequest發起請求和獲得數據，比起JSONP有更好的錯誤處理。
c、JSONP主要被老的瀏覽器支持，它們往往不支持CORS，而絕大多數現代瀏覽器都已經支持了CORS。
更多跨域的具體內容請看 https://segmentfault.com/a/11…

42.爲什麼要使用模板引擎？

a.模板引擎（這裏特指用於Web開發的模板引擎）是爲了使用戶界面與業務數據（內容）分離而產生的，它可以生成特定格式的文檔，用於網站的模板引擎就會生成一個標準的HTML文檔。
b.在一些示例中javascript有大量的html字符串，html中有一些像onclick樣的javascript，這樣javascript中有html，html中有javascript，代碼的偶合度很高，不便於修改與維護，使用模板引擎可以解決問題。

43.根據你的理解,請簡述JavaScript腳本的執行原理?

JavaScript是一種動態、弱類型、基於原型的語言，通過瀏覽器可以直接執行。
當瀏覽器遇到

44.JavaScript的數據類型有哪些？

基本數據類型：字符串 String、數字 Number、布爾Boolean
複合數據類型：數組 Array、對象 Object
特殊數據類型：Null 空對象、Undefined 未定義

45.ionic和angularjs的區別?

a、ionic是一個用來開發混合手機應用的，開源的，免費的代碼庫。可以優化html、css和js的性能，構建高效的應用程序，而且還可以用於構建Sass和AngularJS的優化。
b、AngularJS通過新的屬性和表達式擴展了HTML。AngularJS可以構建一個單一頁面應用程序（SPAs：Single Page Applications）。
c、Ionic是一個混合APP開發工具，它以AngularJS爲中間腳本工具(稱爲庫，似乎又不恰當)，所以，你如果要使用Ionic開發APP，就必須瞭解AngularJS。

46.談談你對閉包的理解?

(1)、使用閉包主要是爲了設計私有的方法和變量。閉包的優點是可以避免全局變量的污染，
缺點是閉包會常駐內存，會增大內存使用量，使用不當很容易造成內存泄露。

(2)、閉包有三個特性：
a、函數嵌套函數
b、函數內部可以引用外部的參數和變量
c、參數和變量不會被垃圾回收機制回收

47.談談你This對象的理解?

回答一：

(1)、js的this指向是不確定的，也就是說是可以動態改變的。call/apply 就是用於改變this指向的函數，這樣設計可以讓代碼更加靈活，複用性更高
(2)、this 一般情況下，都是指向函數的擁有者。
(3)、在函數自執行裏，this 指向的是 window 對象。

擴展：關於this，還有一個地方比較讓人模糊的是在dom事件裏，通常有如下3種情況：
a、使用標籤屬性註冊事件，此時this指向的是window對象。
b、對與a，要讓this指向input，可以將this作爲參數傳遞。
c、使用addEventListener等註冊事件。此時this也是指向 input。

回答二：

(1)、處於全局作用域下的this：

this;/*window*/
var a = {name: this}/*window*/
var b = [this];/*window*/

在全局作用域下，this默認指向window對象。

(2)、處在函數中的this，又分爲以下幾種情況：
a、一般定義的函數，然後一般的執行：

var a = function(){
console.log(this);
}
a();/*window*/

this還是默認指向window。

b、一般定義，用new調用執行：

var a = function(){
console.log(this);
}
new a();/*新建的空對象*/

這時候讓this指向新建的空對象，我們纔可以給空對象初始化自有變量
c、作爲對象屬性的函數，調用時：

var a = {
f:function(){
console.log(this)
}
}
a.f();/*a對象*/

這時候this指向調用f函數的a對象。
(3)、通過call()和apply()來改變this的默認引用：

var b = {id: 'b'};
var a = {
f:function(){
console.log(this)
　}
}
a.f.call(b);/*window*/

所有函數對象都有的call方法和apply方法，它們的用法大體相似，f.call(b);的意思是，執行f函數，並將f函數執行期活動對象裏的this指向b對象，這樣標示符解析時，this就會是b對象了。不過調用函數是要傳參的。所以，f.call(b, x, y); f.apply(b, [x, y]);好吧，以上就是用call方法執行f函數，與用apply方法執行f函數時傳參方式，它們之間的差異，大家一目瞭然：apply通過數組的方式傳遞參數，call通過一個個的形參傳遞參數。
(4)、一些函數特殊執行情況this的指向問題：

a、setTimeout()和setInverval():

var a = function(){
console.log(this);
}
setTimeout(a,0);/*window*/
setInterval()類似。

b、dom模型中觸發事件的回調方法執行中活動對象裏的this指向該dom對象。

48.JavaScript對象的幾種創建方式?

(1) 工廠模式

function Parent(){
var Child = new Object();
Child.name="欲淚成雪";
Child.age="20";
return Child;
};
var x = Parent();

引用該對象的時候，這裏使用的是 var x = Parent()而不是 var x = new Parent();因爲後者會可能出現很多問題（前者也成爲工廠經典方式,後者稱之爲混合工廠方式），不推薦使用new的方式使用該對象

(2)構造函數方式

function Parent(){
　　this.name="欲淚成雪";
　　this.age="20";
};
var x =new Parent();

(3) 原型模式

function Parent(){
};
Parent.prototype.name="欲淚成雪";
Parent.prototype.age="20";
var x =new Parent();

(4)混合的構造函數，原型方式（推薦）

function Parent(){
　　this.name="欲淚成雪";
　　this.age=22;
};
Parent.prototype.lev=function(){
　　return this.name;
};
var x =new Parent();

(5)動態原型方式

function Parent(){
　　this.name="欲淚成雪";
　　this.age=22;
;
if(typeof Parent._lev=="undefined"){
Parent.prototype.lev=function(){
　　return this.name;
}
Parent._lev=true;
}
};
var x =new Parent();

49.請寫出js內存泄漏的問題?

回答一：

(1)、IE7/8 DOM循環引用導致內存泄漏
a、多個對象循環引用
b、循環引用自己

(2)、基礎的DOM泄漏
當原有的DOM被移除時，子結點引用沒有被移除則無法回收。

(3)、timer定時器泄漏
這個時候你無法回收buggyObject,解決辦法，先停止timer然後再回收

回答二：

內存泄漏指任何對象在您不再擁有或需要它之後仍然存在。
垃圾回收器定期掃描對象，並計算引用了每個對象的其他對象的數量。如果一個對象的引用數量爲 0（沒有其他對象引用過該對象），或對該對象的惟一引用是循環的，那麼該對象的內存即可回收。

setTimeout 的第一個參數使用字符串而非函數的話，會引發內存泄漏。
閉包、控制檯日誌、循環（在兩個對象彼此引用且彼此保留時，就會產生一個循環）也會引發內存泄漏問題。

50.JS應該放在什麼位置？

(1)、放在底部，雖然放在底部照樣會阻塞所有呈現，但不會阻塞資源下載。
(2)、如果嵌入JS放在head中，請把嵌入JS放在CSS頭部。
(3)、使用defer（只支持IE）
(4)、不要在嵌入的JS中調用運行時間較長的函數，如果一定要用，可以用setTimeout來調用

51.請你解釋一下事件冒泡機制

a、在一個對象上觸發某類事件（比如單擊onclick事件），如果此對象定義了此事件的處理程序，那麼此事件就會調用這個處理程序，如果沒有定義此事件處理程序或者事件返回true，那麼這個事件會向這個對象的父級對象傳播，從裏到外，直至它被處理（父級對象所有同類事件都將被激活），或者它到達了對象層次的最頂層，即document對象（有些瀏覽器是window）。

b、冒泡型事件：事件按照從最特定的事件目標到最不特定的事件目標(document對象)的順序觸發

c、js冒泡機制是指如果某元素定義了事件A，如click事件，如果觸發了事件之後，沒有阻止冒泡事件，那麼事件將向父級元素傳播，觸發父類的click函數。

//阻止冒泡時間方法，兼容ie(e.cancleBubble)和ff(e.stopProgation)

function stopBubble(e){
var evt = e||window.event;
evt.stopPropagation?evt.stopPropagation():(evt.cancelBubble=true);//阻止冒泡
evt.preventDefault

51.說說你對Promise的理解?

ES6 原生提供了 Promise 對象。
所謂 Promise，就是一個對象，用來傳遞異步操作的消息。它代表了某個未來纔會知道結果的事件（通常是一個異步操作），並且這個事件提供統一的 API，可供進一步處理。

Promise 對象有以下兩個特點：

(1)、對象的狀態不受外界影響。Promise 對象代表一個異步操作，有三種狀態：Pending（進行中）、Resolved（已完成，又稱 Fulfilled）和 Rejected（已失敗）。只有異步操作的結果，可以決定當前是哪一種狀態，任何其他操作都無法改變這個狀態。這也是 Promise 這個名字的由來，它的英語意思就是「承諾」，表示其他手段無法改變。

(2)、一旦狀態改變，就不會再變，任何時候都可以得到這個結果。Promise 對象的狀態改變，只有兩種可能：從 Pending 變爲 Resolved 和從 Pending 變爲 Rejected。只要這兩種情況發生，狀態就凝固了，不會再變了，會一直保持這個結果。就算改變已經發生了，你再對 Promise 對象添加回調函數，也會立即得到這個結果。這與事件（Event）完全不同，事件的特點是，如果你錯過了它，再去監聽，是得不到結果的。

有了 Promise 對象，就可以將異步操作以同步操作的流程表達出來，避免了層層嵌套的回調函數。此外，Promise 對象提供統一的接口，使得控制異步操作更加容易。

Promise 也有一些缺點。首先，無法取消 Promise，一旦新建它就會立即執行，無法中途取消。其次，如果不設置回調函數，Promise 內部拋出的錯誤，不會反應到外部。第三，當處於 Pending 狀態時，無法得知目前進展到哪一個階段（剛剛開始還是即將完成）。

52.說說你對原型（prototype）理解?

JavaScript是一種通過原型實現繼承的語言與別的高級語言是有區別的，像java，C#是通過類型決定繼承關係的，JavaScript是的動態的弱類型語言，總之可以認爲JavaScript中所有都是對象，在JavaScript中，原型也是一個對象，通過原型可以實現對象的屬性繼承，JavaScript的對象中都包含了一個” prototype”內部屬性，這個屬性所對應的就是該對象的原型。

“prototype”作爲對象的內部屬性，是不能被直接訪問的。所以爲了方便查看一個對象的原型，Firefox和Chrome內核的JavaScript引擎中提供了”proto“這個非標準的訪問器（ECMA新標準中引入了標準對象原型訪問器”Object.getPrototype(object)”）。

原型的主要作用就是爲了實現繼承與擴展對象。

53.在 JavaScript 中,instanceof用於判斷某個對象是否被另一個函數構造。

使用 typeof 運算符時採用引用類型存儲值會出現一個問題，無論引用的是什麼類型的對象，它都返回 “object”。ECMAScript 引入了另一個 Java 運算符 instanceof 來解決這個問題。instanceof 運算符與 typeof 運算符相似，用於識別正在處理的對象的類型。與 typeof 方法不同的是，instanceof 方法要求開發者明確地確認對象爲某特定類型。

54.純數組排序

常見有冒泡和選擇,這裏利用sort排序

 export const orderArr=(arr)=>{
        arr.sort((a,b)=>{
            return a-b //將arr升序排列,如果是倒序return -(a-b)
        })
    }

55.數組對象排序

export const orderArr=(arr)=>{
        arr.sort((a,b)=>{
            let value1 = a[property];
            let value2 = b[property];
            return value1 - value2;//sort方法接收一個函數作爲參數，這裏嵌套一層函數用
            //來接收對象屬性名，其他部分代碼與正常使用sort方法相同
        })
    }

對象遍歷

export const traverseObj=(obj)=>{
        for(let variable in obj){
        //For…in遍歷對象包括所有繼承的屬性,所以如果
         //只是想使用對象本身的屬性需要做一個判斷
        if(obj.hasOwnProperty(variable)){
            console.log(variable,obj[variable])
        }
        }
    }

57.promise

promise是一種封裝未來值的易於複用的異步任務管理機制,主要解決地獄回調和控制異步的順序

1.應用方法一

export const promiseDemo=()=>{
new Promise((resolve,reject)=>{
    resolve(()=>{
        let a=1;
        return ++a;
    }).then((data)=>{
        console.log(data)//data值爲++a的值
    }).catch(()=>{//錯誤執行這個

    })
})
}

2.應用方法二

export const promiseDemo=()=>{
Promise.resolve([1,2,3]).then((data)=>{//直接初始化一個Promise並執行resolve方法
    console.log(data)//data值爲[1,2,3]
})
}

58.如何禁用網頁菜單右鍵？

<script>
function Click(){
window.event.returnValue=false;
}
document.oncontextmenu=Click;
</script>
恢復方法：javascript:alert(document.oncontextmenu='')

JavaScript語言

發佈了42 篇原創文章 · 獲贊 150 · 訪問量 3萬+

私信關注

前端面試題總結——JS（持續更新中）

前端面試題總結——JS（持續更新中）

1.javascript的typeof返回哪些數據類型

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

3.split() join() 的區別

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

5.IE和DOM事件流的區別

6.IE和標準下有哪些兼容性的寫法

7.ajax請求的時候get 和post方式的區別

8.call和apply的區別

9.ajax請求時，如何解析json數據

10.寫一個獲取非行間樣式的函數

11.事件委託(代理)是什麼

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

13.如何阻止事件冒泡和默認事件

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

15.解釋jsonp的原理，以及爲什麼不是真正的ajax

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

17.document load 和document ready的區別

18.””和“=”的不同

19.javascript的同源策略

20.最快捷的數組求最大值

21.更短的數組去重寫法

22.排序算法

23.冒泡排序

24.null和undefined的區別：

25.使用閉包的注意點：

26.請解釋JSONP的工作原理，以及它爲什麼不是真正的AJAX。

27.請解釋變量聲明提升。

28.如何從瀏覽器的URL中獲取查詢字符串參數。

29.arguments是什麼？

30.什麼是”use strict”;?使用它的好處和壞處分別是什麼？

31.什麼是回調函數？

32.使用 typeof bar === “object” 判斷 bar 是不是一個對象有神馬潛在的弊端？如何避免這種弊端？

33.下面的代碼會輸出什麼？爲什麼？

34.邏輯運算

35.在 JavaScript，常見的 false 值：

36.解釋下面代碼的輸出

37.解釋下面代碼的輸出

38.請寫出以下輸出結果：

39.談談你對Ajax的理解？(概念、特點、作用)

40.說說你對延遲對象deferred的理解?

41.什麼是跨域，如何實現跨域訪問?

42.爲什麼要使用模板引擎？

43.根據你的理解,請簡述JavaScript腳本的執行原理?

44.JavaScript的數據類型有哪些？

45.ionic和angularjs的區別?

46.談談你對閉包的理解?

47.談談你This對象的理解?

48.JavaScript對象的幾種創建方式?

49.請寫出js內存泄漏的問題?

50.JS應該放在什麼位置？

51.請你解釋一下事件冒泡機制

51.說說你對Promise的理解?

52.說說你對原型（prototype）理解?

53.在 JavaScript 中,instanceof用於判斷某個對象是否被另一個函數構造。

54.純數組排序

55.數組對象排序

57.promise

58.如何禁用網頁菜單右鍵？

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