js 原型

Lionad-Morotar 發(fā)布于2019-08-22 18:34 / 2221人閱讀

摘要：所有對(duì)象都有屬性，指向其構(gòu)造函數(shù)的屬性。代碼示例張三李四知識(shí)點(diǎn)總結(jié)操作符具體干了什么新建一個(gè)空對(duì)象將的屬性賦值給的屬性將的指向，并執(zhí)行函數(shù)返回構(gòu)造函數(shù)一般首字母大寫，用以區(qū)分普通的函數(shù)。

此刻想法：
    接觸前端開發(fā)兩年了，雖然實(shí)際工作中編寫代碼沒有問題，但是對(duì)于前端的一些基礎(chǔ)知識(shí)點(diǎn)掌握得的確不牢固，
每一次仔細(xì)琢磨一個(gè)知識(shí)點(diǎn)，都會(huì)有新的領(lǐng)悟。就從這篇文章開始，記錄自己的前端學(xué)習(xí)歷程。

重點(diǎn)

1、js所有引用數(shù)據(jù)類型本質(zhì)都是對(duì)象。
2、對(duì)象分為普通對(duì)象和函數(shù)對(duì)象。
3、所有對(duì)象都有_proto_屬性，指向其構(gòu)造函數(shù)的prototype屬性。
4、只有函數(shù)對(duì)象有prototype屬性。

代碼示例

function Person(name,age){
    this.name = name;
    this.age = age;
}

Person.prototype.alertName = function(){
    alert(this.name);
}

var p1 = new Person("張三","18");

p1.alertAge = function(){
    alert(this.age);
}

var p2 = new Person("李四","20");

p2.alertAge = function(){
    alert(this.age);
}

知識(shí)點(diǎn)總結(jié)：

1、new 操作符具體干了什么？

(1)新建一個(gè)空對(duì)象 
    var obj = {};
(2)將Person的protoype屬性賦值給obj的_proto_屬性
    obj._proto = Person.prototype;
(3)將Person的this指向obj，并執(zhí)行Person函數(shù)
    Person.call(obj);
(4)返回obj
    return obj;

2、構(gòu)造函數(shù)一般首字母大寫，用以區(qū)分普通的函數(shù)。

3、通過把要實(shí)現(xiàn)的方法alertName，賦值給構(gòu)造函數(shù)Person的prototype屬性，實(shí)現(xiàn)了實(shí)例p1、p2共享此方法。實(shí)現(xiàn)了繼承的功能，達(dá)到了節(jié)省內(nèi)存的目的。

4、當(dāng)試圖得到一個(gè)對(duì)象的某個(gè)屬性時(shí)，如果這個(gè)對(duì)象本身沒有該屬性，那么會(huì)去它的_proto_中尋找。一直往上尋找，就形成了原型鏈。一直找到最上層，沒有則宣告失敗，返回undefined。最上層是Object.prototype._proto_值為null。

p1._proto_指向Person.prototype，Person.prototype._proto_指向Object.prototype，
Object.prototype._proto_等于null。

5、函數(shù)的prototype屬性中的_proto_屬性和普通對(duì)象的_proto_屬性一樣，用來對(duì)應(yīng)繼承關(guān)系。

GPU云服務(wù)器云服務(wù)器 js原型面試題 js原型鏈的繼承 js原型屬性有什么用原型原型鏈

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/96001.html

相關(guān)文章

深入淺出，JS原型鏈的工作原理

摘要：前言原型鏈，即原型鏈條。原型的作用在中，每個(gè)對(duì)象都有自己的原型。訪問的屬性方法依舊不存在于該原型，則會(huì)繼續(xù)訪問該原型的原型前言：原型鏈，即原型鏈條。它是由原型、原型的原型、原型的原型的原型...這一規(guī)則組合成的，經(jīng)常被應(yīng)用于繼承。原型的作用在JS中，每個(gè)對(duì)象都有自己的原型。當(dāng)我們訪問對(duì)象的屬性和方法時(shí)，JS會(huì)先訪問對(duì)象本身的屬性和方法。如果對(duì)象本身不包含這些屬性和方法，則訪問對(duì)象...

Ali_ 2019-08-23 13:52 評(píng)論0 收藏0
理解js的原型與繼承

摘要：相當(dāng)于在用原型繼承編寫復(fù)雜代碼前理解原型繼承模型十分重要。同時(shí)，還要清楚代碼中原型鏈的長度，并在必要時(shí)結(jié)束原型鏈，以避免可能存在的性能問題。 js是一門動(dòng)態(tài)語言,js沒有類的概念,ES6 新增了class 關(guān)鍵字，但只是語法糖，JavaScript 仍舊是基于原型。至于繼承,js的繼承與java這種傳統(tǒng)的繼承不一樣.js是基于原型鏈的繼承. 在javascript里面,每個(gè)對(duì)象都有一...

wthee 2019-08-20 12:25 評(píng)論0 收藏0
小筆記：JS原型和原型鏈

摘要：所以為了方便查看一個(gè)對(duì)象的原型，和中提供了這個(gè)非標(biāo)準(zhǔn)不是所有瀏覽器都支持的訪問器引入了標(biāo)準(zhǔn)對(duì)象原型訪問器。在的原型對(duì)象中，還包含一個(gè)屬性，這個(gè)屬性對(duì)應(yīng)創(chuàng)建所有指向該原型的實(shí)例的構(gòu)造函數(shù)。 JS原型？有句簡潔直觀的描述：原型是Javascript中的繼承的基礎(chǔ)，JavaScript的繼承就是基于原型的繼承。在JavaScript中，原型也是一個(gè)對(duì)象，通過原型可以實(shí)現(xiàn)對(duì)象的屬性繼承，J...

CastlePeaK 2019-08-26 13:51 評(píng)論0 收藏0
JS對(duì)象繼承與原型鏈

摘要：此用來定義通過構(gòu)造器構(gòu)造出來的對(duì)象的原型，構(gòu)造器內(nèi)部的代碼用來給對(duì)象初始化。對(duì)象繼承 VS 類繼承在 class-based 的面向?qū)ο蟮氖澜缋铮霈F(xiàn)對(duì)象，必須先有類。類之間可以繼承，類再使用 new 操作創(chuàng)建出實(shí)體，父子對(duì)象之間的繼承體現(xiàn)在父類和子類上。你不能說對(duì)象 a 繼承了對(duì)象 b，只能說 class A 繼承了 class B，然后他們各自有一個(gè)實(shí)例a、b。 JS中實(shí)現(xiàn)...

QLQ 2019-08-22 11:08 評(píng)論0 收藏0
JavaScript繼承方式詳解

摘要：可以通過構(gòu)造函數(shù)和原型的方式模擬實(shí)現(xiàn)類的功能。原型式繼承與類式繼承類式繼承是在子類型構(gòu)造函數(shù)的內(nèi)部調(diào)用超類型的構(gòu)造函數(shù)。寄生式繼承這種繼承方式是把原型式工廠模式結(jié)合起來，目的是為了封裝創(chuàng)建的過程。 js繼承的概念 js里常用的如下兩種繼承方式：原型鏈繼承（對(duì)象間的繼承）類式繼承（構(gòu)造函數(shù)間的繼承）由于js不像java那樣是真正面向?qū)ο蟮恼Z言，js是基于對(duì)象的，它沒有類的概念。...

Yangyang 2019-08-21 10:23 評(píng)論0 收藏0
JS基礎(chǔ)-原型、原型鏈真的不能一知半解

摘要：原型鏈和對(duì)象的原型是對(duì)象實(shí)例和它的構(gòu)造函數(shù)之間建立的鏈接，它的值是構(gòu)造函數(shù)的。對(duì)象的原型根據(jù)上文提到的構(gòu)造調(diào)用函數(shù)的時(shí)候會(huì)創(chuàng)建一個(gè)新對(duì)象，自動(dòng)將的原型指向構(gòu)造函數(shù)的對(duì)象。 showImg(https://segmentfault.com/img/remote/1460000020185197); JS的原型、原型鏈一直是比較難理解的內(nèi)容，不少初學(xué)者甚至有一定經(jīng)驗(yàn)的老鳥都不一定能完全說清...

changfeng1050 2019-08-26 11:00 評(píng)論0 收藏0