怎樣理解javascript面向?qū)ο蠹夹g(shù)基礎(chǔ)

怎樣理解javascript面向?qū)ο蠹夹g(shù)基礎(chǔ),很多新手對(duì)此不是很清楚,為了幫助大家解決這個(gè)難題,下面小編將為大家詳細(xì)講解,有這方面需求的人可以來(lái)學(xué)習(xí)下,希望你能有所收獲。

成都創(chuàng)新互聯(lián)專(zhuān)業(yè)為企業(yè)提供沈北新網(wǎng)站建設(shè)、沈北新做網(wǎng)站、沈北新網(wǎng)站設(shè)計(jì)、沈北新網(wǎng)站制作等企業(yè)網(wǎng)站建設(shè)、網(wǎng)頁(yè)設(shè)計(jì)與制作、沈北新企業(yè)網(wǎng)站模板建站服務(wù),十余年沈北新做網(wǎng)站經(jīng)驗(yàn),不只是建網(wǎng)站,更提供有價(jià)值的思路和整體網(wǎng)絡(luò)服務(wù)。

類(lèi)變量/類(lèi)方法/實(shí)例變量/實(shí)例方法

先補(bǔ)充一下以前寫(xiě)過(guò)的方法:

在javascript中,所有的方法都有一個(gè)call方法和apply方法.這兩個(gè)方法可以模擬對(duì)象調(diào)用方法.它的***個(gè)參數(shù)是對(duì)象,后面的
參數(shù)表示對(duì)象調(diào)用這個(gè)方法時(shí)的參數(shù).比如我們定義了一個(gè)方法f(),然后調(diào)用下面的語(yǔ)句:

f.call(o, 1, 2);

作用就相當(dāng)于

o.m = f;  o.m(1,2);  delete o.m;

舉個(gè)例子:

Js代碼:

function Person(name,age) { //定義方法  this.name = name;  this.age = age;  }  var o = new Object(); //空對(duì)象  alert(o.name + "_" + o.age); //undefined_undefined  Person.call(o,"sdcyst",18); //相當(dāng)于調(diào)用:o.Person("sdcyst",18)  alert(o.name + "_" + o.age); //sdcyst_18  Person.apply(o,["name",89]);//apply方法作用同call,不同之處在于傳遞參數(shù)的形式是用數(shù)組來(lái)傳遞  alert(o.name + "_" + o.age); //name_89

實(shí)例變量和實(shí)例方法都是通過(guò)實(shí)例對(duì)象加"."操作符然后跟上屬性名或方法名來(lái)訪問(wèn)的,但是我們也可以為類(lèi)來(lái)設(shè)置方法或變量,
這樣就可以直接用類(lèi)名加"."操作符然后跟上屬性名或方法名來(lái)訪問(wèn).定義類(lèi)屬性和類(lèi)方法很簡(jiǎn)單:

Js代碼

Person.counter = 0; //定義類(lèi)變量,創(chuàng)建的Person實(shí)例的個(gè)數(shù)  function Person(name,age) {  this.name = name;  this.age = age;  Person.counter++; //沒(méi)創(chuàng)建一個(gè)實(shí)例,類(lèi)變量counter加1  };  Person.whoIsOlder = function(p1,p2) { //類(lèi)方法,判斷誰(shuí)的年齡較大  if(p1.age > p2.age) {  return p1;  } else {  return p2;  }  }  var p1 = new Person("p1",18);  var p2 = new Person("p2",22);  alert("現(xiàn)在有 " + Person.counter + "個(gè)人"); //現(xiàn)在有2個(gè)人  var p = Person.whoIsOlder(p1,p2);  alert(p.name + "的年齡較大"); //p2的年齡較大

prototype屬性的應(yīng)用:

下面這個(gè)例子是根據(jù)原書(shū)改過(guò)來(lái)的.假設(shè)我們定義了一個(gè)Circle類(lèi),有一個(gè)radius屬性和area方法,實(shí)現(xiàn)如下:

Js代碼:

function Circle(radius) {  this.radius = radius;  this.area = function() {  return 3.14 * this.radius * this.radius;  }  }  var c = new Circle(1);  alert(c.area()); //3.14

假設(shè)我們定義了100個(gè)Circle類(lèi)的實(shí)例對(duì)象,那么每個(gè)實(shí)例對(duì)象都有一個(gè)radius屬性和area方法,實(shí)際上,除了radius屬性,每個(gè)Circle類(lèi)的實(shí)例對(duì)象的area方法都是一樣,這樣的話,我們就可以把a(bǔ)rea方法抽出來(lái)定義在Circle類(lèi)的prototype屬性中,這樣所有的實(shí)例對(duì)象就可以調(diào)用這個(gè)方法,從而節(jié)省空間.

Js代碼

function Circle(radius) {  this.radius = radius;  }  Circle.prototype.area = function() {  return 3.14 * this.radius * this.radius;  }  var c = new Circle(1);  alert(c.area()); //3.14

現(xiàn)在,讓我們用prototype屬性來(lái)模擬一下類(lèi)的繼承:首先定義一個(gè)Circle類(lèi)作為父類(lèi),然后定義子類(lèi)PositionCircle.

Js代碼

function Circle(radius) { //定義父類(lèi)Circle   this.radius = radius;   }   Circle.prototype.area = function() { //定義父類(lèi)的方法area計(jì)算面積   return this.radius * this.radius * 3.14;   }    function PositionCircle(x,y,radius) { //定義類(lèi)PositionCircle   this.x = x; //屬性橫坐標(biāo)   this.y = y; //屬性縱坐標(biāo)   Circle.call(this,radius); //調(diào)用父類(lèi)的方法,相當(dāng)于調(diào)用this.Circle(radius),設(shè)置PositionCircle類(lèi)的   //radius屬性   }   PositionCircle.prototype = new Circle(); //設(shè)置PositionCircle的父類(lèi)為Circle類(lèi)   var pc = new PositionCircle(1,2,1);   alert(pc.area()); //3.14   //PositionCircle類(lèi)的area方法繼承自Circle類(lèi),而Circle類(lèi)的   //area方法又繼承自它的prototype屬性對(duì)應(yīng)的prototype對(duì)象   alert(pc.radius); //1 PositionCircle類(lèi)的radius屬性繼承自Circle類(lèi)   /* 注意:在前面我們?cè)O(shè)置PositionCircle類(lèi)的prototype屬性指向了一個(gè)Circle對(duì)象,因此pc的prototype屬性繼承了Circle對(duì)象的prototype屬性,而Circle對(duì)象的constructor屬性(即Circle對(duì)象對(duì)應(yīng)的prototype對(duì)象的constructor屬性)是指向Circle的,所以此處彈出   的是Circ.   */   alert(pc.constructor); //Circle   /*為此,我們?cè)谠O(shè)計(jì)好了類(lèi)的繼承關(guān)系后,還要設(shè)置子類(lèi)的constructor屬性,否則它會(huì)指向父類(lèi)   的constructor屬性   */   PositionCircle.prototype.constructor = PositionCircle   alert(pc.constructor); //PositionCircle

看完上述內(nèi)容是否對(duì)您有幫助呢?如果還想對(duì)相關(guān)知識(shí)有進(jìn)一步的了解或閱讀更多相關(guān)文章,請(qǐng)關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道,感謝您對(duì)創(chuàng)新互聯(lián)的支持。

網(wǎng)頁(yè)名稱(chēng):怎樣理解javascript面向?qū)ο蠹夹g(shù)基礎(chǔ)
文章URL:http://muchs.cn/article6/pieeig.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供網(wǎng)站內(nèi)鏈、ChatGPT、用戶(hù)體驗(yàn)、定制開(kāi)發(fā)、App設(shè)計(jì)、品牌網(wǎng)站設(shè)計(jì)

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶(hù)投稿、用戶(hù)轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來(lái)源: 創(chuàng)新互聯(lián)

外貿(mào)網(wǎng)站建設(shè)