zoukankan      html  css  js  c++  java
  • javascript面向对象

    javascript面向对象

    对象其实就是一种引用类型。而对象的值就是引用类型的实例。在JavaScript 中引用类型是一种数据结构,将数据和功能组织在一起。它也常被称做为类,但JavaScript 中却没有类的概念。

    虽然JavaScript 是一门面向对象的语言,却不具备传统面向对象语言所支持的类和接口等基本结构。

    对象的创建以及常用操作

    1.  使用new运算符

    var user = new Object();        //使用new运算符创建一个对象
    user.name = '编程浪子';        //给对象添加属性
    user.age = 22;
    user.address = '四川成都';  

    2.  对象字面量(JSON方式)

    var user = {
        name:'编程浪子',
        age:22,
        address:'四川成都'    
    };  

    3.  简单方式(传统赋值方式)

    var user = {};
    user.name = '编程浪子';        //给对象添加属性
    user.age = 22;
    user.address = '四川成都';
     

    4.  属性的调用

       对于对象属性的调用有两种方式:

       调用方法如下:

    alert(user.name + " " +user.age);//返回 '编程浪子 四川成都

       另一种方法:

     alert(user['name'] + " " +user['age']);//返回 '编程浪子 四川成都'

    5.  添加方法 

    var user = {
    
        name:'编程浪子', //给对象添加属性 
    
        age:22,
    
        address:'四川成都', 
    
       showInfo:function(){
    
          //添加一个方法 
    
          alert(this.name+" "+this.age+" "+this.address); 
    
       }, 
    
    showHello:showHello
    
    //将对象外部的方法添加到对象
    
    }; 
    
    function showHello(){ 
    
        alert("Hello!"); 
    }
    
       user.showInfo();//调用方法 
    
       user.showHello();

    工厂模式

      

     function create(name, age) {
    
        var obj = new Object(); 
    
        obj.name = name; 
    
        obj.age = age;
    
        obj.show = function () {
    
        return this.name +' '+ this.age;
    
        };
    
       return obj;
      }
    
      var obj1= create('bclz', 30);    //第一个实例
    
      var obj2= create('bcxb', 20);    //第二个实例
    
      alert(obj1.show());
    
      alert(obj2.show());  

     工厂模式虽然解决了实例化时代码大量重复的问题,但又出现了一个问题,那就是识别问题,我们根本无法弄清楚他们到底是哪个对象的实例。

    构造函数(构造方法)

    使用构造函数的方法,即解决了重复实例化的问题,又能解决了对象识别的问题。

    例如:

              构造函数模式                         

    function User(name, age) {    //构造函数模式
             this.name = name;
             this.age = age;
             this.show = function () {
              return this.name  + ' '+this.age;
             };
            } 

    创建对象
     var user1 = new User('bclz', 30);    //第一个实例
           var user2 = new User('bcxb', 20);    //第二个实例
     

    要创建User对象的新实例,就要使用new操作符,使用这个方式构建实例对象,会经过下面4个步骤:

    1.创建一个新对象;

    2.将构造函数的作用域给新对象(因此this指向的这个新对象)。

    3.执行构造函数内的代码在(为新对象添加属性);

    4.返回新对象;

    需要注意下面两个问题:

    1.  构造函数也是函数

        构造函数与函数的唯一区别,就是调用方式的不同,不过,构造函数毕竟也是函数,不存在什么特殊的定义构造函数的语法。

        任何函数,只要通过new操作符来调用,就可以把它看作是构造函数;

       而任何函数,如果不通过new操作符调用,它就和普通函数没有什么区别。

    当作构造函数调用
    var user1 = new User('bclz', 30);  
    user1.show(); //bclz 30;
    
    当作普通函数调用
    User('bclz', 30);
    window.show(); //bclz 30; 


    虽然这两种方法的结果是一样的,但它们的指向却是不同的,普通函数调用指向的是window全局变量,而构造函数调用指向的则是一个新对象。
    所以,还可以换种写法:
    var o = new Object();
    User.call(o,'bclz', 30);
    o.show();  
     

    2. 构造函数的问题

    构造函数的模式虽然好,但是并非没有缺点。构造函数最大的问题就是,每个方法都要在实例上重新创建一次。
    如果我们同样重复创建了多个对象,那么每个对象中的方法都会在内存中开辟新的空间,这样浪费的空间就比较多。
    要解决这个问题,我们就需要用到实例属性或者方法的共享。

    我们可以使用一种变通的方式,来达到我们想要的效果,也就是让show方法不再重复创建
    function User(name, age) {    
      this.name = name;
      this.age = age;
      this.show = show;
    } 
    function show(){
        alert(this.name + ' ' + this.age);
    }  
    将show方法移到外部,相当于show方法成了一个全局函数,然后再到User构造函数内部去引用show方法,这样User内部的this.show都指向了同一个全局函数show,
    因此,我们实例化的user1和user2就实现了共享,可以再次调用:
    alert(user1.show==user2.show);//结果返回的是true  
    但是这只是一个测试,如果你要让更多的属性或者方法实现共享,那不是要定义更多的全局函数或者变量,这种方式是不科学也不可行的。因此,我们需要引入另外一个javascript面向对象的重要概念原型

        

     
  • 相关阅读:
    Best Time to Buy and Sell Stock III
    Valid Palindrome
    Longest Substring Without Repeating Characters
    Copy List with Random Pointer
    Add Two Numbers
    Recover Binary Search Tree
    Anagrams
    ZigZag Conversion
    Merge k Sorted Lists
    Distinct Subsequences
  • 原文地址:https://www.cnblogs.com/zouyajun/p/4090503.html
Copyright © 2011-2022 走看看