一、理解什么是prototype
了解什么是
prototype
首先要了解一句話瓦戚,prototype
是函數(shù)的一種屬性匪燕,是函數(shù)的原型對(duì)象。
前半句表明了prototype
是函數(shù)的屬性侮叮,并不是對(duì)象的一種屬性避矢,證明了prototype
只能用函數(shù)名調(diào)用,而不是對(duì)象名調(diào)用囊榜,以下例子可以證明:
function Person(){
name = "123";
}
console.log(Person.prototype) //是可以訪問到的审胸。
let stu = new Person();
console.log(stu.prototype) //undefined
console.log(stu.name )
這個(gè)還要注意的一點(diǎn),函數(shù)里面直接聲明的屬性卸勺,通過該函數(shù)實(shí)例的對(duì)象訪問不到的砂沛。只是相當(dāng)于函數(shù)內(nèi)部的局部變量。對(duì)于學(xué)習(xí)java的我就非常不習(xí)慣了曙求,還好es6的class
關(guān)鍵字解決了這一點(diǎn)碍庵。那么在class
出來之前是怎么聲明類的屬性和方法呢,后面我會(huì)說明悟狱。
然后理解什么叫原型對(duì)象静浴?
let stu1 = new Person();
stu1.name = "stu1";
let stu2 = new Person();
console.log(stu1.name); //stu1
console.log(stu2.name); //undefined
上面定義了兩個(gè)對(duì)象stu1
和 stu2
,然后給stu1
對(duì)象name屬性挤渐。這里的name
稱為對(duì)象屬性
苹享。然后打印兩個(gè)對(duì)象的name屬性,stu1有值浴麻,stu2沒有值得问。證明:對(duì)象屬性只能作用于當(dāng)前實(shí)例(對(duì)象)
囤攀。了解了對(duì)象屬性,接下來就說prototype
Person.prototype.age = "123"
let stu1 = new Person();
let stu2 = new Person();
console.log(stu1.age); //123
console.log(stu2.age); //123
這里看到了么宫纬,我們通過原型對(duì)象賦予的屬性作用于所有的實(shí)例 (當(dāng)前類)抚岗。 我理解為使用new關(guān)鍵字
,將當(dāng)前的原型對(duì)象prototype
復(fù)制了一份給每一個(gè)實(shí)例哪怔。
總結(jié):函數(shù)屬性宣蔚、對(duì)象屬性、原型對(duì)象屬性三者的區(qū)別
- 函數(shù)的屬性只能在函數(shù)里作用认境,相當(dāng)于局部的變量胚委,不能被實(shí)例直接調(diào)用。
- 對(duì)象的屬性作用于當(dāng)前的對(duì)象叉信。
- 原型對(duì)象
prototype
的屬性作用于所有的實(shí)例亩冬。
二、ES5 和 ES6 定義類的區(qū)別
ES5定義類:
function Person(){
Person.prototype.name = "name"
Person.prototype.age = "age"
Person.prototype.Say = function(){
console.log('say hello');
}
}
ES6定義類:
class Person{
name = 'name';
age = 'age';
Say(){
console.log('say hello');
}
}