javascript对象---9 对象的创建模式
javascript对象---9 对象的创建模式
奋斗的小芋头 发表于1年前
javascript对象---9 对象的创建模式
  • 发表于 1年前
  • 阅读 3
  • 收藏 1
  • 点赞 0
  • 评论 0

【腾讯云】新注册用户域名抢购1元起>>>   

摘要: 一.工厂模式 二.构造函数模式

对象的创建模式分类

一.工厂模式

1.工厂固定生产一种或几种商品   工厂模式的使用场景 ---对象内部属性值基本一致----》

function Product( proName, Pinpai , createDate){
                
            }
            //创建多个商品对象,除了变量名不同,具有相对独立的内存空间-----商品名称、品牌相同,出产日期不同
            //不同的对象包含相同的属性,造成代码量增多

            var pro1 = new Product("酸奶","哇哈哈","2016-11-27");
            var pro2 = new Product("酸奶","哇哈哈","2016-11-27");
            var pro3 = new Product("酸奶","哇哈哈","2016-11-27");

所以使用工厂模式,对工厂赋值即可

2.工厂模式特点

工厂模式,对创建对象进行了封装,自动组装对象的内部属性

工厂模式,一般用于构建内存内容相似的对象

<script>

        //创建一个商品类----包含商品应有信息
            function
Product( proName, Pinpai , createDate){
                this.proName = proName;
                this.Pinpai = Pinpai
                this.createDate =createDate;
            }
          
 //定义一个产品工厂,为商品信息赋值
            function ProductFactory(){
            
            }
          
 //扩展产品工厂属性
            ProductFactory.proName = "酸奶";
            ProductFactory.Pinpai = "娃哈哈";
            //扩展一个方法
         
   //生产日期不同,用执行一个Date()方式的构造函数
            ProductFactory.createProduct = function(){
                var pro = new Product( ProductFactory.proName, ProductFactory.Pinpai,
new Date() );
                return pro;
            }
            
            var pro1 = new Product("酸奶","娃哈哈","2016-11-28");  //普通创建对象方式
          
 var pro2 = ProductFactory.createProduct();  //工厂创建对象方式
            
            console.log(pro1.proName);
            console.log(pro2.createDate); 
        </script>

二.构造函数模式

构造函数模式:使用构造函数创建对象实例

function Person(name,age){

     //属性
            this.name=name;    //这里this只 window
            this.age=age;

//行为
            this.sayHello = function(){
            console.log("你好,我是" + this.name);
            }
        }


      //person 对象也具有name age属性  

      //通过构造函数创建对象
        var person1 = new Person("Davi",19);

         var person2 = new Person("MIL",20);
        person1.sayHello()

构造函数执行优点:在创建对象同时,就可以给当前对象进行属性赋值

缺点:每次创建对象,都会执行赋值---资源浪费

创建第一个对象,创建一个  function 然后赋值给 run,

创建第二个对象还要创建一个run方法,创建两次函数,但执行的动作相同

每次创建对象,

3.原型模式---原型链构造方式

原型模式:将属性和方法放到构造函数的 prototype  对象中。只要创建当前构造函数的对象,对象本身就具备当前构造函数的原型对象内的方法、属性----使多个对象拥有相同的属性方法。

 

//原型链构造函数
        function Person(){
            
        }
        Person.prototype.run = function(){
            console.log("快速跑");
        }
        var person1 = new Person(); 
        var person2 = new Person(); 
        person1.run();
        person2.run();
        //person1 person2 都共有 Person的原型对象中的方法

缺点:没有办法进行赋值想赋值只能

person1.name ="zhangsan"; 

person1.age =19  -----------------增加额外编码  而且不知道Person内的属性。

1.单纯使用原型链完成对象创建,无法对对象属性进行赋值

2.无法保证每个对象的 属性名 相同

所以要进行第二种第三种整合方式

4.构造原型组合模式  --最好的方式

构造原型组合模式:使用 构造函数 原型模式 组合完成对象创建。构造函数完成基本属性的赋值,原型完成对象函数的绑定

//对象原型组合模式
        //通过构造函数 初始化对象,并赋值
        function Person( name, age){
            this.name=name;
            this.age=age;
        }
        //sayHello 等于一个匿名函数
        Person.prototype.sayHello = function(){
            console.log("名字:"+ this.name);     //this代表当前对象 Person
        }
        //在构建对象同时进行赋值
        var person1 = new Person( "Adad",18);      //person1 引用 Person
        var person2 = new Person( "Mada",18); 
        person1.sayHello();                          //谁调用 this就是谁 this为 person1
        person2.sayHello();

 

 

  • 打赏
  • 点赞
  • 收藏
  • 分享
共有 人打赏支持
粉丝 1
博文 79
码字总数 129412
×
奋斗的小芋头
如果觉得我的文章对您有用,请随意打赏。您的支持将鼓励我继续创作!
* 金额(元)
¥1 ¥5 ¥10 ¥20 其他金额
打赏人
留言
* 支付类型
微信扫码支付
打赏金额:
已支付成功
打赏金额: