华山资源网

JavaScript function函数种类详解
网络编程 2024/11/15 佚名
3 1

本篇主要介绍普通函数、匿名函数、闭包函数

目录

  • 普通函数：介绍普通函数的特性：同名覆盖、arguments对象、默认返回值等。
  • 匿名函数：介绍匿名函数的特性：变量匿名函数、无名称匿名函数。
  • 闭包函数：介绍闭包函数的特性。

 

1. 普通函数
1.1 示例

function ShowName(name) {
  alert(name);
}

1.2 Js中同名函数的覆盖

在Js中函数是没有重载，定义相同函数名、不同参数签名的函数，后面的函数会覆盖前面的函数。调用时，只会调用后面的函数。

var n1 = 1;
 
function add(value1) {
  return n1 + 1;
}
alert(add(n1));//调用的是下面的函数，输出：3
 
function add(value1, value2) {
  return value1 + 2;
}
alert(add(n1));//输出：3

1.3 arguments对象

arguments 类似于C#的params，操作可变参数：传入函数的参数数量大于定义时的参数数量。

function showNames(name) {
  alert(name);//张三
  for (var i = 0; i < arguments.length; i++) {
    alert(arguments[i]);//张三、李四、王五
  }
}
showNames('张三','李四','王五');

1.4 函数的默认返回值

若函数没有指明返回值，默认返回的是'undefined'

function showMsg() {
}
alert(showMsg());//输出：undefined
　　

2.匿名函数
2.1 变量匿名函数

2.1.1 说明
可以把函数赋值给变量、事件。

2.1.2 示例

//变量匿名函数，左侧可以为变量、事件等
var anonymousNormal = function (p1, p2) {
  alert(p1+p2);
}
anonymousNormal(3,6);//输出9

2.1.3 适用场景
①避免函数名污染。若先声明个带名称的函数，再赋值给变量或事件，就造成了函数名的滥用。

2.2 无名称匿名函数

2.2.1 说明
即在函数声明时，在后面紧跟参数。Js语法解析此函数时，里面代码立即执行。

2.2.2 示例

(function (p1) {
  alert(p1);
})(1);

2.2.3 适用场景
①只需执行一次的。如浏览器加载完，只需要执行一次且后面不执行的功能。

3. 闭包函数
3.1 说明

 假设，函数A内部声明了个函数B，函数B引用了函数B之外的变量，并且函数A的返回值为函数B的引用。那么函数B就是闭包函数。

3.2 示例

3.2.1 示例1：全局引用与局部引用

function funA() {
  var i = 0;
  function funB() { //闭包函数funB
    i++;
    alert(i)
  }
  return funB;
}
var allShowA = funA(); //全局变量引用：累加输出1,2,3,4等
 
function partShowA() {
  var showa = funA();//局部变量引用：只输出1
  showa();
}

allShowA是个全局变量，引用了函数funA。重复运行allShowA()，会输出1,2,3,4等累加的值。

执行函数partShowA(),因为内部只声明了局部变量showa来引用funA，执行完毕后因作用域的关系，释放showa占用的资源。

闭包的关键就在于作用域：全局变量占有的资源只有当页面变换或浏览器关闭后才会释放。var allShowA = funA() 时，相当于allShowA引用了funB()，从而使funB()里的资源不被GC回收，因此funA()里的资源也不会。 

3.2.2 示例2：有参闭包函数

function funA(arg1,arg2) {
  var i = 0;
  function funB(step) {
    i = i + step;
    alert(i)
  }
  return funB;
}
var allShowA = funA(2, 3); //调用的是funA arg1=2，arg2=3
allShowA(1);//调用的是funB step=1,输出 1
allShowA(3);//调用的是funB setp=3,输出 4

3.2.3 示例3：父函数funA内的变量共享

function funA() {
  var i = 0;
  function funB() {
    i++;
    alert(i)
  }
  allShowC = function () {// allShowC引用匿名函数,与funB共享变量i
    i++;
    alert(i)
  }
  return funB;
}
var allShowA = funA();
var allShowB = funA();//allShowB引用了funA，allShowC在内部重新进行了绑定，与allShowB共享变量i

3.3 适用场景

①保证函数funA内里的变量安全，因为外部不能直接访问funA的变量。

以上就是本文的全部内容，希望对大家的学习有所帮助。

华山资源网 Design By www.eoogi.com
广告合作：本站广告合作请联系QQ：858582 申请时备注：广告合作（否则不回）
免责声明：本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除！
华山资源网 Design By www.eoogi.com
www.eoogi.com 华山资源网
120,135影音资源
344,641技术资源
22,817软件资源
435,032站长资源

更新日志

友情链接

杰晶网络 DDR爱好者之家 桃源资源网 杰网资源 富贵资源网 南强小屋 铁雪资源网 幽灵资源网 万梅资源网 狼山资源网 白云岛资源网 昆仑资源网 相思资源网 明霞山资源网 内蒙古资源网 黑松山资源网 茶园资源网 饿虎岗资源网 大旗谷资源网 常春岛资源网 岱庙资源网 兴国资源网 快活林资源网 蝙蝠岛资源网 帝王谷资源网 白云城资源网 伏龙阁资源网 清风细雨楼 天枫庄资源网 圆月山庄资源网 无争山庄资源网 神水资源网 移花宫资源网 神剑山庄资源网 无为清净楼资源网 金钱帮资源网 丐帮资源网 华山资源网 极乐门资源网 小李飞刀资源网 凤求凰客栈 风云阁资源网 金狮镖局 鸳鸯亭资源网 千金楼资源网 更多链接
华山资源网 Design By www.eoogi.com