js---OOP淺談

js---OOP淺談

對象化編程-------簡單地去理解就是把javascript能涉及到的範圍分紅各類對象，對象下面再次劃分對象。編程出發點可能是對象，或者說基於對象。所說的對象既包含變量，網頁，窗口等等
 
對象的含義
          對象能夠是文字，表單等等。對象包含一下
屬性-------對象的某些特定的性質
方法-------對象能作的事情
事件-------能響應發生在對象上的事情
     注意：對象只是一種特殊的數據

     2.  基本對象
        
         咱們通常劃分的角度仍是從數據類型這方面
Number
String
Array
Math
Data  
這邊我只是簡單地羅列出來部分，具體的能夠參考http://www.w3school.com.cn/js/js_obj_intro.asp
 
不過我這邊仍是想講一下比較流行的一道前端面試題，也是我當初來百度面試的時候問個人（題目的來源好像是方榮大俠的某個web前端研發工程師編程能力成長之路的文檔裏面的）
廢話少說

出題：
                       「輸出字符串--今天是星期幾」

 

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50

var _str = "" ; var _today = new Date().getDay(); if (_today == 0){     _str = "今天是星期日" ； } else if (_today  == 1){    _str = "今天是星期一" ； } else if (_today  == 2){    _str = "今天是星期二" ； } else if (_today  == 3){    _str = "今天是星期三" ； } else if (_today  == 4){    _str = "今天是星期四" ； } else if (_today  == 5){    _str = "今天是星期五" ； } else if (_today  == 6){    _str = "今天是星期六" ； }         var _str = "今天是星期" ;   var _today= new Date().getDay(); switch (_today){        case 0:             _str += "日" ；             break ;        case 1:             _str += "一" ；             break ;        case 2:             _str += "二" ；             break ;        case 3:             _str += "三" ；             break ;        case 4:             _str += "四" ；             break ;        case 5:             _str += "五" ；             break ;        case 6:             _str += "六" ；             break ;     }     var _str = "今天是星期" + "日一二三四五六" .charAt( new Date().getDay());

　　

 3.
下面介紹建立類和對象的模式
簡單方式
        

1 2 3 4 5 6 7 8 9

var people ={}; Js代碼        people.name = "steven" ;        people.age = 23;        people.getName = function (){             return "People's name is " + this .name;       }; console.log(people.getName());          //People's name is steven console.log(people.age);                    //23

　　

很差的地方就是：在建立多個對象的場景下會產生 不少冗餘的代碼，耦合度不高 
 

工廠模式下

1 2 3 4 5 6 7 8 9 10 11 12 13 14

function makePeople(name,age,job){       var _obj = {};       _obj.name = name;       _obj.age =age;       _obj.job = job;      _obj.getName = function (){          return "People's name is " + this .name;     }       return _obj; }     var webdesigner = makePeople( "steven" ,23, "wendesigner" ); console.log(webdesigner.getName );       //People's name is steven console.log(webdesigner.job)                //wendesigner

　　

 

Js代碼 
很差的地方就是：實例化比較頻繁 

原型模式（prototype）下

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15

function People(){}; People.prototype = {         constructor :People,         name: "steven" ,         age:23,         job: "webdesigner" ,         getName: function (){               return "People's name is " + this .name;        } }     var webdesign = new People(); var carman = new People(); console.log(webdesign.getName());    //People's name is steven console.log(carman.getName());    //People's name is steven

　　

 
Js代碼 
很差的地方就是：初始化參數不支持傳遞，還有就是原型的全部屬性和方法會被全部的實例共享 

混合模式（原型+構造函數）下
 
 
 

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18

function People(name.age.job){ Js代碼 this .name = name; Js代碼         this .age = age;         this .job = job; }; People.prototype = {        constructor:People,        getName: function (){             return "People's name is " + this .name;        } }     var webdesigner  = new People( "steven" ,23, "webdesigner" ); var carman = new People( "zyc" ,24, "carman" ); console.log(webdesigner.getName())   //People's name is steven console.log(carman.getName())   //People's name is zyc

　　

 
Js代碼 
很差的地方就是:對象的屬性和方法也可能是公用的 
 
 
閉包下的私有變量模式

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22

( function (){      var name = "" ;      People = function (val){          name = val;     };      People.prototype ={         constructor:People,         getName: function (){                return "People's name is " + name ;        }     }; })();         var webdesigner = new People( "steven" ); console.log(webdesigner.name);           //undefined console.log(webdesigner.getName());      //People's name is steven     var carman= new People( "zyc" ); console.log(carman.name);           //undefined console.log(carman.getName());      //People's name is zyc

　　

Js代碼 很差的地方就是:初級程度代碼不是很讓人理解