JavaScrip的常見面試題有哪些-創(chuàng)新互聯(lián)

小編給大家分享一下JavaScrip的常見面試題有哪些,相信大部分人都還不怎么了解,因此分享這篇文章給大家參考一下,希望大家閱讀完這篇文章后大有收獲,下面讓我們一起去了解一下吧!

創(chuàng)新互聯(lián)公司堅(jiān)持“要么做到,要么別承諾”的工作理念,服務(wù)領(lǐng)域包括:網(wǎng)站設(shè)計(jì)制作、成都網(wǎng)站建設(shè)、企業(yè)官網(wǎng)、英文網(wǎng)站、手機(jī)端網(wǎng)站、網(wǎng)站推廣等服務(wù),滿足客戶于互聯(lián)網(wǎng)時(shí)代的陽朔網(wǎng)站設(shè)計(jì)、移動(dòng)媒體設(shè)計(jì)的需求,幫助企業(yè)找到有效的互聯(lián)網(wǎng)解決方案。努力成為您成熟可靠的網(wǎng)絡(luò)建設(shè)合作伙伴!

首先:this 永遠(yuǎn)指向函數(shù)運(yùn)行時(shí)所在的對(duì)象,而不是函數(shù)被創(chuàng)建時(shí)所在的對(duì)象。匿名函數(shù)或不處于任何對(duì)象中的函數(shù)指向 window 。

1、 方法調(diào)用模式

當(dāng)函數(shù)被保存為對(duì)象的一個(gè)屬性時(shí),成該函數(shù)為該對(duì)象的方法。函數(shù)中this的值為該對(duì)象。

var foo = {
    name: 'fooname',
    getName: function (){
        return this.name  
    }
}
foo.getName();  // this => foo

2、 函數(shù)調(diào)用模式

當(dāng)函數(shù)并不是對(duì)象的屬性。函數(shù)中this的值為全局對(duì)象
note:某個(gè)方法中的內(nèi)部函數(shù)中的this的值也是全局對(duì)象,而非外部函數(shù)的this

function foo(){
    this.name = 'fooname';  
}
foo();  // this => window

3、構(gòu)造器調(diào)用模式

即使用new調(diào)用的函數(shù),則其中this將會(huì)被綁定到那個(gè)新構(gòu)造的對(duì)象。

function Foo(){
    this.name = 'fooname';
}
var foo = new Foo();  // this => foo

4、使用apply或call調(diào)用模式

該模式調(diào)用時(shí),函數(shù)中this被綁定到apply或call方法調(diào)用時(shí)接受的第一個(gè)參數(shù)。

function getName(name){
    this.name = name;
}
var foo = {};
getName.call(foo, name);  // this =>foo

改變this的值主要方法(目前想到的,歡迎評(píng)論添加):
apply或call方法調(diào)用時(shí)強(qiáng)制修改,使this指向第一個(gè)參數(shù)。
使用Function.bind方法創(chuàng)造新的函數(shù),該新函數(shù)的中this指向所提供的第一個(gè)參數(shù)。

二、請(qǐng)解釋原型繼承 (prototypal inheritance) 的原理。

JavaScript沒有“子類”和“父類”的概念,也沒有“類”(class)和“實(shí)例”(instance)的區(qū)分,全靠“原型鏈”(prototype chain)模式,來實(shí)現(xiàn)繼承。

每個(gè)函數(shù)Sub都有一個(gè)屬性prototype,prototype指向一個(gè)原型對(duì)象,原型對(duì)象中也有一個(gè)指向函數(shù)的屬性constructor,通過new一個(gè)函數(shù)Sub可以產(chǎn)生實(shí)例instance,調(diào)用這個(gè)instance的某個(gè)屬性或方法時(shí),instance會(huì)先查找自身是否有這個(gè)方法或者屬性,沒有的話就會(huì)去實(shí)例的構(gòu)造函數(shù)Sub的原型prototype中查找,即Sub.prototype,如果給原型對(duì)象Sub.prototype賦予另一個(gè)類型的實(shí)例superInstance,則是在superInstance中查找的,這個(gè)superInstance中也有屬性prototype指向某個(gè)原型對(duì)象,以此一級(jí)級(jí)往上最終到Object.prototype,這樣就形成了原型繼承。

利用此原理可以自己實(shí)現(xiàn)一個(gè)inherits函數(shù):

function inherits(subType, superType){
    var _prototype = Object.create(superType.prototype);
    _prototype.constructor = subType;
    subType.prototype = _prototype;
}

三、解釋為什么接下來這段代碼不是 IIFE (立即調(diào)用的函數(shù)表達(dá)式):function foo(){ }(); 要做哪些改動(dòng)使它變成 IIFE?

(function fn(){..})(),函數(shù)被包含在一個(gè)括號(hào)內(nèi),變成為一個(gè)表達(dá)式,隨后跟著一個(gè)(),就立即執(zhí)行這個(gè)函數(shù)。

IIFE的一些作用:

  1. 創(chuàng)建作用域,內(nèi)部保存一些大量臨時(shí)變量的代碼防止命名沖突。

  2. 一些庫(kù)的外層用這種形式包起來防止作用域污染。

  3. 運(yùn)行一些只執(zhí)行一次的代碼。

四、(function fn(){..})(),函數(shù)被包含在一個(gè)括號(hào)內(nèi),變成為一個(gè)表達(dá)式,隨后跟著一個(gè)(),就立即執(zhí)行這個(gè)函數(shù)。

IIFE的一些作用:

  1. 創(chuàng)建作用域,內(nèi)部保存一些大量臨時(shí)變量的代碼防止命名沖突。

  2. 一些庫(kù)的外層用這種形式包起來防止作用域污染。

  3. 運(yùn)行一些只執(zhí)行一次的代碼。

當(dāng)某個(gè)函數(shù)調(diào)用時(shí)會(huì)創(chuàng)建一個(gè)執(zhí)行環(huán)境以及作用域鏈,然后根據(jù)arguments和其它命名參數(shù)初始化形成活動(dòng)對(duì)象。在外部函數(shù)調(diào)用結(jié)束后,其執(zhí)行環(huán)境與作用域鏈被銷毀,但是其活動(dòng)對(duì)象保存在了閉包之中,最后在閉包函數(shù)調(diào)用結(jié)束后才銷毀。簡(jiǎn)單的說,閉包就是能夠讀取其他函數(shù)內(nèi)部變量的函數(shù)。在js中,閉包是指有權(quán)訪問另一個(gè)函數(shù)作用域中的變量的函數(shù)。

如何使用:將A函數(shù)內(nèi)部的B函數(shù)作為A函數(shù)的返回值返回。

為什么要:

1、匿名自執(zhí)行函數(shù)

有的場(chǎng)景下函數(shù)只需要執(zhí)行一次,例如init()之類的函數(shù),其內(nèi)部變量無需維護(hù),我們可以使用閉包。 我們創(chuàng)建了一個(gè)匿名的函數(shù),并立即執(zhí)行它,由于外部無法引用它內(nèi)部的變量,因此在函數(shù)執(zhí)行完后會(huì)立刻釋放資源,而且不污染全局對(duì)象。

2、封裝

模擬面向?qū)ο蟮拇a風(fēng)格進(jìn)行封裝,使私有屬性存在成為可能。

五、.call 和 .apply 的區(qū)別是什么?

.call和.apply的共同點(diǎn)是都是用來改變函數(shù)體內(nèi)this對(duì)象的值。

區(qū)別是第二個(gè)參數(shù)不一樣。apply()的第二個(gè)參數(shù)是一個(gè)類數(shù)組對(duì)象arguments,參數(shù)都是以數(shù)組的形式傳入,而call(),傳遞給他的是一系列參數(shù)。例如

Math.max.call(null, 1, 2, 3, 4);
//4

Math.max.apply(null, [1, 2, 3, 4]);
//4

六、請(qǐng)解釋 Function.prototype.bind?

Function.prototype.bind方法會(huì)創(chuàng)建一個(gè)新函數(shù),當(dāng)這個(gè)新函數(shù)被調(diào)用時(shí),它的this值是傳遞給bind()的第一個(gè)參數(shù), 它的參數(shù)是bind()的其他參數(shù)和其原本的參數(shù).

七、請(qǐng)指出 JavaScript 宿主對(duì)象 (host objects) 和原生對(duì)象 (native objects) 的區(qū)別?

宿主對(duì)象是指DOM和BOM。
原生對(duì)象是Object、Function、Array、String、Boolean、Number、Date、RegExp、Error、Math等對(duì)象。

八、請(qǐng)指出以下代碼的區(qū)別:function Person(){}、var person = Person()、var person = new Person()?

function Person(){}

聲明一個(gè)函數(shù)Person()。

var person = Person()

將函數(shù)Person()的結(jié)果返回給變量person,如果沒有返回值則person為undefined。

var person = new Person()

new一個(gè)Person的實(shí)例對(duì)象。

九、請(qǐng)盡可能詳盡的解釋 Ajax 的工作原理。以及使用 Ajax 都有哪些優(yōu)劣?

Ajax是無需刷新頁面就能從服務(wù)器取得數(shù)據(jù)的一種方法。

Ajax通過XmlHttpRequest對(duì)象來向服務(wù)器發(fā)異步請(qǐng)求,從服務(wù)器獲得數(shù)據(jù),然后用javascript來操作DOM更新頁面。

過程

  1. 創(chuàng)建XMLHttpRequest對(duì)象。

  2. 設(shè)置響應(yīng)HTTP請(qǐng)求的回調(diào)函數(shù)。

  3. 創(chuàng)建一個(gè)HTTP請(qǐng)求,指定相應(yīng)的請(qǐng)求方法、url等。

  4. 發(fā)送HTTP請(qǐng)求。

  5. 獲取服務(wù)器端返回的數(shù)據(jù)。

  6. 使用JavaScript操作DOM更新頁面。

缺點(diǎn)

  1. 對(duì)搜索引擎不友好

  2. 要實(shí)現(xiàn)Ajax下的前后退功能成本較大

  3. 跨域問題限制

十、請(qǐng)解釋變量聲明提升 (hoisting)。

變量的聲明前置就是把變量的聲明提升到當(dāng)前作用域的最前面。
函數(shù)的聲明前置就是把整個(gè)函數(shù)提升到當(dāng)前作用域的最前面(位于前置的變量聲明后面)。

//變量的聲明前置
console.log(num);//undefined
var num = 1;

等價(jià)于

//變量的聲明前置
var num;
console.log(num);//undefined
num = 1;

十一、請(qǐng)描述事件冒泡機(jī)制 (event bubbling)。

事件冒泡(event bubbling),事件最開始時(shí)由觸發(fā)的那個(gè)元素身上發(fā)生,然后沿著DOM樹向上傳播,直到document對(duì)象。如果想阻止事件起泡,可以使用e.stopPropagation()。

十二、什么是 “use strict”; ? 使用它的好處和壞處分別是什么?

優(yōu)點(diǎn)

消除Javascript語法的一些不嚴(yán)謹(jǐn)之處,減少一些怪異行為;
消除代碼運(yùn)行的一些不安全之處,保證代碼運(yùn)行的安全;
提高編譯器效率,增加運(yùn)行速度;
為未來新版本的Javascript做好鋪墊。

缺點(diǎn)

嚴(yán)格模式改變了語義。依賴這些改變可能會(huì)導(dǎo)致沒有實(shí)現(xiàn)嚴(yán)格模式的瀏覽器中出現(xiàn)問題或者錯(cuò)誤。

十三、請(qǐng)解釋 JavaScript 的同源策略 (same-origin policy)。

同源策略限制了一個(gè)源(origin)中加載文本或腳本與來自其它源(origin)中資源的交互方式。同源指的是協(xié)議、域名、端口相同,同源策略是一種安全協(xié)議。

十四、請(qǐng)解釋 JSONP 的工作原理,以及它為什么不是真正的 Ajax。

JSONP(JSON with Padding)是一種非官方跨域數(shù)據(jù)交互協(xié)議,它允許在服務(wù)器端集成< script >標(biāo)簽返回至客戶端,通過javascript回調(diào)的形式實(shí)現(xiàn)跨域訪問。

因?yàn)橥床呗缘脑?,我們不能使用XMLHttpRequest與外部服務(wù)器進(jìn)行通信,但是< script >可以訪問外部資源,所以通過JSON與< script >相結(jié)合的辦法,可以繞過同源策略從外部服務(wù)器直接取得可執(zhí)行的JavaScript函數(shù)。

原理

客戶端定義一個(gè)函數(shù),比如jsonpCallback,然后創(chuàng)建< script >,src為url + ?jsonp=jsonpCallback這樣的形式,之后服務(wù)器會(huì)生成一個(gè)和傳遞過來jsonpCallback一樣名字的參數(shù),并把需要傳遞的數(shù)據(jù)當(dāng)做參數(shù)傳入,比如jsonpCallback(json),然后返回給客戶端,此時(shí)客戶端就執(zhí)行了這個(gè)服務(wù)器端返回的jsonpCallback(json)回調(diào)。

通俗的說,就是客戶端定義一個(gè)函數(shù)然后請(qǐng)求,服務(wù)器端返回的javascript內(nèi)容就是調(diào)用這個(gè)函數(shù),需要的數(shù)據(jù)都當(dāng)做參數(shù)傳入這個(gè)函數(shù)了。

優(yōu)點(diǎn) - 兼容性好,簡(jiǎn)單易用,支持瀏覽器與服務(wù)器雙向通信
缺點(diǎn) - 只支持GET請(qǐng)求;存在腳本注入以及跨站請(qǐng)求偽造等安全問題

補(bǔ)充一點(diǎn),JSONP不使用XMLHttpRequest對(duì)象加載資源,不屬于真正意義上的AJAX。

十五、== 和 === 有什么不同?

通俗的說就是===比==要更為嚴(yán)格,===比較過程中沒有任何的類型轉(zhuǎn)換。

十六、什么是三元表達(dá)式 (Ternary expression)?“三元 (Ternary)” 表示什么意思?

如名字表示的三元運(yùn)算符需要三個(gè)操作數(shù)。
語法是
條件 ? 結(jié)果1 : 結(jié)果2;
這里你把條件寫在問號(hào)(?)的前面后面跟著用冒號(hào)(:)分隔的結(jié)果1和結(jié)果2。滿足條件時(shí)結(jié)果1否則結(jié)果2。

十七、你怎么看 AMD vs. CommonJS?

瀏覽器端異步和服務(wù)器端同步的模塊化編程規(guī)范

十八、請(qǐng)舉出一個(gè)匿名函數(shù)的典型用例?

定義回調(diào)函數(shù),立即執(zhí)行函數(shù),作為返回值的函數(shù),使用方法var foo = function() {}定義的函數(shù)。

十九、描述以下變量的區(qū)別:null,undefined 或 undeclared?該如何檢測(cè)它們?

未定義的屬性、定義未賦值的為undefined,JavaScript訪問不會(huì)報(bào)錯(cuò);null是一種特殊的object;NaN是一種特殊的number;undeclared 是未聲明也未賦值的變量,JavaScript訪問會(huì)報(bào)錯(cuò)。

二十、在什么時(shí)候你會(huì)使用 document.write()?

DOM方法,可向文檔寫入 HTML 表達(dá)式或 JavaScript 代碼。

二十一、如何實(shí)現(xiàn)下列代碼:[1,2,3,4,5].duplicator(); // [1,2,3,4,5,1,2,3,4,5]

Array.prototype.duplicator = function(){
  var l = this.length,i;
  for(i=0;i<l;i++){
   this.push(this[i]) 
   }
}

二十二、解釋 function foo() {} 與 var foo = function() {} 用法的區(qū)別

函數(shù)聲明的兩種方法:

  1. var foo = function () {}

這種方式是聲明了個(gè)變量,而這個(gè)變量是個(gè)方法,變量在js中是可以改變的。
也:將一個(gè)匿名函數(shù)賦值給了變量。

  1. function foo() {}

這種方式是聲明了個(gè)方法,foo這個(gè)名字無法改變

二十三、請(qǐng)解釋可變 (mutable) 和不變 (immutable) 對(duì)象的區(qū)別。

在 JavaScript 中,對(duì)象是引用類型的數(shù)據(jù),其優(yōu)點(diǎn)在于頻繁的修改對(duì)象時(shí)都是在原對(duì)象的基礎(chǔ)上修改,并不需要重新創(chuàng)建,這樣可以有效的利用內(nèi)存,不會(huì)造成內(nèi)存空間的浪費(fèi),對(duì)象的這種特性可以稱之為 Mutable,中文的字面意思是「可變」。

Immutable 從字面上翻譯成中文是「不可變」。每次修改一個(gè) Immutable 對(duì)象時(shí)都會(huì)創(chuàng)建一個(gè)新的不可變的對(duì)象,在新對(duì)象上操作并不會(huì)影響到原對(duì)象的數(shù)據(jù)。

二十四、使用 Promises 而非回調(diào) (callbacks) 優(yōu)缺點(diǎn)是什么?

Promise是異步編程的一種解決方案,比傳統(tǒng)的解決方案——回調(diào)函數(shù)和事件——更合理和更強(qiáng)大。它由社區(qū)最早提出和實(shí)現(xiàn),ES6將其寫進(jìn)了語言標(biāo)準(zhǔn),統(tǒng)一了用法,原生提供了Promise對(duì)象。

所謂Promise,簡(jiǎn)單說就是一個(gè)容器,里面保存著某個(gè)未來才會(huì)結(jié)束的事件(通常是一個(gè)異步操作)的結(jié)果。從語法上說,Promise是一個(gè)對(duì)象,從它可以獲取異步操作的消息。Promise提供統(tǒng)一的API,各種異步操作都可以用同樣的方法進(jìn)行處理。

有了Promise對(duì)象,就可以將異步操作以同步操作的流程表達(dá)出來,避免了層層嵌套的回調(diào)函數(shù)。此外,Promise對(duì)象提供統(tǒng)一的接口,使得控制異步操作更加容易。

Promise也有一些缺點(diǎn)。

首先,無法取消Promise,一旦新建它就會(huì)立即執(zhí)行,無法中途取消。
其次,如果不設(shè)置回調(diào)函數(shù),Promise內(nèi)部拋出的錯(cuò)誤,不會(huì)反應(yīng)到外部。
第三,當(dāng)處于Pending狀態(tài)時(shí),無法得知目前進(jìn)展到哪一個(gè)階段(剛剛開始還是即將完成)。

二十五、請(qǐng)解釋同步 (synchronous) 和異步 (asynchronous) 函數(shù)的區(qū)別。

同步調(diào)用,在發(fā)起一個(gè)函數(shù)或方法調(diào)用時(shí),沒有得到結(jié)果之前,該調(diào)用就不返回,直到返回結(jié)果;

異步調(diào)用的概念和同步相對(duì),在一個(gè)異步調(diào)用發(fā)起后,被調(diào)用者立即返回給調(diào)用者,但調(diào)用者不能立刻得到結(jié)果,被調(diào)用者在實(shí)際處理這個(gè)調(diào)用的請(qǐng)求完成后,通過狀態(tài)、通知或回調(diào)等方式來通知調(diào)用者請(qǐng)求處理的結(jié)果。

簡(jiǎn)單地說,同步就是發(fā)出一個(gè)請(qǐng)求后什么事都不做,一直等待請(qǐng)求返回后才會(huì)繼續(xù)做事;異步就是發(fā)出請(qǐng)求后繼續(xù)去做其他事,這個(gè)請(qǐng)求處理完成后會(huì)通知你,這時(shí)候就可以處理這個(gè)回應(yīng)了。

二十六、你使用哪些工具和技術(shù)來調(diào)試 JavaScript 代碼?

1.javascript的debugger語句
需要調(diào)試js的時(shí)候,我們可以給需要調(diào)試的地方通過debugger打斷點(diǎn),代碼執(zhí)行到斷點(diǎn)就會(huì)暫定,這時(shí)候通過單步調(diào)試等方式就可以調(diào)試js代碼

if (waldo) {
    debugger;
}

這時(shí)候打開console面板,就可以調(diào)試了

2.DOM斷點(diǎn)
DOM斷點(diǎn)是一個(gè)Firebug和chrome DevTools提供的功能,當(dāng)js需要操作打了斷點(diǎn)的DOM時(shí),會(huì)自動(dòng)暫停,類似debugger調(diào)試。
使用DOM斷點(diǎn)步驟:
選擇你要打斷點(diǎn)的DOM節(jié)點(diǎn)
右鍵選擇Break on..
選擇斷點(diǎn)類型

另外的調(diào)試方法例如alert, console.log,查看元素等就不再贅述了。

二十七、你會(huì)使用怎樣的語言結(jié)構(gòu)來遍歷對(duì)象屬性 (object properties) 和數(shù)組內(nèi)容?

for in 語句
一般for循環(huán)
數(shù)組forEach方法

以上是“JavaScrip的常見面試題有哪些”這篇文章的所有內(nèi)容,感謝各位的閱讀!相信大家都有了一定的了解,希望分享的內(nèi)容對(duì)大家有所幫助,如果還想學(xué)習(xí)更多知識(shí),歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道!

另外有需要云服務(wù)器可以了解下創(chuàng)新互聯(lián)scvps.cn,海內(nèi)外云服務(wù)器15元起步,三天無理由+7*72小時(shí)售后在線,公司持有idc許可證,提供“云服務(wù)器、裸金屬服務(wù)器、高防服務(wù)器、香港服務(wù)器、美國(guó)服務(wù)器、虛擬主機(jī)、免備案服務(wù)器”等云主機(jī)租用服務(wù)以及企業(yè)上云的綜合解決方案,具有“安全穩(wěn)定、簡(jiǎn)單易用、服務(wù)可用性高、性價(jià)比高”等特點(diǎn)與優(yōu)勢(shì),專為企業(yè)上云打造定制,能夠滿足用戶豐富、多元化的應(yīng)用場(chǎng)景需求。

網(wǎng)站標(biāo)題:JavaScrip的常見面試題有哪些-創(chuàng)新互聯(lián)
文章分享:http://muchs.cn/article8/csjgop.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供外貿(mào)建站、定制開發(fā)微信公眾號(hào)、品牌網(wǎng)站設(shè)計(jì)、網(wǎng)站建設(shè)、企業(yè)網(wǎng)站制作

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來源: 創(chuàng)新互聯(lián)

商城網(wǎng)站建設(shè)