面試專用：js原型和原型鏈具體是指什麼

本人看了不少有關js原型和原型鏈的文章，可是感受老是介紹的不完整或者不夠清晰，因此特意根據本身所掌握的知識將這些內容梳理一下

一、首先我先來介紹一下什麼是對象及在不一樣語言中是怎麼定義的

對象：
好比說在典型的面向對象編程語言（好比 C++ 和 Java），都有「類」（class）這個概念。所謂「類」就是對象的模板，對象就是「類」的實例。可是，JavaScript 語言的對象體系，不是基於「類」的，而是基於構造函數（constructor）和原型鏈（prototype）。
（注：理解這個很重要）

---

二、介紹下js構造函數

JavaScript 語言使用構造函數（constructor）做爲對象的模板。所謂」構造函數」，就是專門用來生成實例對象的函數。它就是對象的模板，描述實例對象的基本結構。一個構造函數，能夠生成多個實例對象，這些實例對象都有相同的結構。

構造函數就是一個普通的函數，可是有本身的特徵和用法。
例如：

//如下代碼都可以在瀏覽器中正常運行
let Human = function () {
   this.name = "名字"；
   this.age = 21;
};
或者這樣寫
#function Human(name,age){ //能夠經過傳入參數來初始化值
#  this.name = name；
#  this.age = age;
# }

//咱們實例化該函數
let human = new Human();
//打印出實例對象(human)
console.log(human); // {name: "名字", age: 21}
從打印出來的結果來看human就是一個對象

注意：爲了與普通函數區別，構造函數名字的第一個字母一般大寫

構造函數有兩個特色

• 函數體內部使用了this關鍵字，this指向所要生成的對象實例(如例子中human)。
• 生成對象的時候，必須使用new命令。

解釋一下this.name在構造函數中是什麼意思,this.name表示實例對象（human）中有一個屬性name。

《--額外說一下--》
// 咱們來看下ECMAScript官網是怎麼描述構造函數的

constructor

function object that creates and initializes objects
// 建立和初始化對象的函數對象（描述了構造函數做用）
NOTE

The value of a constructor's "prototype" property is a prototype object that is used to implement inheritance and shared properties.

// 構造函數的「 prototype」屬性的值是用於實現繼承和共享屬性的原型對象。（代表了構造函數中的屬性prototype實際上是一個對象）

三、介紹下什麼是js原型

咱們先來弄清楚兩個概念：

1. js分爲函數對象和普通對象，每一個對象都有__proto__屬性，可是隻有函數對象纔有prototype屬性
2. Object、Function都是js內置的函數, 相似的還有咱們經常使用到的Array、RegExp、Date、Boolean、Number、String

__proto__和prototype究竟是什麼

1. 屬性__proto__是一個對象，它有兩個屬性，constructor和__proto__；
2. 原型對象prototype有一個默認的constructor屬性，用於記錄實例是由哪一個構造函數建立；

看以下代碼

function Person(name, age){
    this.name = name;
    this.age = age;
 }
 
 Person.prototype.conmonPropert = '內容值';
 
 //實例化
 let person1 = new Person("張三",21);
 let person2 = new Person("李四",22);
 // 打印一下person1,person2
 console.log(person1);  //看圖1
 console.log(person2);  //看圖2

圖1

圖2

詳細說一下，因爲原型鏈的關係，person1和person2中都能訪問到conmonPropert這個屬性。大家試想一下，Person這個構造函數若是表示人類的話，那是否是它會有更多的屬性，好比頭髮、皮膚、身高等等屬性，這些屬性都是每一個人都有的共通的屬性，當共通的屬性或者方法越多，原型及原型鏈的意義就體現出來了。

再說一下原型鏈這個東西，這個就比較簡單了，每一個對象中都會隱式的引用__proto__這個對象，每一個__proto__對象中都有constructor和__proto__這兩個屬性。層層嵌套__proto__，直到__proto__屬性爲null。

就相似這樣的關係，正是這樣的關係就造成了原型鏈
__proto__
  __proto__
    __proto__

四、總結及答疑

一、原型有什麼用
原型對象的做用，是用來存放共有的那部份屬性、方法，能夠大大減小內存消耗。

二、原型鏈是什麼
在js中因爲每一個對象中都隱式的引用了__proto__這個對象，而每一個—__proto__對象中又包含了__proto__這個對象，層層嵌套這種關係，造成了原型鏈，直到__proto__爲null。

//梳理下相關知識

js之父在設計js原型、原型鏈的時候聽從如下兩個準則
1. Person.prototype.constructor == Person // **準則1：原型對象（即Person.prototype）的constructor指向構造函數自己**

//取person1做爲例子
2. person1.__proto__ == Person.prototype // **準則2：實例對象（即person1）的__proto__和原型對象指向同一個地方**

//註解（prototype本質也是一個對象）