1.1 概述

在典型的 OOP 的語言中（如 Java），都存在類的概念，類就是對象的模板，對象就是類的實例，但在 ES6之前， JS 中并沒用引入類的概念。
ES6， 全稱 ECMAScript 6.0 ，2015.06 發版。但是目前瀏覽器的 JavaScript 是 ES5 版本，大多數高版本的瀏覽器也支持 ES6，不過只實現了 ES6 的部分特性和功能。
在 ES6之前 ，對象不是基于類創建的，而是用一種稱為構建函數的特殊函數來定義對象和它們的特征。

創建對象可以通過以下三種方式：

對象字面量

new Object()

自定義構造函數

// 1. 利用 new Object() 創建對象var obj1 = new Object();// 2. 利用 對象字面量創建對象var obj2 = {};// 3. 利用構造函數創建對象function Star(uname, age) {this.uname = uname;this.age = age;this.sing = function() {console.log('我會唱歌');}}var ldh = new Star('劉德華', 18);var zxy = new Star('張學友', 19);console.log(ldh);ldh.sing();zxy.sing();

1.2 構造函數

構造函數是一種特殊的函數，主要用來初始化對象，即為對象成員變量賦初始值，它總與 new 一起使用。我們可以把對象中一些公共的屬性和方法抽取出來，然后封裝到這個函數里面。

在 JS 中，使用構造函數時要注意以下兩點：

構造函數用于創建某一類對象，其首字母要大寫

構造函數要和 new 一起使用才有意義

new 在執行時會做四件事情：
1）在內存中創建一個新的空對象。
2）讓 this 指向這個新的對象。
3）執行構造函數里面的代碼，給這個新對象添加屬性和方法。
4）返回這個新對象（所以構造函數里面不需要 return ）。

JavaScript 的構造函數中可以添加一些成員，可以在構造函數本身上添加，也可以在構造函數內部的 this 上添加。通過這兩種方式添加的成員，就分別稱為靜態成員和實例成員。

靜態成員：在構造函數本上添加的成員稱為靜態成員，只能由構造函數本身來訪問
實例成員：在構造函數內部創建的對象成員稱為實例成員，只能由實例化的對象來訪問

靜態成員和實例成員：

// 構造函數中的屬性和方法我們稱為成員, 成員可以添加function Star(uname, age) {this.uname = uname;this.age = age;this.sing = function() {console.log('我會唱歌');}}var ldh = new Star('劉德華', 18);// 1.實例成員就是構造函數內部通過this添加的成員 uname age sing 就是實例成員// 實例成員只能通過實例化的對象來訪問console.log(ldh.uname);ldh.sing();// console.log(Star.uname); // 不可以通過構造函數來訪問實例成員// 2. 靜態成員 在構造函數本身上添加的成員 sex 就是靜態成員Star.sex = '男';// 靜態成員只能通過構造函數來訪問console.log(Star.sex);console.log(ldh.sex); // 不能通過對象來訪問

1.3 構造函數的問題

構造函數方法很好用，但是存在浪費內存的問題。

1.4 構造函數原型 prototype

構造函數通過原型分配的函數是所有對象所共享的。
JavaScript 規定，每一個構造函數都有一個 prototype 屬性，指向另一個對象。注意這個 prototype 就是一個對象，這個對象的所有屬性和方法，都會被構造函數所擁有。

我們可以把那些不變的方法，直接定義在 prototype 對象上，這樣所有對象的實例就可以共享這些方法。

問答？

原型是什么 ？
一個對象，我們也稱為 prototype 為原型對象。

原型的作用是什么 ？
共享方法。

1.5 對象原型 __proto__

對象都會有一個屬性 __proto__ 指向構造函數的 prototype 原型對象，之所以我們對象可以使用構造函數 prototype 原型對象的屬性和方法，就是因為對象有 __proto__ 原型的存在。
__proto__對象原型和原型對象 prototype 是等價的
__proto__對象原型的意義就在于為對象的查找機制提供一個方向，或者說一條路線，但是它是一個非標準屬性，因此實際開發中，不可以使用這個屬性，它只是內部指向原型對象 prototype

1.6 constructor 構造函數

對象原型（ __proto__）和構造函數（prototype）原型對象里面都有一個屬性 constructor 屬性 ，constructor 我們稱為構造函數，因為它指回構造函數本身。
constructor 主要用于記錄該對象引用于哪個構造函數，它可以讓原型對象重新指向原來的構造函數。
一般情況下，對象的方法都在構造函數的原型對象中設置。如果有多個對象的方法，我們可以給原型對象采取對象形式賦值，但是這樣就會覆蓋構造函數原型對象原來的內容，這樣修改后的原型對象 constructor 就不再指向當前構造函數了。此時，我們可以在修改后的原型對象中，添加一個 constructor 指向原來的構造函數。

1.7 構造函數、實例、原型對象三者之間的關系

1.8 原型鏈

1.9 JavaScript 的成員查找機制(規則)

當訪問一個對象的屬性（包括方法）時，首先查找這個對象自身有沒有該屬性。

如果沒有就查找它的原型（也就是 __proto__指向的 prototype 原型對象）。

如果還沒有就查找原型對象的原型（Object的原型對象）。

依此類推一直找到 Object 為止（null）。

__proto__對象原型的意義就在于為對象成員查找機制提供一個方向，或者說一條路線。

1.10 原型對象this指向

構造函數中的this 指向我們實例對象.
原型對象里面放的是方法, 這個方法里面的this 指向的是 這個方法的調用者, 也就是這個實例對象.

1.11 擴展內置對象

可以通過原型對象，對原來的內置對象進行擴展自定義的方法。比如給數組增加自定義求偶數和的功能。

注意：數組和字符串內置對象不能給原型對象覆蓋操作 Array.prototype = {} ，只能是 Array.prototype.xxx = function(){} 的方式。

總結

以上是生活随笔為你收集整理的JavaScript高级之构造函数和原型的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。