[TOC] >[success] # 函數new 和 不 new 差在哪里 ~~~ 1.'new'和不'new'區別到底是什么，其實兩者的區別就是'構造函數'和'函數'的區別 2.當通過 new 關鍵字創建函數實例時，會將實例的隱式原型指向構造函數的顯式原型 ~~~ >[danger] ##### 構造函數和函數的區別引用書中講解 ~~~ 1.構造函數與其他函數的唯一區別，就在于調用它們的方式不同。 不過，構造函數畢竟也是函數，不存在定義構造函數的特殊語法。 任何函數，只要通過 new 操作符來調用，那它就可以作為構造函數； 而任何函數，如果不通過 new 操作符來調用，那它跟普通函數也不會 有什么兩樣。 ~~~ >[info] ## 函數 和構造函數 ~~~ 1.下面的案例是書中的案例，根據上面書中的解釋其實可以理解首先 'Person'其實是函數，如果我們直接 ' Person("Greg", 27, "Doctor") ' 也是會正常執行，這時候他叫函數，如果'new Person("Greg", 27, "Doctor")' 在'new' 后面他叫'構造函數' 可以創建出來對象 2.要注意如果你已經決定要將這個函數作為一個構造函數使用，一般建議首字母要大寫 ~~~ * 創建對象調用 ~~~ function Person(name, age, job){ this.name = name; this.age = age; this.job = job; this.sayName = function(){ alert(this.name); }; } var person1 = new Person("Nicholas", 29, "Software Engineer"); var person2 = new Person("Greg", 27, "Doctor"); ~~~ * 當函數調用 [this指向](http://www.hmoore.net/cyyspring/html_js_cs/725361) ~~~ 1.當使用'new'的時候構造函數中的'this' 指向對象 2.當不使用'new'的時候函數中的'this' 指向的是window，因為 當在全局作用域中調用一個函數時，this 對象總是指向 Global 對象（在 瀏覽器中就是 window 對象）。因此，在調用完函數之后，可以通過 window 對象來調用 sayName()方法，并且還返回了"Greg" ~~~ ~~~ // 當作構造函數使用 var person = new Person("Nicholas", 29, "Software Engineer"); person.sayName(); //"Nicholas" // 作為普通函數調用 Person("Greg", 27, "Doctor"); // 添加到 window window.sayName(); //"Greg" // 在另一個對象的作用域中調用 var o = new Object(); Person.call(o, "Kristen", 25, "Nurse"); o.sayName(); //"Kristen" ~~~ * 這里引用mdn 里面的解釋 [內容來源](https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Inheritance_and_the_prototype_chain) ~~~ 1.你可能已經注意到我們的 function A 有一個叫做 prototype 的特殊屬性。該特殊屬可 與 JavaScript 的 new 操作符一起使用。對原型對象的引用被復制到新實例的內部 [[Prototype]] 屬性。例如，當執行 var a1 = new A(); 時，JavaScript（在內存中創建對 象之后，和在運行函數 A() 把 this 指向對象之前）設置 a1.[[Prototype]] = A.prototype;。 然后當您訪問實例的屬性時，JavaScript 首先會檢查它們是否直接存在于該對象上，如果不存在，則會 [[Prototype]] 中查找。這意味著你在 prototype 中定義的所有內容都可 以由所有實例有效地共享，你甚至可以稍后更改部分 prototype，并在所有現有實例中 顯示更改（如果有必要的話）。 注：[[Prototype]] 相當于__proto__ ~~~ >[danger] ##### 實例對象中的'constructor' ~~~ 1.當我們聲明一個方法時候，不加括號調用，那么方法會打印如下效果 ~~~ ~~~ function speak() { alert('wang') } // 打印結果： ? speak() { alert('wang') } ~~~ ~~~ 1.那么當我們打印一個構造函數，一個對象，對象中的構造函數效果 ~~~ ~~~ function Person(name, age, job) { this.name = name this.age = age this.sayName = function () { alert(this.name) } } Person.prototype.sayName = function () {} const p1 = new Person('wang','17') console.log(Person) // 打印構造函數(也就是類) console.log(p1.constructor) // 打印實例的constructor console.log(p1) // 打印實例 console.log(p1.constructor === Person) // 判斷實例的構造函數屬性(constructor) 和 類（js叫構造函數）的關系 // 打印結果： ? Person(name, age, job) { this.name = name this.age = age this.sayName = function () { alert(this.name) } } ? Person(name, age, job) { this.name = name this.age = age this.sayName = function () { alert(this.name) } } Person?{name: "wang", age: "17", sayName: ?} true ~~~ * 疑問 ~~~ 1.p1.constructor ，p1 明明沒有constructor 屬性，是如何點出來的。首先尋找順p1沒有。就去他的[[propotype]]找順著原型鏈 ~~~ * 總結 ~~~ 1.對象的構造函數屬性('constructor') 指向創建該類的構造函數(類) 2.通過一個對象的('constructor') 屬性可以反推該對象創建的類 ~~~