es5如何實現promise 完美起航

2021-10-18 18:52:23 字數 4738 閱讀 9998

61.new的原理是什麼?通過new的方式建立物件和通過字面量建立有什麼區別?

new:

建立乙個新物件。

這個新物件會被執行[[原型]]連線。

將建構函式的作用域賦值給新物件,即this指向這個新物件.

如果函式沒有返回其他物件,那麼new表示式中的函式呼叫會自動返回這個新物件。

function new(func) ;

target.__proto__ = func.prototype;

let res = func.call(target);

if (typeof(res) == "object" || typeof(res) == "function") else , (err) => , (err) => );

(2)、live 【jquery 1.3之後】

定義和用法:主要用於給選擇到的元素上繫結特定事件型別的監聽函式;

語法:live(type, [data], fn);

特點:(1)、live方法並沒有將***繫結到自己(this)身上,而是繫結到了this.context上了。

(2)、live正是利用了事件委託機制來完成事件的監聽處理,把節點的處理委託給了document,新新增的元素不必再繫結一次***。

(3)、使用live()方法但卻只能放在直接選擇的元素後面,不能在層級比較深,連綴的dom遍歷方法後面使用,即(ul

live

可以但(「ul」").live...可以,但(「ul」").live...可以,但(「body」).find(「ul」).live…不行;

例項如下:$( document ).on( 「click」, 「#members li a」, function( e ) {} );

(3)、delegate 【jquery 1.4.2中引入】

定義和用法:將監聽事件繫結在就近的父級元素上

語法:delegate(selector,type,[data],fn)

特點:(1)、選擇就近的父級元素,因為事件可以更快的冒泡上去,能夠在第一時間進行處理。

(2)、更精確的小範圍使用事件**,效能優於.live()。可以用在動態新增的元素上。

例項如下:

$("#info_table").delegate(「td」,「click」,function());

$(「table」).find("#info").delegate(「td」,「click」,function());

(4)、on 【1.7版本整合了之前的三種方式的新事件繫結機制】

定義和用法:將監聽事件繫結到指定元素上。

語法:on(type,[selector],[data],fn)

總結 :.bind(), .live(), .delegate(),.on()分別對應的相反事件為:.unbind(),.die(), .undelegate(),.off()

80.瀏覽器是如何渲染頁面的?

渲染的流程如下:

1.解析html檔案,建立dom樹。

自上而下,遇到任何樣式(link、style)與指令碼(script)都會阻塞(外部樣式不阻塞後續外部指令碼的載入)。

2.解析css。優先順序:瀏覽器預設設定

3.將css與dom合併,構建渲染樹(render tree)

4.布局和繪製,重繪(repaint)和重排(reflow)

81.$(document).ready()方法和window.onload有什麼區別?

(1)、window.onload方法是在網頁中所有的元素(包括元素的所有關聯檔案)完全載入到瀏覽器後才執行的。

(2)、$(document).ready() 方法可以在dom載入就緒時就對其進行操縱,並呼叫執行繫結的函式。

82. jquery中.ge

t提交和

.get()提交和.get()提交和.post()提交有區別嗎?

相同點:都是非同步請求的方式來獲取服務端的資料;

異同點:

1、請求方式不同:.ge

t方法使

用get

方法來進

行非同步請

求的.get() 方法使用get方法來進行非同步請求的。.get()方法使用get方法來進行非同步請求的。.post() 方法使用post方法來進行非同步請求的。

2、引數傳遞方式不同:get請求會將引數跟在url後進行傳遞,而post請求則是作為http訊息的實體內容傳送給web伺服器的,這種傳遞是對使用者不可見的。

3、資料傳輸大小不同:get方式傳輸的資料大小不能超過2kb 而post要大的多

4、安全問題: get 方式請求的資料會被瀏覽器快取起來,因此有安全問題。

83.對前端路由的理解?前後端路由的區別?

前端的路由和後端的路由在實現技術上不一樣,但是原理都是一樣的。在 html5 的 history api 出現之前,前端的路由都是通過 hash 來實現的,hash 能相容低版本的瀏覽器。

#/about

#/concat

服務端路由:每跳轉到不同的url,都是重新訪問服務端,然後服務端返回頁面,頁面也可以是服務端獲取資料,然後和模板組合,返回html,也可以是直接返回模板html,然後由前端js再去請求資料,使用前端模板和資料進行組合,生成想要的html。

前端路由:每跳轉到不同的url都是使用前端的錨點路由,實際上只是js根據url來操作dom元素,根據每個頁面需要的去服務端請求資料,返回資料後和模板進行組合,當然模板有可能是請求服務端返回的,這就是 spa 單頁程式。

在js可以通過window.location.hash讀取到路徑加以解析之後就可以響應不同路徑的邏輯處理。

history 是 html5 才有的新 api,可以用來操作瀏覽器的 session history (會話歷史)。基於 history 來實現的路由可以和最初的例子中提到的路徑規則一樣。

h5還新增了乙個hashchange事件,也是很有用途的乙個新事件:

但是hashchange這個事件不是每個瀏覽器都有,低階瀏覽器需要用輪詢檢測url是否在變化,來檢測錨點的變化。當錨點內容(location.hash)被操作時,如果錨點內容發生改變瀏覽器才會將其放入歷史棧中,如果錨點內容沒發生變化,歷史棧並不會增加,並且也不會觸發hashchange事件。

84.手寫乙個類的繼承

繼承的形式有很多中,js高程裡面歸納了其中,我簡單說一下前三種。

1.原型繼承

function parent(),1000)

//輸出結果為(五個5)

原因是:

settimeout是非同步執行,1s後往任務佇列裡面新增乙個任務,

只有主線上的全部執行完,才會執行任務佇列裡的任務,

當主線執行完成後,i是5,所以此時再去執行任務佇列裡的任務時,i全部是5了。

改進for(let i=0;i<5;i++),1000)

//輸出 0,1,2,3,4

解析:for迴圈頭部的let不僅將i繫結到for迴圈塊中,

它也將其重新繫結到 **迴圈體的每一次迭代** 中,確保上一次迭代結束的值重新被賦值。

settimeout裡面的function()屬於乙個新的域,

通過 var 定義的變數是無法傳入到這個函式執行域中的,

而通過使用 let 來宣告塊變數,這時候變數就能作用於這個塊,

所以 function就能使用 i 這個變數了;

2.請寫出列印結果,並解釋為什麼?

請寫出**執行結果,並解釋為什麼?

let length = 10;

function fn(){

console.log(this.length);

var obj = {

length:5,

method:function(){

return fn;

obj.method()();

//輸出結果:0

解析:「this永遠指向呼叫他的物件」,在執行obj.method()方法時,如果函式內部有this,則this確實是指向obj,但是method()內部執行的是fn()函式,而fn()函式繫結的物件是window,即window.fn()

所以this指的事window

但是為什麼沒有顯示10而是顯示的0是因為

let宣告變數會形成塊級作用域,且不存在宣告提公升,而var存在宣告提公升。所以當使用let宣告變數時,不存在宣告提公升,length屬性實際上並沒有新增到window物件中。

3.請寫出列印結果,並解釋為什麼?

請寫出**執行結果,並解釋為什麼?

var name = "clobal";

var object = {

name:'local',

fn:function(){

return this.name;

getname:function(){

alert("1." + this.name);

return function(){

return this.name;

getfn:function(){

return this.fn;

var fun = object.getname();

alert("2."+fun());

alert("4."+fun.call(object));

var fn = object.getfn();

alert("5."+fn())

輸出結果

1.local 2.clocal 3.local 4.local 5.clocal

解析this物件是在執行時基於函式的執行環境繫結的,

匿名函式的執行環境具有全域性性,

因此匿名函式的this指向window

ES5如何實現繼承

原型鏈繼承的原理很簡單,直接讓子類的原型物件指向父類例項,當子類例項找不到對應的屬性和方法時,就會往它的原型物件,也就是父類例項上找,從而實現對父類的屬性和方法的繼承 function prant prant.prototype.getname function function child 子類 ...

es5實現繼承

繼承es5 這是乙個動物類 param age 年齡 param 性別 param name 名字 introduction 方法 function animal age,name 這是乙個貓類 param ingredients 食物 param age 年齡 當然你也可以在 這個類裡去呼叫ani...

ES5實現繼承

es5實現繼承 在面試過程中,常常會遇到一些es5,es6的問題,如果不能及時的想起來該如何讓面對,結果就可能是同學,你的面試就可能有點懸了,那麼,趕緊來一波乾貨吧 1,原型鏈繼承 原型鏈繼承的基本思想是利用原型讓乙個引用型別繼承另乙個引用型別的屬性和方法。function supertype su...