一、請解釋 JavaScript 中 this 是如何工作的。

首先：this 永遠指向函數運行時所在的對象，而不是函數被創建時所在的對象。匿名函數或不處于任何對象中的函數指向 window 。

1、 方法調用模式

當函數被保存為對象的一個屬性時，成該函數為該對象的方法。函數中this的值為該對象。

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

2、 函數調用模式

當函數并不是對象的屬性。函數中this的值為全局對象

note：某個方法中的內部函數中的this的值也是全局對象，而非外部函數的this

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

3、構造器調用模式

即使用new調用的函數，則其中this將會被綁定到那個新構造的對象。

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

4、使用apply或call調用模式

該模式調用時，函數中this被綁定到apply或call方法調用時接受的第一個參數

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

改變this的值主要方法(目前想到的，歡迎評論添加)：

apply或call方法調用時強制修改，使this指向第一個參數。

使用Function.bind方法創造新的函數，該新函數的中this指向所提供的第一個參數。

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

JavaScript沒有“子類”和“父類”的概念，也沒有“類”(class)和“實例”(instance)的區分，全靠“原型鏈”(prototype chain)模式，來實現繼承。

每個函數Sub都有一個屬性prototype，prototype指向一個原型對象，原型對象中也有一個指向函數的屬性constructor，通過new一個函數Sub可以產生實例instance，調用這個instance的某個屬性或方法時，instance會先查找自身是否有這個方法或者屬性，沒有的話就會去實例的構造函數Sub的原型prototype中查找，即Sub.prototype，如果給原型對象Sub.prototype賦予另一個類型的實例superInstance，則是在superInstance中查找的，這個superInstance中也有屬性prototype指向某個原型對象，以此一級級往上最終到Object.prototype，這樣就形成了原型繼承。

利用此原理可以自己實現一個inherits函數：

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

三、請描述事件冒泡機制 (event bubbling)。

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

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

優點

消除Javascript語法的一些不嚴謹之處，減少一些怪異行為;

消除代碼運行的一些不安全之處，保證代碼運行的安全;

提高編譯器效率，增加運行速度;

為未來新版本的Javascript做好鋪墊。

缺點

嚴格模式改變了語義。依賴這些改變可能會導致沒有實現嚴格模式的瀏覽器中出現問題或者錯誤。

五、請解釋 JavaScript 的同源策略 (same-origin policy)。

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

六、請解釋 JSONP 的工作原理，以及它為什么不是真正的 Ajax。

JSONP(JSON with Padding)是一種非官方跨域數據交互協議，它允許在服務器端集成< script >標簽返回至客戶端，通過javascript回調的形式實現跨域訪問。

因為同源策略的原因，我們不能使用XMLHttpRequest與外部服務器進行通信，但是< script >可以訪問外部資源，所以通過JSON與< script >相結合的辦法，可以繞過同源策略從外部服務器直接取得可執行的JavaScript函數。

原理

客戶端定義一個函數，比如jsonpCallback，然后創建< script >，src為url + ?jsonp=jsonpCallback這樣的形式，之后服務器會生成一個和傳遞過來jsonpCallback一樣名字的參數，并把需要傳遞的數據當做參數傳入，比如jsonpCallback(json)，然后返回給客戶端，此時客戶端就執行了這個服務器端返回的jsonpCallback(json)回調。

通俗的說，就是客戶端定義一個函數然后請求，服務器端返回的javascript內容就是調用這個函數，需要的數據都當做參數傳入這個函數了。

優點 - 兼容性好，簡單易用，支持瀏覽器與服務器雙向通信

缺點 - 只支持GET請求;存在腳本注入以及跨站請求偽造等安全問題

補充一點，JSONP不使用XMLHttpRequest對象加載資源，不屬于真正意義上的AJAX。

以上就是“2023年常見的Js基礎面試題，大家可進行參考”，你能回答上來嗎?如果想要了解更多的Java面試題相關內容，可以關注動力節點Java官網。