js设计模式:建造者模式

作用:

将众多功能独立封装,然后用一个大类将其全部收纳,形成一个完整的功能

这个是很常见的设计模式

示例:

javascript 复制代码
        function render(h){
        }

        function h(){

        }

        function $mount(dom){
       console.log(dom,'绑定的根节点')
       console.log(this,'this是vue实例')
        }

        function use(plugin){
        
        }

        function $attr(){

        }

        function $emit(){

        }

        class Vue{
         constructor(vue){
            this.render = render
            this.$mount = $mount
            this.use = use
         }
         attr = $attr
         $emit = $emit
         static self = function(){
            return '看不到我'
         }
        }

        //使用
        let vueComponent1 =  new Vue({
            beforeCreate(){},
            created(){},
            render:h=>h()
        })

        console.log(vueComponent1,'vue组件实例')
        vueComponent1.$mount('#app')
相关推荐
Yu_Lijing18 分钟前
基于C++的《Head First设计模式》笔记——中介者模式
笔记·设计模式·中介者模式
Timer@22 分钟前
LangChain 教程 03|快速开始:10 分钟创建第一个 Agent
前端·javascript·langchain
Timer@29 分钟前
LangChain 教程 02|环境安装:从 0 到 1 搭建开发环境
javascript·人工智能·langchain·前端框架
我命由我1234530 分钟前
React - React 配置代理、搜索案例(Fetch + PubSub)、React 路由基本使用、NavLink
开发语言·前端·javascript·react.js·前端框架·html·ecmascript
小马_xiaoen42 分钟前
Vue 3 + TS 实战:手写 v-no-emoji 自定义指令,彻底禁止输入框表情符号!
前端·javascript·vue.js
林九生1 小时前
【Flutter】Flutter 拍照/相册选择后无法显示对话框问题解决方案
前端·javascript·flutter
程序员小寒1 小时前
JavaScript设计模式(四):发布-订阅模式实现与应用
开发语言·前端·javascript·设计模式
Highcharts.js1 小时前
Highcharts Gantt 实战:从框架集成到高级功能应用-打造现代化、交互式项目进度管理图表
前端·javascript·vue.js·信息可视化·免费
程序猿的程1 小时前
把股票数据能力接进 AI:stock-sdk-mcp 的实践整理
前端·javascript·node.js
终端鹿1 小时前
setup 语法糖从 0 到 1 实战教程
前端·javascript·vue.js