Javascript将构造函数扩展为简单工厂

一般而言，在Javascript中创建对象时需要使用关键字new（按构造函数去调用），但是某些时候，开发者希望无论new关键字有没有被显式使用，构造函数都可以被正常调用，即构造函数同时还具备简单工厂的职能。Javascript的一个特性使得这种『简单工厂式的构造函数』变得可行：如果构造函数中返回了对象，无论有没有使用new关键字，最终返回的值都是函数return的值。

基于这点特性，本文介绍了四种实现方式，抛砖引玉，欢迎拍砖~

1. 在构造函数中返回对象字面量

 1 function Person(name) {
 2     return {
 3         name: name,
 4         getName: function () {
 5             return this.name;
 6         }
 7     };
 8 }
 9 console.log(new Person('Ralph').getName()); //Ralph
10 console.log(Person('Ralph').getName()); //Ralph

缺点：
不方便控制prototype属性，不利于高效扩展对象方法，instanceof操作符失效且constructor属性丢失

2. 在构造函数中使用内部函数构造对象

 1 function Person(name) {
 2     // lazy loading，在Person函数第一次被调用时初始化内部函数_Person
 3     if (!Person.inited) {
 4         Person._Person = function (name) {
 5             this.name = name;
 6         };
 7         // 可以利用prototype进行方法扩展
 8         Person._Person.prototype = {
 9             // 正常使用constructor属性
10             constructor: Person,
11             getName: function () {
12                 return this.name;
13             }
14         };
15         // 可以正常使用instanceof操作符
16         Person.prototype = Person._Person.prototype;
17         // 标记为已初始化
18         Person.inited = true;
19     }
20     return new Person._Person(name);
21 }
22 console.log(new Person('Ralph').getName()); //Ralph
23 console.log(Person('Ralph').getName()); //Ralph

缺点：
编码相对较为复杂，需要_Person作为辅助的内部构造函数，且需要手动修改prototype和constructor等属性

3. 利用instanceof操作符

 1 function Person(name) {
 2     // 如果使用了new，this指向新生成的Person实例
 3     // 如果直接调用Person没有使用new，这里的this指向window对象
 4     if (!(this instanceof Person)) {
 5         return new Person(name);
 6     }
 7     this.name = name;
 8 }
 9 Person.prototype.getName = function () {
10     return this.name;
11 };
12 console.log(new Person('Ralph').getName()); //Ralph
13 console.log(Person('Ralph').getName()); //Ralph

缺点：
在判断this instanceof Person时需要指明构造函数名称Person，抽象程度不够高，修改构造函数名称时需要手动修改该语句

4. 利用callee属性和constructor属性

 1 function Person(name) {
 2     // arguments.callee指向Person函数
 3     // this.constructor仅在使用了new的情形下指向Person函数
 4     if (arguments.callee !== this.constructor) {
 5         return new arguments.callee(name);
 6     }
 7     this.name = name;
 8 }
 9 Person.prototype.getName = function () {
10     return this.name;
11 };
12 console.log(new Person('Ralph').getName()); //Ralph
13 console.log(Person('Ralph').getName()); //Ralph

缺点：
strict模式下无法使用callee属性

（全文完）

转载于:https://www.cnblogs.com/front-end-ralph/p/4868107.html

Javascript将构造函数扩展为简单工厂相关推荐

JavaScript设计模式（一）-- 简单工厂模式
定义简单工厂模式:又叫静态工厂方法,由一个工厂对象决定创建某一种产品对象类的实例.主要用来创建同一类对象. 如果类太多,就提供一个对于多个类,在每次创建时还要找相对应的类.为此,直接封装在一个函数 ...
JavaScript设计模式--简单工厂模式例子---XHR工厂
JavaScript设计模式--简单工厂模式例子---XHR工厂第一步,Ajax操作接口(目的是起一个接口检测作用) (1)引入接口文件 //定义一个静态方法来实现接口与实现类的直接检验 //静态方 ...
JavaScript --- [学习笔记]观察者模式理解对象工厂模式构造函数模式
说明本系列(JS基础梳理)为后面TCP的模拟实现做准备本篇的主要内容: 观察者模式.工厂模式.构造函数模式和对对象的理解 1. 观察者模式参考JavaScript设计模式 1.1 消息注册方 ...
JavaScript 设计模式核⼼原理与应⽤实践之创建型：工厂模式·简单工厂——区分“变与不变”
JavaScript 设计模式核⼼原理与应⽤实践之创建型:工厂模式·简单工厂--区分"变与不变" 先来说说构造器在介绍工厂模式之前,为了辅助大家的理解,我想先在这儿给大家介绍 ...
JavaScript 前端简单工厂模式、工厂方法模式、抽象工厂模式优缺点及详解 — 设计模式《二》
工厂模式前言:就前端 JavaScript 语言来说,可以把简单工厂模式.工厂方法模式.抽象工厂模式归纳为一种即工厂模式: 一. 简单工厂模式介绍/概述: 简单工厂模式的工厂类一般是使用静态方法, ...
模式扩展 ——简单工厂+配置文件解除耦合 *****
简单工厂+配置文件解除耦合可以通过工厂模式+配置文件的方式解除工厂对象和产品对象的耦合. 在工厂类中加载配置文件中的全类名,并创建对象进行存储,客户端如果需要对象,直接进行获取即可. 第一步:定义配 ...
工厂三兄弟之简单工厂模式
本文转载自 :http://blog.csdn.net/lovelion/article/details/9300337 工厂模式是最常用的一类创建型设计模式,通常我们所说的工厂模式是指工厂方法模式, ...
设计模式的征途—2.简单工厂（Simple Factory）模式
工厂模式是最常用的一种创建型模式,通常所说的工厂模式一般是指工厂方法模式.本篇是是工厂方法模式的"小弟",我们可以将其理解为工厂方法模式的预备知识,它不属于GoF 23种设计模式, ...
一起学习设计模式--02.简单工厂模式
工厂模式是最常用的一类创建型设计模式.我们所说的工厂模式是指工厂方法模式,它也是使用频率最高的工厂模式. 简单工厂模式是工厂方法模式的小弟,它不属于GoF 23种设计模式,但是在软件开发中应用也颇为频 ...

Javascript将构造函数扩展为简单工厂

Javascript将构造函数扩展为简单工厂相关推荐

最新文章

热门文章