js 理解new的執行機制

2022-07-14 14:45:16 字數 989 閱讀 6386

先上段**:

1

function

people(name)

45 people.prototype.sayname = function

() 8

9var man1 = new people('xiaos');

10console.log(man1.name)

11 man1.sayname();

接下來我們分析下上述**:

1. 1-3行我們建立了乙個people的函式,應為將來要用作建構函式來例項化物件,所以首字母大寫(這是好的習慣,也是一種預設的都會遵守的規定吧)

2. 5-7在people的原型物件上新增了sayname方法,什麼是原型物件呢?會有另外一篇文章來單獨介紹,後續補充~~

3. 第9行,使用new運算子例項化了乙個man1物件。這是我們這篇要研究的問題,下面會詳細闡述~

4. 第10行列印輸出man1的name,第11行呼叫man1的sayname方法

那麼問題來了,分析4中為什麼能取到name屬性和sayname方法呢??其實,這關鍵在於第3步,new的作用。

那麼new究竟做了什麼呢?大致分三步,我們用**分析下過程吧:

1

var obj ={}; // 首先建立乙個空的物件

23 obj.__proto__ =people.prototype; // 將空物件的__proto__指向建構函式的原型物件,也就是這句導致上面例項化的物件man1擁有了sayname方法,其實這裡是繼承了原型物件上的sayname方法

4 people.call(obj, 'xiaos'); // 呼叫people的構造方法,也就是這句導致man1擁有了name屬性,有關call用法,本篇暫不介紹了,後續補充;這裡簡單理解就是people中的this變成了obj56

return obj; // 返回物件,此刻man1來接收,所以就同時擁有了people的建構函式中的屬性還有原型上的方法

JS執行機制

js是單執行緒的,settimeout和setinterval是非同步任務,要掛起,不先執行,等同步任務完成之後,再去處理非同步任務 console.log 1 settimeout function 0 console.log 3 console.log 4 輸出 1 3 4 2console.l...

JS執行機制

輸出結果為 1,2,3 js是從上到下執行的 js是單執行緒的,即在同一時間只能做一件事情 遇到同步程式,直接執行 遇到非同步程式,先掛起,等同步程式執行完畢後再執行 同步佇列 優先順序最高 非同步佇列 遇到非同步佇列先掛起,等同步佇列執行完後,再選擇執行非同步佇列的某個 settimeout中的時...

JS執行機制

js單執行緒 在同一時間js只能做一件事。為什麼是單執行緒?如果多執行緒,同時操作乙個dom會出問題。非阻塞 event loop 事件迴圈 任務佇列 同步任務佇列要優先於非同步任務佇列處理。非同步任務被分為巨集任務和微任務。常見的非同步任務分類如下 巨集任務 定時器系列,dom事件 ui互動事件 ...