乖,別哭的薄殼
          ~一份耕耘,一份收獲~
          posts - 23,comments - 260,trackbacks - 0
          <2008年4月>
          303112345
          6789101112
          13141516171819
          20212223242526
          27282930123
          45678910


          常用鏈接

          留言簿(5)

          隨筆分類

          隨筆檔案

          好友的BLOG

          • crespo
          • 同學(xué),朋友,同事。。。匪夷所思
          • 愛友
          • 愛友的博客
          • 神行梅
          • shenxingmei是個(gè)啥意思呢?
          • 章章
          • !@#$%^&*()_+|

          搜索

          •  

          積分與排名

          • 積分 - 67855
          • 排名 - 800

          最新評(píng)論

          閱讀排行榜

          評(píng)論排行榜

          一、定義類或?qū)ο?br>1.工廠方式
          創(chuàng)建對(duì)象car
          var oCar = new Object;
          oCar.color = "red";
          oCar.doors = 4;
          oCar.mpg = 23;
          oCar.showColor = function(){
             alert(this.corlor);
          };

          創(chuàng)建多個(gè)car
          function createCar(color, doors, mpg) {
              var tempcar = new Object;
              tempcar.color = color;
              tempcar.doors = doors;
              tempcar.mpg = mpg;
              tempcar.showColor = function () {
                  alert(this.color)
              };
             return tempcar;
          }

          var car1 = createCar("red", 4, 23);
          var car2 = createCar("blue", 3, 25);
          car1.showColor();    //outputs "red"
          car2.showColor();    //outputs "blue"
          這個(gè)例子中,每次調(diào)用函數(shù)createCar(),都要?jiǎng)?chuàng)建新函數(shù)showColor(),意味著每個(gè)對(duì)象都有自己的showColor()版本,事實(shí)上,每個(gè)對(duì)象都共享了同一個(gè)函數(shù)。
          有些開發(fā)者在工廠函數(shù)外定義對(duì)象的方法,然后通過屬性指向該方法,從而避開這個(gè)問題。
          function showColor(){
             alert(this.color);
          }
          function createCar(color, doors, mpg) {
              var tempcar = new Object;
              tempcar.color = color;
              tempcar.doors = doors;
              tempcar.mpg = mpg;
              tempcar.showColor = showColor;
              return tempcar;
          }

          var car1 = createCar("red", 4, 23);
          var car2 = createCar("blue", 3, 25);
          car1.showColor();    //outputs "red"
          car2.showColor();    //outputs "blue"
          從功能上講,這樣解決了重復(fù)創(chuàng)建函數(shù)對(duì)象的問題,但該函數(shù)看起來不像對(duì)象的方法。所有這些問題引發(fā)了開發(fā)者定義的構(gòu)造函數(shù)的出現(xiàn)。

          2.構(gòu)造函數(shù)方法
          function Car(sColor, iDoors, iMpg) {
              this.color = sColor;
              this.doors = iDoors;
              this.mpg = iMpg;
              this.showColor = function () {
                  alert(this.color)
              };
          }

          var oCar1 = new Car("red", 4, 23);
          var oCar2 = new Car("blue", 3, 25);
          oCar1.showColor();    //outputs "red"
          oCar2.showColor();    //outputs "blue"
          就像工廠函數(shù),構(gòu)造函數(shù)會(huì)重復(fù)生成函數(shù),為每個(gè)對(duì)象都創(chuàng)建獨(dú)立的函數(shù)版本。不過,也可以用外部函數(shù)重寫構(gòu)造函數(shù),同樣,這么做語義上無任何意義。

          3.原型方式
          function Car(){
          }
          Car.prototype.color = "red";
          Car.prototype.doors= 4;
          Car.prototype.mpg= 23;
          Car.prototype.showColor = function(){
             alert(this.color);
          }

          var oCar1 = new Car();
          var oCar2 = new Car();
          它解決了前面兩種方式存在的兩個(gè)問題。但并不盡人意。首先,這個(gè)構(gòu)造函數(shù)沒有參數(shù)。使用原型方式時(shí),不能通過構(gòu)造函數(shù)傳遞參數(shù)初始化屬性的值,這點(diǎn)很令人計(jì)厭,但還沒完,真正的問題出現(xiàn)在屬性指向的是對(duì)象,而不是函數(shù)時(shí)??紤]下面的例子:
          function Car(){
          }
          Car.prototype.color = "red";
          Car.prototype.doors= 4;
          Car.prototype.mpg= 23;
          Car.prototype.drivers = new Array("Mike","Sue");
          Car.prototype.showColor = function(){
             alert(this.color);
          }

          var oCar1 = new Car();
          var oCar2 = new Car();
          oCar1.drivers.push("Matt");
          alert(oCar1.drivers);      //outputs "Mike,Sue,Matt"
          alert(oCar2.drivers);      //outputs "Mike,Sue,Matt"

          4.混合的構(gòu)造函數(shù)/原型方式
          function Car(sColor, iDoors, iMpg) {
              this.color = sColor;
              this.doors = iDoors;
              this.mpg = iMpg;
              this.drivers = new Array("Mike", "Sue");
          }

          Car.prototype.showColor = function () {
              alert(this.color);
          };

          var oCar1 = new Car("red", 4, 23);
          var oCar2 = new Car("blue", 3, 25);

          oCar1.drivers.push("Matt");

          alert(oCar1.drivers);    //outputs "Mike,Sue,Matt"
          alert(oCar2.drivers);    //outputs "Mike,Sue"
          現(xiàn)在就更像創(chuàng)建一般對(duì)象了。所有的非函數(shù)屬性都有構(gòu)造函數(shù)中創(chuàng)建,意味著又可用構(gòu)造函數(shù)的參數(shù)賦予屬性默認(rèn)值了。因?yàn)橹粍?chuàng)建showColor()函數(shù)的一個(gè)實(shí)例,所以沒有內(nèi)存浪費(fèi)。

          5.動(dòng)態(tài)原型方法
          function Car(sColor, iDoors, iMpg) {
              this.color = sColor;
              this.doors = iDoors;
              this.mpg = iMpg;
              this.drivers = new Array("Mike", "Sue");

              if (typeof Car._initialized == "undefined") {

                  Car.prototype.showColor = function () {
                      alert(this.color);
                  };

                  Car._initialized = true;
              }
          }


          var oCar1 = new Car("red", 4, 23);
          var oCar2 = new Car("blue", 3, 25);

          oCar1.drivers.push("Matt");

          alert(oCar1.drivers);    //outputs "Mike,Sue,Matt"
          alert(oCar2.drivers);    //outputs "Mike,Sue"
          動(dòng)態(tài)原型方法的基本想法與混合的構(gòu)造函數(shù)/原型方式相同,即在構(gòu)造函數(shù)內(nèi)定義非函數(shù)屬性,而函數(shù)屬性則利用原型屬性定義。唯一的區(qū)別是賦予對(duì)象方法的位置。

          6.混合工廠方式
          這種方式通常是在不能應(yīng)用前一種方式時(shí)的變通方法。它的目的是創(chuàng)建假構(gòu)造函數(shù),只返回另一種對(duì)象的新實(shí)例。
          function Car() {
              var tempcar = new Object;
              tempcar.color = "red";
              tempcar.doors = 4;
              tempcar.mpg = 23;
              tempcar.showColor = function () {
                  alert(this.color)
              };
             return tempcar;
          }
          與經(jīng)典方式不同,這種方式使用new運(yùn)算符,使它看起來像真正的構(gòu)造函數(shù)。

          7.采用哪種方式
             如前所述,目前使用最廣泛的是混合的構(gòu)造函數(shù)/原型方式。些外,動(dòng)態(tài)原型方法也很流行,在功能上與前者等價(jià),可以采用這兩種方式中的任何一種。

          二、修改對(duì)象
          1.創(chuàng)建新方法
          可以用prototype屬性為任何已有的類定義新方法,就像處理自己的類一樣。
          例:
          Array.prototype.indexOf = function(vItem){
             for(var i=0;i<this.length;i++){
                if(vItem == this[i]){
                   return i;
                }
             }
             retunr -1;
          }
          最后,如果想給ECMAScript中的每個(gè)本地對(duì)象添加新方法,必須在Object對(duì)象的prototype屬性上定義它。

          2.重定義已有方法
          就像能給自己的類定義新方法一樣,也可重定義已有的方法。函數(shù)名只是指向函數(shù)的指針,因此可以輕易地使它指向其他函數(shù)。

          Function.prototype.toString = function(){
             return "Function code hidden";
          }
          function sayHi(){
             alert("hi");
          }
          alert(sayHi.toString());      //outputs "Function code hidden"

          posted on 2007-04-16 22:20 小祝 閱讀(910) 評(píng)論(4)  編輯  收藏 所屬分類: Javascript

          FeedBack:
          # re: javascript學(xué)習(xí)筆記(一)--對(duì)象
          2007-04-17 12:38 | cresposhi
          very good!
          我一般使用混合模式,是學(xué)eric的,推薦大家使用。如果弄不明白可以看看大師們的源代碼。  回復(fù)  更多評(píng)論
            
          # re: javascript學(xué)習(xí)筆記(一)--對(duì)象
          2007-04-20 19:00 | 睿不可當(dāng)
          小?!⌒量嗔?
          這么好的文章!
          頂了!  回復(fù)  更多評(píng)論
            
          # re: javascript學(xué)習(xí)筆記(一)--對(duì)象
          2008-03-07 13:19 | 很好頂了
          很好頂了很好頂了很好頂了很好頂了很好頂了很好頂了  回復(fù)  更多評(píng)論
            
          # re: javascript學(xué)習(xí)筆記(一)--對(duì)象
          2008-04-15 23:44 | Aragorn
          老祝的文章太好了!
          我也覺得混合模式更好些,更像是創(chuàng)建對(duì)象的過程,而且沒有內(nèi)存的浪費(fèi)!
          老祝辛苦了!
          頂!  回復(fù)  更多評(píng)論
            
          主站蜘蛛池模板: 社会| 刚察县| 万宁市| 德惠市| 西乌珠穆沁旗| 深水埗区| 平江县| 克山县| 怀仁县| 莒南县| 蓬安县| 津南区| 定结县| 黑河市| 宜昌市| 老河口市| 类乌齐县| 同仁县| 房产| 潜山县| 泰兴市| 浙江省| 襄汾县| 焉耆| 武邑县| 洪泽县| 理塘县| 即墨市| 扎赉特旗| 威宁| 溧水县| 石嘴山市| 台前县| 清流县| 阿坝县| 太和县| 荆州市| 石渠县| 富民县| 桃园县| 喀喇沁旗|