new操作符的基本過(guò)程：

1.創(chuàng)建一個(gè)新的空對(duì)象。

2.將構(gòu)造函數(shù)的作用域賦給它（即this指向它）。

3.新對(duì)象增加構(gòu)造函數(shù)的基本方法和屬性。

4.返回新對(duì)象

上面的過(guò)程大家應(yīng)該都熟悉，本文是重學(xué) JS 系列的第一篇文章，寫這個(gè)系列的初衷也是為了夯實(shí)自己的 JS 基礎(chǔ)。既然是重學(xué)，肯定不會(huì)從零開始介紹一個(gè)知識(shí)點(diǎn)，如有遇到不會(huì)的內(nèi)容請(qǐng)自行查找資料。

new 的作用

我們先來(lái)通過(guò)兩個(gè)例子來(lái)了解 new 的作用

function Test(name) { this.name = name}Test.prototype.sayName = function () { console.log(this.name)}const t = new Test('yck')console.log(t.name) // 'yck't.sayName() // 'yck'

從上面一個(gè)例子中我們可以得出這些結(jié)論：

但是當(dāng)下的構(gòu)造函數(shù) Test 并沒有顯式 return 任何值（默認(rèn)返回 undefined），如果我們讓它返回值會(huì)發(fā)生什么事情呢？

function Test(name) { this.name = name return 1}const t = new Test('yck')console.log(t.name) // 'yck'

雖然上述例子中的構(gòu)造函數(shù)中返回了 1，但是這個(gè)返回值并沒有任何的用處，得到的結(jié)果還是和之前的例子完全一樣。

那么通過(guò)這個(gè)例子，我們又可以得出一個(gè)結(jié)論：

試完了返回原始值，我們?cè)賮?lái)試試返回對(duì)象會(huì)發(fā)生什么事情吧

function Test(name) { this.name = name console.log(this) // Test { name: 'yck' } return { age: 26 }}const t = new Test('yck')console.log(t) // { age: 26 }console.log(t.name) // 'undefined'

通過(guò)這個(gè)例子我們可以發(fā)現(xiàn)，雖然構(gòu)造函數(shù)內(nèi)部的 this 還是依舊正常工作的，但是當(dāng)返回值為對(duì)象時(shí)，這個(gè)返回值就會(huì)被正常的返回出去。

那么通過(guò)這個(gè)例子，我們?cè)俅蔚贸隽艘粋€(gè)結(jié)論：

這兩個(gè)例子告訴了我們一點(diǎn)，構(gòu)造函數(shù)盡量不要返回值。因?yàn)榉祷卦贾挡粫?huì)生效，返回對(duì)象會(huì)導(dǎo)致 new 操作符沒有作用。

通過(guò)以上幾個(gè)例子，相信大家也大致了解了 new 操作符的作用了，接下來(lái)我們就來(lái)嘗試自己實(shí)現(xiàn) new 操作符。

自己實(shí)現(xiàn) new 操作符

首先我們?cè)賮?lái)回顧下 new 操作符的幾個(gè)作用