JavaScript工厂模式创建对象和自定义构造函数的区别

工厂模式

【1】定义

工厂模式是一种软件工程领域一种广为人知的设计模式，这种模式抽象了创建对象的过程，因为ECMAScript无法穿类，所以开发人员就发明一个函数，用函数来封装以特定的接口创建对象。简单理解：通过函数封装对象，并通过调用函数来调用封装的对象。通过调用多次函数从而创建多次不同的对象。

【2】代码

工厂模式有返回值，因为通过调用函数会把把函数返回值（这里就是函数封装的对象obj）给返回，然后我们通过声明一个变量person1去接收，此时变量person1里面存的就是对象，然后通过对象调用属性与方法，如果没有返回值就会报错。

 function person(name, age) {
  let obj = new Object();
  obj.name = name;
  obj.age = age;
  obj.sayHi = function () {
    console.log("您好");
  };
  return obj;
}
let person1 = person("Demi", 18) 
console.log(person1.name) // Demi
console.log(person1.age) // 18
person1.sayHi() // 您好

构造函数

【1】定义

构造函数，是一种特殊的方法。主要用来在创建对象时初始化对象，即为对象成员变量赋初始值，总与new运算符一起使用在创建对象的语句中。特别的一个类可以有多个构造函数，可根据其参数个数的不同或参数类型的不同来区分它们，即构造函数的重载。在 JavaScript 中，用 new 关键字来调用的函数，称为构造函数。构造函数首字母一般大写

【2】代码

构造函数的首字母必须大写（这里的构造函数是Person），用来区分于普通函数，内部使用的this对象，来指向即将要生成的实例对象，使用New来生成实例对象

function Person(name, age) {
  this.name = name;
  this.age = age;
  this.sayHi = function () {
    console.log("您好");
  };
}
let person2 = new Person("dingFY", 20);
console.log(person2.name) // dingFY
console.log(person2.age) // 20
person2.sayHi() // 您好

new实例化过程

通过上面代码比较，我们会发现工厂模式创建了一个空对象obj，并且返回了这个对象，但是构造函数没有这一步，那是因为new实例化对象已经帮我们做了以下操作

创建一个空对象 obj;
将新创建的空对象的隐式原型指向其构造函数的显示原型。
使用 call 改变 this 的指向
如果无返回值或者返回一个非对象值，则将 obj 返回作为新对象；如果返回值是一个新对象的话那么直接直接返回该对象。

let person2 = new Person("dingFY", 20);

// new Person() 实例化过程
new Person("dingFY", 20) {
  var obj = {};
  obj.__proto__ = Person.prototype;
  var result = Person.call(obj, "dingFY", 20);
  return typeof result === 'obj' ? result : obj;
}

区别总结

共同点：都是函数，都可以创建对象，都可以传入参数

不同点：

工厂模式：

函数名是小写

有new

有返回值

new之后的对象是当前的对象

直接调用函数就可以创建对象

自定义构造函数：

函数名是大写(首字母)

没有new

没有返回值

this是当前的对象

通过new的方式来创建对象

文章每周持续更新，可以微信搜索「 前端大集锦 」第一时间阅读，回复【视频】【书籍】领取200G视频资料和30本PDF书籍资料