文章目錄
- 一、原型和原型鏈
- 1.建構式
- 2.為什么要一個原型物件？
- 3.兩個屬性：prototype與__proto__
- 4.原型鏈
- 二、new和Object.create的區別
- 1.Object.create的使用
- 2.二者區別
一、原型和原型鏈
在接觸原型與原型鏈中，我產生了以下幾個疑問：
1.建構式、物件等概念是什么？原型物件是什么？
2.不是說只有實體物件有__proto__屬性，為什么prototype（原型物件）也有__proto__屬性呢？
3.為什么建構式要單獨將一些方法屬性提出來，寫入prototype中？
1.建構式
在原型鏈中，我們有幾個概念：建構式、原型物件、實體物件，
function Person(){}
Person.prototype.age=18;
Person.prototype.name=function(){return 'lk'};
var person = new Person();
console.log(Person.prototype);
console.log(person.__proto__);
console.log(Person.prototype.constructor);
我們可以看到
- 用function創建的叫建構式，是一個類：Person
- 用new關鍵字宣告的是實體物件，通過new Person（），創建了一個Person建構式的實體物件，
- Person.prototype也是一個物件資料型別，
2.為什么要一個原型物件？
//不寫在原型物件里
function Person(){
name:'lk';
sayhi=function(){return 'hi'};
}
如果要為Person這個建構式創建成千上萬個實體person1、person2…person10000,那就得不停的創建sayhi函式；那既然都是一樣的功能，就寫在一個地方，這些Person的實體們去一個地方（原型物件）拿就好啦！
所以我們將一些公共屬性與方法寫入原型物件里，
3.兩個屬性：prototype與__proto__
1.每個建構式都有一個prototype屬性，指向自己的原型物件
2.每個物件都有 __proto__屬性 ，指向自己建構式的原型物件（要用沒寫入建構式里的方法，所以指向的是建構式的原型物件）
這下看實體物件、建構式、原型物件的關系，是不是清楚一些了？
4.原型鏈
我們說過，原型物件也是一個物件，具有__proto__屬性，所以它也有自己的建構式（本圖是Object構造器/建構式），原型物件的__proto__屬性指向自己的建構式的原型物件（Object.prototype）；而Object.prototype的原型物件是null，
這樣通過__proto__屬性鏈接起來的一條路線，就叫做原型鏈，
二、new和Object.create的區別
用new和Object.create都可以創建物件，那么為什么要再有另一種方式呢？
1.Object.create的使用
①語法
Object.create(proto,[propertiesObject])
proto:新創建物件的原型物件
propertiesObject:可選，要添加到新物件的可列舉的屬性，
②舉個簡單的栗子看看
<script>
//自己寫的原型物件
const a = {
name:'lk',
sayhi:function(){console.log('hi')}
}
//創建一個新物件，a是它的原型物件
const abab = Object.create(a,{
height:{
writable:true,
configurable:true,
value:180
}
})
//看看創建的這個物件
console.log(abab)
abab.sayhi()
</script>
更正：下圖原型物件a的原型物件應該是Object.prototype，寫錯了
2.二者區別
①代碼看下
//2.細說區別
//2.1用字面量創建物件：原型物件是Object
const b = {
name:'lk',
sayhi:function(){console.log('hi')}
}
console.log(b)
//2.2用Object.create創建物件，給定一個原型物件為null
var baby = Object.create(null,{
height:{
value:18
}
})
console.log(baby)
通過上面原型與原型鏈的學習，我們可以猜到baby這個物件的原型物件是空，
通過上面原型與原型鏈的學習，我們可以猜到baby這個物件的原型物件是空， 我們也可以推測這幾個物件（還有1里面的abab物件）：
1.abab物件的原型物件是a，a的原型物件是Object.prototype，abab物件可以使用Object.prototype里的屬性與方法，在原型鏈上，
2.用字面量創建的b物件當然也可以使用Object.prototype里的屬性與方法，
3.baby物件的原型物件是null，沒有什么方法，
試試：
//2.3看看物件abab、b、baby的原型鏈上的方法toString
console.log(abab.toString());
console.log(b.toString());
console.log(baby.toString());//報錯
當然，我們如果指定原型物件為Object.prototype，和用字面量/new創建的物件就是一模一樣的了，
//3.指定原型物件為Object.prototype
var cdcd =Object.create(Object.prototype);
console.log(cdcd);
console.log(cdcd.toString())
②總結一下
其實他倆的區別大家已經心知肚明了：
Object.create可以指定任意的原型物件，常用于創建一個以空物件為原型物件的實體，
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/253117.html
標籤：其他