zoukankan      html  css  js  c++  java
  • js中创建对象的几种方式

    1、利用JavaScript 原生提供Object对象,即所谓的原始模式

    var person = new Object();//JavaScript 原生提供Object对象,JavaScript 的所有其他对象都继承自Object对象,即那些对象都是Object的实例。
    person.name = 'zhangsan';//动态的创建属性
    person.age = 23;
    person.sayNmae = function(){//动态的创建方法
        console.log(this.name)
    }

    2、json格式的方式,其实就是上面的简便写法

    var person = {};//这接创建一个空的对象
    person.name = 'zhangsan';//动态的创建属性
    person.age = 23;
    person.sayNmae = function(){  //动态的创建方法
        console.log(this.name)
    }
    

    3、工厂模式

    所谓的工厂模式就是用函将 原始模式进行了封装

    function createPerson(name,age){
          var v = new Object();
          v.name = name;
          v.age = age;
          v.sayName = function(){
               console.log(this.name);
          };
          return v;
    }    
    
    
    var person1 = createPerson('zhansan',22);
    var person2 = createPerson('wangwu',38);

    //上面的方式虽然可以提高代码的复用率,但和面向对象中类的概念相比有一个很大的缺陷。面 

    //相对象强调对象的属性私有,而对象的方法是共享的。而上面的工厂方法创建对象的时候要为每个 

    //对象创建各自私有的方法。同时由于为每个对象都创建逻辑相同的方法,浪费内存

    4、构造函数模式

    所谓”构造函数”,就是专门用来生成实例对象的函数。(它就是对象的模板,描述实例对象的基本结构。一个构造函数,可以生成多个实例对象,这些实例对象都有相同的结构。)

    function Person (name,age){
          this.name = name;
          this.age = age;
          this.sayNmae = function(){
              console.log(this.name)
          }   
    }
    
    var person1 = new Preson('zhangsan',23);
    var person2 = new Person('lisi,25);

    //构造函数的方式和工厂方式一样,会为每个对象创建独享的函数对象。当然也可以将这些函数 

    //对象定义在构造函数外面,这样又有了对象和方法相互独立的问题

      上面代码中,Person 就是构造函数。为了与普通函数区别,构造函数名字的第一个字母通常大写。

    构造函数的特点有两个。

    • 函数体内部使用了this关键字,代表了所要生成的对象实例。
    • 生成对象的时候,必须使用new命令。

      其中new命令的作用,就是执行构造函数,返回一个实例对象。

    5、原型模式

    利用的对象的prototype属性

     
    script type="text/javascript"> 
    
    function Person(){} //定义一个空构造函数,且不能传递参数 
    
    //将所有的属性的方法都赋予prototype属性 
    
    Person.prototype.name = "Koji"; //添加属性 
    Person.prototype.age = 22; 
    
    Person.prototype.showName = function(){ //添加方法 
    alert(this.name); 
    } 
    
    Person.prototype.showAge = function(){ 
    alert(this.age); 
    } 
    
    var obj1 = new Person(); //生成一个Person对象 
    var obj2 = new Person(); 
    
    obj1.showName(); //Koji 
    obj1.showAge(); //22 
    obj2.showName(); //Koji 
    obj2.showAge(); //22 
    
    </script> 
    

      

    6、混合模式即构造函数/原型方式 

     
    <script type="text/javascript"> 
    
    function Person(name, age) { 
    this.name = name; 
    this.age = age; 
    this.array = new Array("Koji", "Luo"); 
    } 
    
    Person.prototype.showName = function() { 
    alert(this.name); 
    } 
    
    Person.prototype.showArray = function() { 
    alert(this.array); 
    } 
    
    var obj1 = new Person("Koji", 22); //生成一个Person对象 
    var obj2 = new Person("Luo", 21); 
    
    obj1.array.push("Kyo"); //向obj1的array属性添加一个元素 
    
    obj1.showArray(); //Koji,Luo,Kyo 
    obj1.showName(); //Koji 
    obj2.showArray(); //Koji,Luo 
    obj2.showName(); //Luo 
    
    </script> 

    //使用构造函数定义对象的属性,使用原型(prototype)定义对象的方法,这样就可以做到属性 

    //私有,而方法共享。

      

  • 相关阅读:
    VPS服务器 基本配置
    WCF 系列 → HelloWord
    ASP.NET MVC3 常用整理
    ASP.NET MVC3 过滤器 Filter
    NVelocity系列 → NVelocity配置详解
    网站安全检测 Web 安全测试工具
    ASP.NET MVC3.0 静态化实现
    CSS3的动画泡沫按钮
    SQL 大数据优化
    用友备份失败,超时己过期
  • 原文地址:https://www.cnblogs.com/xuwupiaomiao/p/12775811.html
Copyright © 2011-2022 走看看