原型和原型鏈 prototype和proto的區(qū)別詳情
1、原型
原型是function對象下的屬性,它定義了構(gòu)造函數(shù)的共同祖先,也就是一個父子級的關(guān)系,子對象會繼承父對象的方法和屬性
prototype是函數(shù)下的屬性,對象想要查看原型使用隱式屬性__Proto__
constructor指向構(gòu)造函數(shù)- 自己身上有屬性,原型上也有屬性,取近的,用自己的
通過給原型添加屬性,可以讓所有的實例化對象共享屬性和方法
Car.prototype = {
height : 1400,
lang : 4900,
carName : 'BMW'
}
function Car() {
}
var car = new Car();
2、原型鏈
每個實例對象下都有__proto__屬性,通過屬性__proto__指向構(gòu)造函數(shù)的原型對象,當(dāng)?shù)竭_末端時,返回null,這樣一層一層向頂端查找,就形成了原型鏈
prototype是函數(shù)特有的, __proto__是對象有的,js中萬物皆對象
prototype和——proto——區(qū)別與作用
prototype把共有屬性預(yù)先定義好,給之后對象使用prototype的存在實現(xiàn)了繼承,節(jié)省內(nèi)存空間__proto__是對象的,prototype是函數(shù)的,因為函數(shù)也是對象,所以函數(shù)也有__proto__;__proto__的作用是就是當(dāng)訪問一個對象的屬性時,如果該對象內(nèi)部不存在這個屬性,那么就會沿著它的**__proto__**屬性所指向的那個對象(父對象)里找,也就是原型鏈prototype的作用是就是讓該函數(shù)所實例化的對象們都可以找到公用的屬性和方法
__proto__對象原型的意義就在于為對象的查找機制提供一個方向,或者說一條路線,但是它是一個非標(biāo)準(zhǔn)屬性,因此實際開發(fā)中,不可以使用這個屬性,它只是內(nèi)部指向原型對象 prototype
2.1 constructor構(gòu)造函數(shù)
constructor屬性存在于__proto__和prototype,它指向構(gòu)造函數(shù)本身
一般情況下,對象的方法都在構(gòu)造函數(shù)的原型對象中設(shè)置。如果有多個對象的方法,我們可以給原型對象采取對象形式賦值,但是這樣就會覆蓋構(gòu)造函數(shù)原型對象原來的內(nèi)容,這樣修改后的原型對象 constructor 就不再指向當(dāng)前構(gòu)造函數(shù)了。此時,我們可以在修改后的原型對象中,添加一個 constructor 指向原來的構(gòu)造函數(shù)。
問題 :修改了函數(shù)的原型對象,constructor的指向是誰
function Star(uname, age) {
this.uname = uname;
this.age = age;
}
// 很多情況下,我們需要手動的利用constructor 這個屬性指回 原來的構(gòu)造函數(shù)
Star.prototype = {
// 如果我們修改了原來的原型對象,給原型對象賦值的是一個對象,則必須手動的利用constructor指回原來的構(gòu)造函數(shù)
constructor: Star, // 手動設(shè)置指回原來的構(gòu)造函數(shù)
sing: function() {
console.log('我會唱歌');
},
movie: function() {
console.log('我會演電影');
}
}
var zxy = new Star('張學(xué)友', 19);
console.log(zxy)
在修改函數(shù)原型時,因為Star.prototype就是一個對象,所以constructor指向構(gòu)造這個對象的原型,也就是object
2.2 call/apply
通過call``apply可以改變this的指向,借用別人的函數(shù)完成自己的功能
區(qū)別:call傳多個參數(shù) apply傳一個參數(shù)數(shù)組
function Person(name,age,sex) {
this.name = name;
this.age = age;
this.sex = sex;
}
function Student(name,age,sex,tel,grade) {
//var this = {name: "lin", age: "19", sex: "male", tel: 123, grade: 78}
Person.call(this,name,age,sex);//通過call改變this的指向這個函數(shù)
//Person.apply(this,[name,age,sex])
this.tel = tel;
this.grade = grade;
}
var student = new Student('lin','19','male',123,78);
2.3 new()
- 創(chuàng)建一個空對象
- 構(gòu)造函數(shù)的
this,繼承函數(shù)原型 - 讓
this指向構(gòu)造函數(shù)的對象實例,執(zhí)行構(gòu)造函數(shù)內(nèi)容為新對象添加屬性和方法 - 返回
this
var obj = {}//創(chuàng)建空對象
obj.__proto__ = Person.prototype;//繼承作用域
Person.call(obj,)//改變this指向
//這三步是隱式的
var person = new Person();//new操作
到此這篇關(guān)于原型和原型鏈 prototype和proto的區(qū)別詳情的文章就介紹到這了,更多相關(guān)原型和原型鏈 prototype和proto的區(qū)別內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
autojs長寬不定的圖片在正方形圖片居中實現(xiàn)詳解
這篇文章主要為大家介紹了autojs長寬不定的圖片在正方形圖片居中實現(xiàn)詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪2023-01-01
JavaScript 中for/of,for/in 的詳細介紹
這篇文章主要介紹了JavaScript 中的for/of, for/in,在 JavaScript中,for 循環(huán)有幾種常見的寫法,西阿棉文章有寫法的詳細內(nèi)容,需要的朋友可以參考一下2021-11-11
JS前端使用canvas動態(tài)繪制函數(shù)曲線示例詳解
這篇文章主要為大家介紹了JS前端使用canvas畫函數(shù)曲線的示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪2022-08-08

