js工厂模式、原型模式、构造模式、组合模式

墨蓝 2022-09-10 01:24 173阅读 0赞

**目录**

一、工厂模式

优点

缺点

代码演示

二、构造函数模式

优点

缺点

代码演示：

三、原型模式

优点

缺点

代码演示

四、组合模型

代码演示

--------------------

# 一、工厂模式 #

##         优点 ##

工厂模式是为了减少重复的代码，将实例对象进行封装，避免重复代码的产生

##         缺点 ##

创建的所有对象类型均为Object类型，没有办法知道对象到底是属于Person还是Dog

##         代码演示 ##

结果：

![watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LiN5oOz5pyJYnVn55qE5bCP6I-c6bif_size_14_color_FFFFFF_t_70_g_se_x_16][]

# 二、构造函数模式 #

构造函数模式是为了解决工厂模式中关于对象均为object类型这个问题

##         优点 ##

可以区分每个类

##         缺点 ##

1.每个方法都要在实例上创建，没有必要

2.虽然可以将方法提取出来，提取到全局范围内，然后将引用传递给对象中的函数属性，但是全局函数太多，体现不了类的封装性。

##         代码演示： ##

//将方法提取到全局范围中
    function sayHi() {
        console.log("sayHi");
    }
    
    
    function Person(name,age,gender) {
        this.name = name;
        this.age = age;
        this.gender = gender;
        this.sayName = function () {
            console.log(this.name);
        };
        this.sayHi = sayHi;
    }
    
    var p1 = new Person("zs",15);
    var p2  = new Person("ls",11,"女");
    console.log(p1);
    p1.sayName();
    console.log(typeof p1);
    console.log(p1 instanceof Object);
    console.log();

结果：

![watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LiN5oOz5pyJYnVn55qE5bCP6I-c6bif_size_8_color_FFFFFF_t_70_g_se_x_16][]

# 三、原型模式 #

每创建一个函数，内部都会有一个显性原型属性prototype，指向原型对象，原型对象也有一个constructor属性，指向函数，函数通过实例化创建对象后，这个对象内部也有一个隐性原型属性\_\_proto\_\_指向原型对象。该实例对象能够拥有原型对象中的所有属性和方法。

##         优点 ##

比较适合共享的函数和共享的方法的创建

##         缺点 ##

所有实例在默认情况下都将取得相同的属性值，这种共享对于函数来说非常合适，但是包含引用数据类型的值就不太好

##         代码演示 ##

结果：

![watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LiN5oOz5pyJYnVn55qE5bCP6I-c6bif_size_16_color_FFFFFF_t_70_g_se_x_16][]

#  四、组合模型 #

组合模型是构造函数模型和原型模型的一个组合

构造函数定义实例属性，原型模型定义方法和共享属性。

##         代码演示 ##

结果：

![watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LiN5oOz5pyJYnVn55qE5bCP6I-c6bif_size_14_color_FFFFFF_t_70_g_se_x_16 1][]

[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LiN5oOz5pyJYnVn55qE5bCP6I-c6bif_size_14_color_FFFFFF_t_70_g_se_x_16]: /images/20220829/976338f9bbfe449ab9500a1614fc3c6b.png
[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LiN5oOz5pyJYnVn55qE5bCP6I-c6bif_size_8_color_FFFFFF_t_70_g_se_x_16]: /images/20220829/97ad95c648d04f6ebcce87690840de0e.png
[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LiN5oOz5pyJYnVn55qE5bCP6I-c6bif_size_16_color_FFFFFF_t_70_g_se_x_16]: /images/20220829/2abc3a738cb2406ea77d62f6ab274fc9.png
[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA5LiN5oOz5pyJYnVn55qE5bCP6I-c6bif_size_14_color_FFFFFF_t_70_g_se_x_16 1]: /images/20220829/3c95388a08f14ba597d88bd0da1ad2d4.png