zoukankan      html  css  js  c++  java
  • js---OOP浅谈

    对象化编程-------简单地去理解就是把javascript能涉及到的范围分成各种对象,对象下面再次划分对象。编程出发点多是对象,或者说基于对象。所说的对象既包含变量,网页,窗口等等
     
    对象的含义
              对象可以是文字,表单等等。对象包含一下
    属性-------对象的某些特定的性质
    方法-------对象能做的事情
    事件-------能响应发生在对象上的事情
         注意:对象只是一种特殊的数据

         2.  基本对象
            
             我们一般划分的角度还是从数据类型这方面
    Number
    String
    Array
    Math
    Data  
    这边我只是简单地罗列出来部分,具体的可以参考http://www.w3school.com.cn/js/js_obj_intro.asp
     
    不过我这边还是想讲一下比较流行的一道前端面试题,也是我当初来百度面试的时候问我的(题目的来源好像是方荣大侠的某个web前端研发工程师编程能力成长之路的文档里面的)
    废话少说

    出题:
                           “输出字符串--今天是星期几”

     

    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.
    下面介绍创建类和对象的模式
    简单方式
            

    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 
    

      


    不好的地方就是:在创建多个对象的场景下会产生 很多冗余的代码,耦合度不高 
     

    工厂模式下

    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)下

    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代码 
    不好的地方就是:初始化参数不支持传递,还有就是原型的所有属性和方法会被所有的实例共享 

    混合模式(原型+构造函数)下
     
     
     

    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代码 
    不好的地方就是:对象的属性和方法也多是公用的 
     
     
    闭包下的私有变量模式

    (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代码 
    不好的地方就是:初级程度代码不是很让人理解 

    转载自: 作者“zhangyaochun”

  • 相关阅读:
    240. Search a 2D Matrix II
    239. Sliding Window Maximum
    238. Product of Array Except Self
    237. Delete Node in a Linked List
    SCR文件的关联被AutoCAD所取代的解决办法
    香草世界
    write something
    ArcGIS 网络分析[2.3] 最近设施点
    ArcGIS 网络分析[2.2] 服务区分析
    ArcGIS 网络分析[2.1] 最短路径
  • 原文地址:https://www.cnblogs.com/yahue/p/3631994.html
Copyright © 2011-2022 走看看