javascript设计模式之工厂模式

 更新时间:2022年01月11日 15:11:58   作者:妖怪不慌不张  
这篇文章主要为大家介绍了javascript工厂模式,具有一定的参考价值,感兴趣的小伙伴们可以参考一下,希望能够给你带来帮助

介绍

  • 将new操作单独封装
  • 遇到new时,就要考虑是否应该使用工厂模式
  • 比如买汉堡:直接点餐、取餐,我们不会亲手做,商店要“封装”做汉堡的工作,做好直接给买者

UML类图

在这里插入图片描述

直接上工厂模式的代码

class Product {
	constructor(name} {
		this.name = name
	}
	init() {console.log('init')}
	fun1() {console.log('fun1')}
	fun2() {console.log('fun2')}
}
// 此处的Creator就是工厂
class Creator {
	create(name) {
		// 此处返回的是实例,工厂模式的特点
		return new Procuct(name)
	}
}
// 运行代码
let creator = new Creator()
let p = creator.create('p1')
p.init()
p.fun1()
p.fun2()

工厂模式的场景

Jquery - $(‘div’)

// jquery 代码为工厂模式
class jQuery {
    constructor(selector) {
        let slice = Array.prototype.slice
        let dom = slice.call(document.querySelectorAll(selector))
        let len = dom ? dom.length : 0
        for (let i = 0; i < len; i++) {
            this[i] = dom[i]
        }
        this.length = len
        this.selector = selector || ''
    }
    append(node) {}
    addClass(name) {}
    html(data) {}
    // 此处省略若干 API
}
window.$ = function (selector) {
    return new jQuery(selector)
}

React.createElement (创建虚拟dom的实例)

在这里插入图片描述

总结

本篇文章就到这里了,希望能够给你带来帮助,也希望您能够多多关注脚本之家的更多内容!

相关文章

  • JavaScript代码复用模式详解

    JavaScript代码复用模式详解

    文章介绍了代码复用的概念及其原则,已经代码复用的集中类型,非常的详尽,语言简单易懂,有需要的朋友可以参考下
    2014-11-11
  • JavaScript中的Math 使用介绍

    JavaScript中的Math 使用介绍

    这篇文章主要介绍了JavaScript中Math的使用,需要的朋友可以参考下
    2014-04-04
  • javascript中的=等号个数问题两个跟三个有什么区别

    javascript中的=等号个数问题两个跟三个有什么区别

    一个等号就是个赋值的作用,主要问题在于两个跟三个等号的区别,想必有很多的朋友都不知道吧,在本文有个不错的示例主要介绍下两者到底有什么区别,感兴趣的朋友不要错过
    2013-10-10
  • JavaScript面对国际化编程时的一些建议

    JavaScript面对国际化编程时的一些建议

    这篇文章主要介绍了JavaScript面对国际化编程时的一些建议,包括时区与语言编码等一些值得注意的问题,需要的朋友可以参考下
    2015-06-06
  • JavaScript学习笔记之定时器

    JavaScript学习笔记之定时器

    本文通过2个定时器的示例向我们展示了javascript中定时器的使用方法,格式以及功能,希望通过本文能够让大家对javascript定时器有新的认识。
    2015-01-01
  • Javascript中的变量使用说明

    Javascript中的变量使用说明

    使用过javascript的朋友都知道,在javascript中,变量的使用是个比较头疼的问题,经常会产生 些比较匪夷所思的结果。究其原因,大多是对javascript的变量相关知识了解得不够透彻。
    2010-05-05
  • javascript中怎么做对象的类型判断

    javascript中怎么做对象的类型判断

    javascript中经常使用的对象判断方式包括:typeof、constructor和Object.prototype.toString.call()
    2013-11-11
  • 在javascript中创建对象的各种模式解析

    在javascript中创建对象的各种模式解析

    下面小编就为大家带来一篇在javascript中创建对象的各种模式解析。小编觉得挺不错的,现在分享给大家,也给大家做个参考,一起跟随小编过来看看吧
    2016-05-05
  • 自动化测试读写64位操作系统的注册表

    自动化测试读写64位操作系统的注册表

    本文主要介绍自动化测试读写64位操作系统的注册表,这里提供详细的教程来实现自动化读写64位操作系统的注册表,希望能帮助测试软件的朋友,有兴趣的小伙伴可以参考下
    2016-08-08
  • 浅谈JavaScript Date日期和时间对象

    浅谈JavaScript Date日期和时间对象

    这篇文章主要介绍了JavaScript Date日期和时间对象的相关资料,需要的朋友可以参考下
    2014-12-12

最新评论