本文歸納了js面向?qū)ο蟮膸追N常見寫法,分享給大家供大家參考,具體內(nèi)容如下
1.工廠方式
var Circle = function() { var obj = new Object(); obj.PI = 3.14159; obj.area = function( r ) { return this.PI * r * r; } return obj;}var c = new Circle();alert( c.area( 1.0 ) );2.比較正規(guī)的寫法
function Circle(r) { this.r = r;}Circle.PI = 3.14159;Circle.prototype.area = function() { return Circle.PI * this.r * this.r;}var c = new Circle(1.0); alert(c.area()); 3.json寫法
var Circle={ "PI":3.14159, "area":function(r){ return this.PI * r * r; }};alert( Circle.area(1.0) );4.有點(diǎn)變化,但是實(shí)質(zhì)和第一種一樣
var Circle=function(r){ this.r=r;}Circle.PI = 3.14159; Circle.prototype={ area:function(){ return this.r*this.r*Circle.PI; }}var obj=new Circle(1.0);alert(obj.area()Circle.PI = 3.14159; 能夠放入屬性中寫成this.PI=3.14159;
常用為第一種和第三種,第三種寫法的擴(kuò)展小實(shí)例
var show={ btn:$('.div1'), init:function(){ var that=this; alert(this); this.btn.click(function(){ that.change(); alert(this); }) }, change:function(){ this.btn.css({'background':'green'}); } } show.init();需要注意的是this的指向問題,下面是關(guān)于this的一點(diǎn)點(diǎn)介紹,希望對(duì)大家有幫助。
一開始采用動(dòng)態(tài)原型方法在js中創(chuàng)建自定義的對(duì)象,this也用著很順的。
這種方法中對(duì)于在對(duì)象內(nèi)部對(duì)變量的創(chuàng)建和使用都是用"this."開頭的。
比如:對(duì)象ContactModel,有三個(gè)屬性,crtnewFriendListLen,crtNewFriendList,crtFindedUserID
和四個(gè)方法requestContactList(),requestNewfriendList(),requestFindUser(),requestAddContact()
在這個(gè)變量內(nèi)部如要訪問自己的屬性,都要帶上"this."
var contactModel;...contactModel = new ContactModel();
function ContactModel(){ // this.contactList; this.crtnewFriendListLen; this.crtNewFriendList; this.crtFindedUserID = "-1"; if(typeof ContactModel._initialized == "undefined") { ContactModel.prototype.requestContactList = function() { } ContactModel.prototype.requestNewfriendList = function() { } ContactModel.prototype.requestFindUser = function(userID) { $.getJSON(mainUrl + "User/getuserinfo",{"uid":userID},function(resultObj) { // this.crtFindedUserID = userID contactModel.crtFindedUserID = userID; uiManager.contectAddPage.receiveFindUserResult(resultObj); }); } ContactModel.prototype.requestAddContact = function(remark) { alert(this.crtFindedUserID); } ContactModel._initialized = true; };}但這時(shí)問題出現(xiàn)了,在requestFindUser ()內(nèi),若用this.crtFindedUserID來存儲(chǔ)服務(wù)端傳來的數(shù)值,那么在之后此對(duì)象被調(diào)用了requestAddContact()方法后,是拿不到crtFindedUserID這個(gè)值的,alert里顯示的依然會(huì)是初始值-1,問題就出在$.getJSON()的回調(diào)方法內(nèi),此時(shí)的this指的不是ContactModel的實(shí)例,而是此方法體,所以這里的解決辦法就是在這個(gè)回調(diào)方法內(nèi)拿到ContectModel的實(shí)例,然后給這個(gè)實(shí)例的屬性crtFindedUserID賦值。
在對(duì)象內(nèi)部對(duì)視圖組件的監(jiān)聽回調(diào)方法里,this指向的也不是對(duì)象本身,同樣還是這個(gè)被回調(diào)的方法體,這時(shí)若要訪問對(duì)象本身的屬性,就要拿到此對(duì)象的實(shí)例來訪問,而不是用this.
下面是一段JS面向?qū)ο蟮臉?biāo)準(zhǔn)寫法:
<head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>新建網(wǎng)頁 1</title> <mce:script type=text/javascript><!-- var person=function(name,age){//定義對(duì)象構(gòu)造方法 this.name=name; this.age=age; } person.prototype={ //封裝方法 getName:function(){ alert(this.name); }, getAge:function(){ alert(this.age); } } function test(){//聲明調(diào)用 var man=new person('jack',12); man.getName() man.getAge() } var test2 ={ //類似靜態(tài)方法 調(diào)用直接:test2.te();即可 te:function(){ alert(); }, te1:function(){ alert(); } } // --></mce:script> </head> <body> <input type=button onclick="test()"/> </body> </html>希望本文所述對(duì)大家學(xué)習(xí)javascript程序設(shè)計(jì)有所幫助。
新聞熱點(diǎn)
疑難解答
圖片精選
網(wǎng)友關(guān)注