一、原型

定義：原型是 function 對象的一個屬性，它定義了構造函數制造出的對象的公共祖先。通過該構造函數產生的對象，可以繼承該原型的屬性和方法。原型也是對象。

利用原型特點和概念，可以提取共有屬性。

對象屬性的增刪和原型上屬性增刪改查。

對象如何查看原型 ==> 隱式屬性__proto__。

對象如何查看對象的構造函數 ==> constructor。

例 person.prototype //原型（描述一種繼承關系），出生時就被定義好了 person.prototype ={} //是祖先

上面的 person 和 person1 都有一個共有的祖先 Person.prototype

自己身上有屬性，原型上也有屬性，取近的，用自己的

上面通過對象（后代）改原型（祖先）是不行的，在對象里面修改，只作用給自己
改原型都不行，增加肯定也不行。對象可以刪除屬性

// construnctor 是構造的意思（隱式是淺粉色）

淺粉色是系統幫你設置的，深紫色是自己設置的

在原型內部自帶 constructor，指的是 Car。通過 constructor 能找的誰構造的自己

constructor 可以被人工手動更改

淺粉色的__proto__是系統的隱式的屬性，前面兩個_后面兩個_,可以修改，盡量不改，在開發的時候，如果很私人的可以寫成_private，告訴同事別動。

上面的__proto__放的是原型，__proto__存的是對象的原型

上面的var this ={__proto__：person.prototype }；這個對象并不是空的，這個proto，當你訪問這個對象的屬性時，如果對象沒有這個屬性，那么就會訪問proto索引，看看有沒有一個連接的關系，原型和自己連在一起

Person.prototype.name = 'abc';function Person() {//var this={// __proto__=:Person.prototype//}}var obj = {name: "sunny"}var person = new Person();person.__proto__ = obj;

Person 的原型是可以被修改的

Person.prototype.name = 'sunny';function Person() {//var this={// __proto__=:Person.prototype//}}var person = new Person();Person.prototype.name = 'cherry';

Person.prototype.name = 'sunny';function Person() {//var this={// __proto__=:Person.prototype//}}Person.prototype.name = 'cherry';var person = new Person();

Person.prototype.name = 'sunny';function Person() {//var this={// __proto__=:Person.prototype//}}var person = new Person();Person.prototype = {name: 'cherry'}

Person.prototype.name這種.的寫法是在原有的基礎上把值改了。改的是屬性，也就是房間里面的東西。

而Person.prototype = {name: ‘cherry’ }是把原型改了，換了新的對象。改了個房間。

上面在new的時候var this={__proto__:Person.prototype}里面的指向Person，此時Person.prototype與__proto__指向的是同一個空間，把他返回給var person

先new再Person.prototype={ name : ‘cherry’ } 已經晚了

在Person.prototype= { name : ‘cherry’ } 時，Person.prototype空間改了，但是__proto__指向的空間不變

上面的步驟實際上是

Person.prototype.name = {name: "a"};__proto__ = Person.prototype;Person.prototype = {name: "b"}; var obj = {name: "a"};var obj1 = obj;obj = {name: "b"}

上面這種思考過程：程序執行順序

先把function Person(){}在預編譯的過程中提到最上面

再執行Person.prototype.name=‘sunny’ 這一樣行

再執行Person.prototype={name:‘cherry’}

最后執行var person=new Person（）；執行到new的時候，才會發生var this={__proto__:Person.prototype}

下面的把上面的覆蓋了

答案是cherry

function Person() {}

這說明原型里面有原型

Grand.prototype.lastName = "Deng";function Grand() {}var grand = new Grand();Father.prototype = grand;function Father() {this.name = "xuming";}var father = new Father();Son.prototype = father;function Son() {this.hobbit = "smoke";}var son = new Son();

執行son.toString
//返回function toString(){[native code]}，這里返回的是原型鏈終端的toString

Grand.prototype.__proto__=Object.prototype
//Object.prototype是原型鏈的終端

二、原型鏈

如何構成原型鏈？（見上一個例子）

原型鏈上屬性的增刪改查
原型鏈上的增刪改查和原型基本上是一致的。只有本人有的權限，子孫是沒有的

誰調用的方法內部this就是誰–原型案例

絕大多數對象的最終都會繼承自Object.prototype

Objcet.create(原型）

原型方法上的重寫

son.fortune.card2='master'這種改，這是引用值自己的修改。屬于fortune.name給自己修改，這是一種調用方法的修改

---

Grand.prototype.lastName = "Deng";function Grand() {}var grand = new Grand();function Father() {this.name = "xuming";this.fortune = {card1: "visa"};this.num = 100;}var father = new Father();Son.prototype = father;function Son() {this.hobbit = "smoke";}var son = new Son();

son.num++是son.num=son.num+1
是先把父級的取過來再賦值+1
所以父親的沒變

---

<script>Person.prototype = {name: "a",sayName: function() {console.log(name);}}function Person() {}var person = new Person();</script>

console.log(name);寫成name就會錯，沒有這個變量
console.log(this.name);寫成this.name就會打印出a

---

Person.prototype = {name: "a",sayName: function() {console.log(this.name);}}function Person() {this.name = "b";}var person = new Person();

a.sayName()方法調用，就是sayName里面的this指向，是誰調用的這個方法，this就指向誰

---

Person.prototype = {height: 100}function Person() {this.eat = function() {this.height++;}}var person = new Person();

this.height++;
這后面默認有一個return undefined

---

Person.prototype = {height: 100}function Person() {this.eat = function() {this.height++;return 123;}}var person = new Person();

---

例：var obj={};也是有原型的

var obj={};與var obj1=new Object();效果是一樣的

寫var ovj={};系統會在內部來一個new Object();

obj1.__proto__-------> Object.prototype;
但是在構造對象時，能用對象自變量var obj ={};就不要用var obj1=new Object();

---

Person.prototype = {}-- > Object.prototypefunction Person() {}

對象自變量的原型就是Object.prototype;

三、Object.create(原型)

//var obj = Object.create(原型);

Object.create 也能創建對象。var obj = Object.create（這里必須要有原型）

// var obj = Object.create(原型);var obj = {name: "sunny",age: 123};var obj1 = Object.create(obj);

---

// var obj = Object.create(原型); Person.prototype.name = "sunny"; function Person() { } var person = Object.create(Person.prototype);

---

四、絕大多數對象的最終都會繼承自Object.prototype

html里面沒有添加任何東西 這樣就會報錯

---

html里面沒有添加任何東西 只在控制臺加上null

---

// var obj = Object.create(原型); var obj = Object.create(null);

原型是隱式的內部屬性，你加是沒有用的

---

// var obj = Object.create(原型); var obj = Object.create(123);

Object.create()在括號里面只能放null或者Object，其余會報錯

---

undefined和null沒有原型，也就不可能有toString方法

---

下面 123.toString 首先會識別成浮點型，所以在后面直接加.toString 是不行的

數字想用toString方法，要經過包裝類包裝new Number（num）然后.toString

---

加深上面的理解

var num=123; //num.toString();--->new Number(num).toString(); Number.prototype.toString=function(){} //Number.prototype.__proto__=Object.prototype

而new Number（num）.toString的原型是Number.prototype，而Number.prototype上面有一個.toString方法，Number.prototype也有原型Number.prototype.__proto__，原型是Object.prototype

假如new Number上面的prototype上面有這個toString，那么就不用Object.prototype的 toString。而這個 number 上面有這個 toString。

然后number上面的toString調用的是自己重寫的toString

原型上有這個方法，我自己又寫了一個和原型上同一名字，但不同功能的方法，叫做重寫（同一個名字的函數，不同重寫方式）

通過返回值，形參列表不同傳參
同樣的名實現不同功能的，就是重寫

---

// var obnj=Object.create(原型);// Object.prototype.toString=function(){// }Person.prototype = {}function Person() {}var person = new Person();

和原型鏈上終端方法名字一樣，但實現不同的功能，叫做方法的重寫。也就是覆蓋

---

下面這個也是重寫

---

讓object上面的toString重寫了
所以num.toString()調用的是number.prototype.toString

如果調用的是object.prototype.toString結果會不一樣

---

---

document.write會隱式的調用toString方法，其實打印的是 toString 的結果

沒有原型就不能toString

---

上面這個例子表示：我要打印的是obj，實際上打印出來的是toString方法，也證明了document.write調用的是toString方法

總結

以上是生活随笔為你收集整理的JavaScript学习笔记10的全部內容，希望文章能夠幫你解決所遇到的問題。

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