js函数封装及外部调用

我会带着你远行 2023-02-21 11:51 30阅读 0赞

今天遇到web开发，因前端同事离职，只能自己来开发前端了 ，想封装些公共方法，方便其他模块调用。

1，封装对象方式

var hs = {
    	baseurl:"12gggg",
    	login:function(){
    		return 333;
    	},
    	keeplive:function(){
    		return 123;
    	},
    }

外部调用：console.log("1-"+hs.baseurl);  
            console.log("1-"+hs.keeplive());

结果如图：

![2020063013564020.png][]

2.封装方法

function tt(){
    	this.a="aaa";
    	console.log("tt init..");
    	this.b=function(){
    		console.log("bbbb");
    		return "bb";
    	};
    }

外部调用：console.log("init--------------------"+new tt().a);  
            console.log("init--------------------"+new tt().b());

结果如图：

![20200630135821995.png][]

this.a，this.b() 叫做tt实例的特权属性/方法。但有个问题：每个实例的同名特权方法都要重新创建。

因此可以采用原型链的方式：

tt.prototype.c=function()\{  
        console.log("cc");  
        return "cc";  
    \};

这种方法每个实例的特权方法都是动态共享的。但每个实例都没有自己的私有变量。

下面采用了组合的方式：

在实际项目里，根据需求采用相应的方法即可：

参考博客：[https://www.cnblogs.com/lodadssd/p/6395126.html][https_www.cnblogs.com_lodadssd_p_6395126.html]

[2020063013564020.png]: https://img-blog.csdnimg.cn/2020063013564020.png
[20200630135821995.png]: https://img-blog.csdnimg.cn/20200630135821995.png
[https_www.cnblogs.com_lodadssd_p_6395126.html]: https://www.cnblogs.com/lodadssd/p/6395126.html

js函数封装及外部调用

发表评论取消回复

还没有评论，来说两句吧...

相关阅读

相关 this及其作用域（函数外部this变量的调用）

相关 js函数封装及外部调用

相关函数的封装和参数调用

相关 ajax封装及简单调用

相关 js中封装函数入门

相关原生js封装Ajax函数

相关 move.js（运动函数封装）

相关 js函数调用

相关函数的封装与调用

相关 ajax函数封装与调用