JavaScript 中 function 的六种核心用法详解

作者:异步漫步时间:2026-10-24 21:39:02浏览:160

本文深入解析 JavaScript 中 function 关键字的多种应用场景。涵盖基础函数声明、类构造器模式、立即执行闭包、选择器封装、私有变量混合模式,以及利用 Function 构造函数动态执行 AJAX 返回的脚本代码。通过具体代码示例,展示如何灵活运用函数特性优化前端开发。

JavaScript function 的基础声明

1.作为基础函数声明使用。


代码如下:

 
function func(){}
或
var func=function(){};

作为类构造器的使用

2.作为类构造器使用:



代码如下:

 
function class(){}
class.prototype={};
var item=new class();

利用闭包创建独立作用域

3.作为闭包使用:


代码如下:

 
(function(){
//独立作用域
})(); 

作为选择器或工厂函数

4.可以作为选择器使用:


代码如下:

 
var addEvent=new function(){
if(!-[1,]) return function(elem,type,func){attachEvent(elem,'on'+type,func);};
else return function(elem,type,func){addEventListener(elem,type,func,false;}
};//避免了重复判断



混合应用:静态私有变量

5.以上四中情况的混合应用:


代码如下:

 
var class=new function(){
var privateArg;//静态私有变量
function privateMethod=function(){};//静态私有方法
return function(){/*真正的构造器*/};};

动态执行 AJAX 脚本

6.利用Function处理ajax返回的js脚本:



代码如下:

 
var ajax_js_code=
"{a:'a','b':'b','func':function(){alert('abc')}}";
//假设此为服务器返回responseText
ajax_js_code=
"return "+ajax_js_code;
//重构代码主体,根据需要可以有不同重构方法
var ajax_exec=new Function(ajax_js_code);
var result=ajax_exec();
alert(result.a+":"+result.b);
result.func();


这种构建函数方式:var func=new Function(args1,args2,args3,...,body) args:参数(任意多个); body:函数主体


如:var func=new Function("arg1","arg2","alert(arg1+':'+arg2)"); func("ooo","ppp");


应注意的是,注意返回代码的格式,根据处理原理返回形式可有一下几种:


1.(function(){//代码})()


2.{a:"abc",func:function){}}//散列表


3.function(){}


以上三种应该能处理大部分代码了。

作者最新文章