美文网首页
创建对象常见的几种方式

创建对象常见的几种方式

作者: _MEmeNTO_ | 来源:发表于2019-03-13 16:45 被阅读0次

工厂模式

function createPerson (name, age) {
  var o = new Object()
  o.name = name
  o.age = age
  o.sayName = function () {
    alert(this.name)
  }
  return o
}

var p1 = createPerson('Joey', 19)
var p2 = createPerson('Denise', 22)

缺点:没解决对象指向问题(结合下面构造函数模式就明白了)

构造函数模式

// 构造函数常用大写开头
function Person (name, age) {
  this.name = name
  this.age = age
  this.sayName = function () {
    alert(this.name)
  }
}

var p1 = new Person('Joey', 19)
var p2 = new Person('Denise', 22)

// 实例的constructor指向它的构造函数,这一块与原型链相关 https://www.jianshu.com/p/33f6409d89e6
console.log(p1.constructor) // Person
console.log(p2.constructor) // Person

console.log(p1 instanceof Person) // true
console.log(p1 instanceof Object) // true
console.log(p2 instanceof Person) // true
console.log(p2 instanceof Object) // true

除了使用 new 之外,构造函数也是普通的函数,还可以用以下方法调用:

1.当作普通函数调用
此举作用域是在window,相当于把函数里的属性和方法都添加到window了,在严格模式会报错

Person('Nicole', 19)
console.log(window.name) // Nicole
console.log(window.age) // 19
window.sayName() // Nicole

2.在另一个对象的作用域调用

var o = new Object()
Person.call(o, 'Nicole', 19)
console.log(o.name) // Nicole
console.log(o.age) // 19
o.sayName() // Nicole

缺点:每个方法都要在实例中重新创建一边,p1和p2就各自有一个同名的方法 sayName,创建两个实现同样功能的方法似乎不符合经济原则

console.log(p1.sayName === p2.sayName) // false

原型模式

function Person (name, age) {
}
Person.prototype.name = 'Nicole'
Person.prototype.name = 21
Person.prototype.sayName = function () {
  alert(this.name)
}

缺点:里面所有属性和方法都是共享的,不符合实际使用场景

构造函数&原型模式组合

function Person (name, age) {
  this.name = name
  this.age = age
  this.friends = ['Denise', 'Hins']
}
Person.prototype = {
  constructor: Person,
  sayName: function () {
    alert(this.name)
  }
}
var p1 = new Person('Joey', 19)
var p2 = new Person('Joey', 19)

p1.friends.push('wyman')
console.log(p1.friends) // ["Denise", "Hins", "wyman"]
console.log(p2.friends) // ["Denise", "Hins"]

console.log(p1.sayName === p2.sayName) // true

构造函数也原型的混杂,是被业界共同认同的一种模式

动态原型模式

function Person (name, age) {
  this.name = name
  this.age = age
  this.friends = ['Denise', 'Hins']
  // if 语句检查的可以是初始化初始化之后应该存在的属性和方法
  if (typeof this.name !== 'function') {
    Person.prototype.sayName = function () {
      alert(this.name)
    }
  }
}
console.log(Person.constructor)
var p1 = new Person('Joey', 19)
var p2 = new Person('Hocc', 19)

p1.friends.push('wyman')
console.log(p1.friends) // ["Denise", "Hins", "wyman"]
console.log(p2.friends) // ["Denise", "Hins"]

console.log(p1.sayName === p2.sayName) // true

相关文章

  • 创建对象常见的几种方式

    工厂模式 缺点:没解决对象指向问题(结合下面构造函数模式就明白了) 构造函数模式 除了使用 new 之外,构造函数...

  • Java对象创建与内存分布

    本文主要讲述Java对象在虚拟机中创建,分配内存,初始化的过程,以及分配内存,引用对象的几种常见方式。 对象创建 ...

  • 字面量方式及内置构造函数创建对象

    创建对象的几种方式 字面量方式创建对象 基本写法 ①字面量的方式来创建对象示例 存在的问题 [01] 代码复用性差...

  • 16、Java创建对象有几种方式?

    Java创建对象有几种方式? java中提供了以下四种创建对象的方式: 1、new创建新对象; 2、通过反射机制;...

  • 继承

    继承有什么作用? (难度:3*) 继承可以使一个对象直接使用另一个对象的属性和方法。 有几种常见创建对象的方式? ...

  • 创建对象的几种方式

    字面量方式和Object构造函数方式创建对象 优点: 方便缺点: 当需要创建很对对象的时候,会有很多重复的代码 工...

  • 创建对象的几种方式

    第一种:对象字面量的方式 第二种:创建Object实例: 第三种:数构造函数无参数构造函数 带参数的构造函数 第四...

  • 创建对象的几种方式

    真是百看不如一练啊 /*var box= new Object(); //创建一个对象 box.name= "xi...

  • 创建对象的几种方式

    字面量创建对象 new Object() 创建对象 工厂模式 构造函数 原型 混合

  • 创建对象的几种方式

    字面量式(最常用) 调用系统的Object构造函数,创建实例对象 工厂模式 构造函数模式 与工厂模式的区别: 没有...

网友评论

      本文标题:创建对象常见的几种方式

      本文链接:https://www.haomeiwen.com/subject/wwxzpqtx.html