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')
相关推荐
HWL56792 分钟前
Vue Router中,传递参数的几种方式
前端·javascript·vue.js
晚霞的不甘12 分钟前
Flutter for OpenHarmony 电商 App 搜索功能深度解析:从点击到反馈的完整实现
开发语言·前端·javascript·flutter·前端框架
Dragon Wu13 分钟前
React Native MMKV完整封装
前端·javascript·react native·react.js
前端(从入门到入土)14 分钟前
解决Webpack打包白屏报错问题l.a.browse is not a function
前端·javascript
Mr Xu_20 分钟前
在 Vue 3 中集成 WangEditor 富文本编辑器:从基础到实战
前端·javascript·vue.js
EndingCoder26 分钟前
Node.js 与 TypeScript:服务器端开发
前端·javascript·typescript·node.js
EndingCoder34 分钟前
React 与 TypeScript:组件类型化
前端·javascript·react.js·typescript·前端框架
皮卡穆40 分钟前
Vue3 + Swiper.js 实现无缝轮播图组件
前端·javascript·vue
Whisper_Sy9 小时前
Flutter for OpenHarmony移动数据使用监管助手App实战 - 网络状态实现
android·java·开发语言·javascript·网络·flutter·php
新缸中之脑10 小时前
Weave.js:开源实时白板库
开发语言·javascript·开源