让前端飞

简单对象创建模式

2019-11-27  本文已影响0人  誩先生

方式1:

Object构造函数模式

形式:先创建一个空的Object对象,然后动态的给其添加属性或者方法
常用的场景:一开始并不确定对象内部的数据
缺点:给其添加的语句会很多
例如:

var obj = new Object()
    obj.name ="张三"
    obj.age = 22
    //这个函数可以自由修改年龄
    obj.setAge = function(age){
          this.age = age
    }
     obj.setAge("参值")

方法2:

对象字面量模式

形式:先使用{ }创建一个对象,然后指定属性或者方法
常用的场景:一开始确定对象内部的数据
缺点:在创建多个对象时,代码量重复多
例如:

var obj = {
    name = "张三",
    age = 22,
    setName:function(name){
        this.name = name
    } 
  }
//调用其中的函数
    obj.setName("参值")

方法3:

工厂模式

形式:通过创建函数动态创建对象返回,这个函数可称为工厂函数
常用的场景:需要创建多个对象的时候
缺点:对象创建的都是一个类型的,都是objcet类型,同时创建的对象内置参数都过于死板
例如:

function createPerson(name,age){
    //形参都是自己需要什么什么自己创建
   var obj = {
    name:name,
    age:age,
    setName:function(name){
         this.name = name
    }
  }
//最后的返回值肯定是一个对象
  return obj
}
//工厂函数创建完毕,开始创建具体对象
var  p1 = createPerson("张三",20)
var  p2 = createPerson("李四",22)
//这时两个对象创建完毕,比起之前的代码量明显减少,但是这两个对象的类型都是一样的

方法4:

自定义构造函数模式

形式:通过自定义构造函数,然后通过new创建对象
常用的场景:需要创建多个类型确定的对象时候
缺点:每个对象都有相同的数据,浪费内存
例如:

//创建自定义构建函数
 function Person(name,age){
        this.name = name
        this.age = age
        this.setName = function(name){
             this.name = name
        }
    }
//创建自定义对象
  var p = new Person("张三",20)
  var p1 = new Person("李四",22)
//调用自定义函数中的函数也和之前的差不多
    p.setName('修改的名字参值')

方法5:

构造函数+原型的组合模式

形式:通过自定义构造函数,属性在函数中初始化,其中的方法添加到原型上
常用的场景:需要创建多个类型确定的对象时候
例如:

//创建自定义构建函数
 function Person(name,age){
        this.name = name
        this.age = age
    }

//将方法添加到原型中
Person.prototype.setName = function(name){
             this.name = name
        }
//创建对象
  var p = new Person("张三",20)
  var p1 = new Person("李四",22)
上一篇下一篇

猜你喜欢

热点阅读