JavaScript 使用 function 创建类的三种实现方式

作者:木棉

时间:2026-10-30

浏览:91

本文介绍了在 JavaScript 中使用 function 关键字创建类的三种常见方法。第一种是直接定义全局构造函数并实例化;第二种是通过返回对象字面量的方式封装私有方法;第三种是利用 jQuery 扩展机制注册全局方法。文章对比了各方法的优缺点及调用方式,帮助开发者根据实际需求选择合适的类创建模式。

文章目录

方法一:基于 function 构造函数

方法一:基于 function 构造函数


//myFunction.js
var CMyFunc=function()
{
//类的公共方法,供外部调用
this.Func1=function()
{
var i=0;
return i;
}

this.Func2=function()
{
_privateFunc();
}

//类中的私有方法,供公共方法调用
function _privateFunc()
{
return 0;
]
}

CMyFunc myFunc=new CMyFunc();

调用方式:在其他 JavaScript 文件中引入 myFunction.js 后,可以直接通过全局变量 myFunc 访问其方法,例如调用 myFunc.Func1。

方法二:基于 function 构造函数(封装版)

方法二:基于 function 构造函数(封装版)


//myFunction.js
var CMyFunc=function()
{
var myFunc=new Object();
//类的公共方法,供外部调用
myFunc.Func1=function()
{
var i=0;
return i;
}

myFunc.Func2=function()
{
_privateFunc();
}

//类中的私有方法,供公共方法调用
function _privateFunc()
{
return 0;
]

return myFunc;
}

调用方式:在其他 JavaScript 文件中引入 myFunction.js 后,需要通过 var myFunc = new CMyFunc() 初始化一个对象实例,然后使用该对象。

该方法的优点包括:1. 在使用 myFunc 对象函数时,开发环境能提供智能提示;2. 无需在 myFunction.js 中创建全局变量,减少了全局命名空间污染;3. myFunc 对象函数中的 this 参数指向保持一致。

方法三:基于 jQuery 扩展

方法三:基于 jQuery 扩展


//myFunction.js
(function ($) {
$.MyFunc={};

$.MyFunc.Func1=function()
{
var i=0;
return i;
}

$.MyFunc.Func2=function()
{
var i=0;
return i;
}


})(jQuery);

调用方式:在其他 JavaScript 文件中引入 myFunction.js 后,可以直接使用 $.MyFunc.Func1() 进行调用。

以上介绍了 JavaScript 使用 function 创建类的几种方法,希望能对读者有所帮助。

实用工具推荐

电子包浆

绿化、压缩、噪点和虚拟水印,自由调节做旧程度。

使用 ›
图片压缩

选择画质和输出格式,预览压缩前后的大小。

使用 ›
相关文章