【JS第21期】设计模式-构造函数模式

构造函数模式是通过函数创建对象，在函数中自定义对象的属性和方法，通过new 关键字实例化。此外，需注意下函数名一般为首字母大写，这种写法借鉴了其他oo语言，为了区别其他普通函数；因为构造函数本身也是函数，只不过是通过它来创建对象而已。如下创建一个基于构造函数的对象：

function Persion(name, age, job) {
  this.name = name;
  this.age = age;
  this.job = job;
  this.sayName = function() {
    console.log(this.name)
  }
}
var persion1 = new Persion('bill', 27, 'seo');
var persion2 = new Persion('bill2', 30, 'oa');
复制代码

像上实例中调用构造函数实际上经过以下4步：

1. 创建一个新对象
2. 将构造函数的作用域赋给新对象（this指向这个新对象）
3. 执行构造函数中的代码（为新对象添加属性和方法）
4. 返回新对象

上例中存在两个实例对象分别是persion1和persion2,这两个对象的constructor属性指向Persion

构造函数与普通函数的区别

主要区别在于两则的调用方式不一样。如：

// 构造函数调用
var persion = new Persion('bill3', 33, 'qa');
persion.sayName() // bill3

// 普通函数调用
Persion('bill3', 33, 'qa');
window.sayName() // bill3;
复制代码

上例中，普通函数Persion调用时，this指向global对象，global对象在浏览器中指向window对象，所以可以通过window.sayName调用

构造函数的问题

构造函数的问题时每次实例化一个新的对象时，都会重新创建新的属性和方法，如上例中persion1和persion2对象都有sayName()方法，这两个方法完全一样，但被重复创建了，我们可以通过persion1.sayName 和 persion2.sayName 进行比较，返回为false，所以在使用构造函数模式时需要注意这点问题。

如有侵权，请发邮箱至wk_daxiangmubu@163.com 或留言，本人会在第一时间与您联系，谢谢！！

长按二维码关注我们，了解最新前端资讯