第163天：js面向對象-對象建立方式總結

面向對象-對象建立方式總結

1、 建立對象的方式，json方式

推薦使用的場合： 作為函數的參數，臨時隻用一次的場景。比如設定函數原型對象。

1 var obj = {};
 2 //對象有自己的 屬性 和  行為
 3 // 屬性比如： 年齡、姓名、性别
 4 // 行為： 吃飯、睡覺、走路、講課等... 動作
 5 var obj2 = { 
 6     name: 'laoma', 
 7     age: 18, 
 8     sayHi: function(){
 9         console.log( name + 'say hi' );
10     }
11 };
12 //添加其他屬性：
13 obj2.newProp = 123;// js的動态特性，如果沒有要通路的屬性，直接添加屬性。      

缺點： 不能作為對象建立的模闆，也就是不能用new進行構造新對象。

2、 建立面向對象的方式： new Object()的方式。 不推薦使用。

1 var obj3 = new Object();
2 //添加屬性
3 obj3.name = 'kitty';
4 obj3.sayHi = function() {
5     console.log( name + ' ' + 'say hi');
6 };      

缺點：跟上面的方式一樣，隻能臨時用一下這個對象，不想作為new的構造模闆是可以的。

3、 構造函數構造對象方法

把 一個函數對象 當做構造函數來使用，一般要把 函數對象的首字母大寫

1 function Persion() {
 2     this.name = '123'; // 通過this可以直接給 構造出來的對象添加屬性。
 3     this.sayHi = function() {
 4         console.log( this.name );
 5     };
 6 }   
 7 
 8 var p  = new Persion(); 
 9 //** new 運算符的作用：
10 // 第一步：
11 // 執行構造函數（new後面的那個函數），在構
12 //造函數内部建立一個空對象，
13 // 第二步： 把上面的空對象跟構造函數的原型對象進行關聯。
14 // 第三步：然後把this 指向目前空對象
15 //在構造函數執行結束後，把空對象傳回 給 p
16 
17 console.log( p.name ); //p.name 從構造函數裡面建立的。
18 p.sayHi(); //在此方法内部的 this執行 p對象。      

更新改造版本：

//第三種方式有個缺點： 對象的内部的函數會在每個對象中都存一份

//如果建立的對象非常多的話，那麼非常浪費記憶體。函數的行為是所有對象

//可以共有，不需要每個對象都儲存一份。是以，可以把函數放到原型中

//進行聲明，那麼所有對象都有了公共的函數，而且記憶體中隻保留一份。

//所有的屬性寫到對象的内部

第三種的更新版：

1 function Sprite() {
 2     this.name = '123';
 3     this.age = 19;
 4 }
 5 Sprite.prototype = {
 6     sayHi: function() {
 7 
 8     },
 9     init: function() {
10 
11     }
12 };
13 
14 //繼續更新： 把屬性的設定做成參數化：
15 function Sprite( sname, sage ) {
16     this.name  = sname || '';
17     this.age = sage || 18;
18 }
19 
20 Sprite.prototype = {
21     sayHi: function() {
22 
23     },
24     init: function() {
25 
26     }
27 };
28 
29 //問題： 1、調用者如果傳遞參數的順序發生變化，那麼廢了
30 //問題： 2、 參數增減都會導緻函數聲明變化，調用的地方也可能發生變化。
31 //如何解決：繼續更新
32 function Sprite( option ) {  //我用一個對象把所有參數覆寫。靈活性就很強了。
33                              //順序無所謂，添加參數也無所謂了。
34     this.name  = option.name || '';
35     this.age = option.sage || 18;
36 }
37 
38 Sprite.prototype = {
39     sayHi: function() {
40 
41     },
42     init: function() {
43 
44     }
45 };
46 
47 //繼續優化，把初始化的代碼 放到init函數中
48 function Sprite( option ) {  //我用一個對象把所有參數覆寫。靈活性就很強了。
49                              //順序無所謂，添加參數也無所謂了。
50     this.init( option );
51 }
52 Sprite.prototype = {
53     sayHi: function() {
54 
55     },
56     init: function( option ) {
57         this.name  = option.sname || '';
58         this.age = option.sage || 18;
59     }
60 };