读js设计模式有感->构造函数内调用自己公用方法函数

本文探讨了在JavaScript项目中实现面向对象编程的方法。作者通过三种不同的方式展示了如何在构造函数中使用公共方法,包括外部函数回调、内部方法调用及链式调用。每种方法都有其独特之处,为开发者提供了灵活的选择。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

读《javascript设计模式》第一章有感而发
因为最近一个项目需要用面向对象书写,所以看了下张容铭老师的《javascript设计模式》,虽然才只看了一章,但是感触颇深,自己笔记记:
因为需要定义个大构造函数,函数内部有很多自己公用的方法,平时就是设置一个方法函数function 方法(){}//然后直接在构造函数内部this.show进行调用
现在自己总结三种可以”使用公共方法函数”的方法:(可能都很拙劣,但是做笔记用):
第一种:

//第一种,外部函数回调调用
        function MyConstructor() {

            this.show = function  (callback) {
                var a = '做事需要的参数'
                callback.call(this,a)
            };
            this.addEvent = function  () {

            };

        }
        //平时这个函数是写构造函数内部的,直接调用,但是需要写回调所以放到外面
         function public (a) {
            console.log('我要干的事:'+a+"->接下来写方法")
         }

         var my = new MyConstructor();
         my.show(public)
         //打印结果:我要干的事:做事需要的参数->接下来写方法

第二种:

//第二种 :构造函数内部调用自己的方法
        function MyConstructor() {

            this.show = function  (callback1,callback2) {
                var a = '做事需要的参数'
                callback1.call(this,a)
                callback2.call(this,a)
            };
            this.addEvent = function  () {

            };
            this.publicMethods ={
                public1:function  (a) {
                    console.log('我要干的事:'+a+"->接下来写方法")
                },
                public2:function  (a) {
                    console.log('我要干的事:'+a+"->接下来写方法")
                }
            }
        }
        var my = new MyConstructor();
            my.show(my.publicMethods.public1,my.publicMethods.public2)
            //打印结果:我要干的事:做事需要的参数->接下来写方法;我要干的事:做事需要的参数->接下来写方法

第三种:(也是看设计模式有感而发)

//第三种:构造函数内或者外定义公用大F的链式叠加,然后new 实例化进行调用
        function MyConstructor() {

            this.show = function  (callback) {
                var a = '做事需要的参数';


                publicMethods.public1(a);
                callback?callback.call(this,a):null
                return this;//进行链式调用
            };
            this.addEvent = function  () {

                //addEvent内部需要使用公用方法1,进行调用传入参数
                var a = '我是方法1'
                publicMethods.public2(a);
                return this;//进行链式调用
            };
//-->   此段容如果放到 构造函数 外面,其实可以作为回调函数用的,参考第一种但是个人考虑公用F的污染的问题,还是放到 构造函数内
            //定义公用大F的链式叠加添加方法函数
            Function.prototype.addMthod = function (name,fn) {
                this.prototype[name] = fn;
                return this; //进行链式添加
            }
            //定义方法函数进行添加
            var AddMethods = function(){};
            AddMethods.addMthod('public1',function  (a) {
                console.log('公用函数1要做的事'+a)
                return this; //进行链式调用,但是如果有参数进行操作的话,是不能返回当前this的
            }).addMthod('public2',function (a) {
                console.log('公用函数2要做的事')
                return this; //进行链式调用,但是如果有参数进行操作的话,是不能返回当前this的
            })
            //进行调用
            var publicMethods = new AddMethods();
            /* 注释1
             *  publicMethods.public1().public2()
            */
//-->           
        }
            //当实例化成功后,(注释1)中内部的公用方法就实现了调用,但是这些方法是要在构造函数内部调用的,所以不需要直接调用
            var my = new MyConstructor();
            my.show().addEvent() //打印结果:公用函数1要做的事做事需要的参数;公用函数2要做的事

本来我是研究第三种方法的,感觉和以前写的不一样,但是写完三种方法后,感觉各有自己的特点吧,第二种方法也不错,这些其实还是有优化的地方,只是做个笔记用。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值