首頁 > 開發者 > JavaScript
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>測試Javascript類</title></head><body><div id="dbg"></div><script type="text/javascript">function p(str){if(str.indexOf('err')!=-1) str = '<font color="#ff0000">'+str+'</font>';str = str.replace(/(pro_fun)/g,'<font color="#ff00ff">$1</font>');str = str.replace(/(pub_fun)/g,'<font color="#0000ff">$1</font>');g('dbg').innerHTML = g('dbg').innerHTML+'<br />'+str;}function g(id){return document.getElementById(id);}function f1(){var pri_var = 'pri_var';this.pub_var = 'pub_var';this.pub_fun = function(){try{p('pub_fun->pri_var:'+pri_var);}catch(e){p('pub_fun->pri_var(err):'+e);}try{p('pub_fun->pub_var:'+this.pub_var);}catch(e){p('pub_fun->pub_var(err):'+e);}//---------------------------------------------try{p('pub_fun->pro_var:'+this.pro_var);}catch(e){p('pub_fun->pro_var(err):'+e);}//---------------------------------------------try{this.pro_fun();}catch(e){p('cls.pub_fun->pro_fun(err):'+e);}}this.pub_chgv=function(){//注意下面有一個f1.prototype.pub_chgv，而被認可的是這個函數，ie9 ffthis.pub_var = 'pub_var->pub_chgv';this.pro_var = 'pro_var->pub_chgv';p('pub_chgv->pub_var: '+this.pub_var);p('pub_chgv->pro_var: '+this.pro_var);}}f1.prototype.pro_var = 'pro_var';f1.prototype.pro_fun = function(){try{p('pro_fun->pri_var:'+pri_var);}catch(e){p('pro_fun->pri_var(err):'+e);}try{p('pro_fun->pri_var:'+this.pri_var);}catch(e){p('pro_fun->pri_var(err):'+e);}try{p('pro_fun->pub_var:'+this.pub_var);}catch(e){p('pro_fun->pub_var(err):'+e);}//---------------------------------------------try{p('pro_fun->pro_var:'+this.pro_var);}catch(e){p('pro_fun->pro_var(err):'+e);}}f1.prototype.pub_chgv=function(){this.pub_var = 'pub_var->pro_chgv';this.pro_var = 'pro_var->pro_chgv';p('pro_chgv->pub_var: '+this.pub_var);p('pro_chgv->pro_var: '+this.pro_var);}f1.prototype.pro_getv=function(){p('<hr>pro_getv->pub_var: '+this.pub_var);p('pro_getv->pro_var: '+this.pro_var);p('pro_getv->pro_var: '+f1.pro_var+' <-- 這說明：將prototype增加的屬性或者方法稱為靜態方法或者屬性並不正確，因為它不能不執行個體化直接調用');}var CLA = new f1();var clb = new f1();CLA.pub_fun();try{f1.pro_getv();}catch(e){p('f1.pro_getv(err):'+e+' <-- 這說明：將prototype增加的屬性或者方法稱為靜態方法或者屬性並不正確，因為它不能不執行個體化直接調用');}//一個執行個體改變私人變數或者prototype變數，不會影響其它的執行個體的值（改變自己的prototype屬性會複製一份給自己，根據作用於原理（從自身向上查），自己有一個複製之後，就不再受prototype影響）CLA.pub_chgv();clb.pro_getv();//---------------------------------------------//一個執行個體改變增加或者改變方法屬性，都不會影響其它執行個體CLA.pro_getv=function(){p('<hr><font color="#00ffff">new by instance</font> pro_getv->pub_var: '+this.pub_var);p('<font color="#00ffff">new by instance</font> pro_getv->pro_var: '+this.pro_var+' <--- 注意pro_var在前面通過CLA.pub_chgv()改變了值，它就不再是引用prototype的值了，因此它不受prototype的影響了');p('<font color="#00ffff">new by instance</font> pro_getv->pro_var: '+f1.pro_var);}clb.pro_getv();//---------------------------------------------//通過原始類的.prototype去改變屬性或者方法，會使所有的未通過執行個體自身改變屬性或者方法的執行個體的也變化f1.prototype.pro_var = 'pro_var changed';f1.prototype.pro_getv=function(){p('<hr>new 1 pro_getv->pub_var: '+this.pub_var);p('new 1 pro_getv->pro_var: '+this.pro_var);p('new 1 pro_getv->pro_var: '+f1.pro_var);}clb.pro_getv();//CLA 通過執行個體自身改變過pro_getv方法，它的方法pro_getv沒有被prototype.pro_getv改變，但可能是存在著兩個pro_getv,一個在CLA下，一個在f1.prototype下，當CLA(執行個體)下找不到，就會去原型（類定義）去找//CLA.pub_chgv改變了CLA的pro_var，此時無法通過prototype去修改CLA的pro_varCLA.pro_getv();//---------------------------------------------/*總結：1 類（function）聲明時定義的變數：a、 var 定義的，只有類聲明內定義的函數（this.fun=function(){}或者function fun(){}）能夠訪問，多個執行個體之間相互不影響，也不能prototype改變b、 this 定義的變數，prototype定義的函數或者類聲明內定義的函數(this.fun=function(){}確定可以，function func(){}未實驗)都可以訪問（使用this.var_name訪問）；多個執行個體之間相互不影響，也不能prototype改變2 prototype定義的變數或者方法，建立執行個體時只是建立了一個引用，如果執行個體改變變數或者方法，那麼方法或者變數將指向新的值，因此，方法或者變數就不再隨著prototype變化而變化*/</script></body></html>
pro = prototype
pri = private
pub = public
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
