JavaScript function函数种类详解


Posted in Javascript onFebruary 22, 2016

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

目录

  • 普通函数:介绍普通函数的特性:同名覆盖、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的变量。

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

Javascript 相关文章推荐
a标签的href和onclick 的事件的区别介绍
Jul 26 Javascript
推荐8款jQuery轻量级树形Tree插件
Nov 12 Javascript
jQuery实现控制文字内容溢出用省略号(…)表示的方法
Feb 26 Javascript
微信小程序入门教程
Nov 18 Javascript
浅析为什么a=&quot;abc&quot; 不等于 a=new String(&quot;abc&quot;)
Oct 25 Javascript
JS判断字符串是否为整数的方法--简单的正则判断
Jul 23 Javascript
前后端如何实现登录token拦截校验详解
Sep 03 Javascript
从组件封装看Vue的作用域插槽的实现
Feb 12 Javascript
vue组件间通信六种方式(总结篇)
May 15 Javascript
详解微信小程序胶囊按钮返回|首页自定义导航栏功能
Jun 14 Javascript
Ajax请求时无法重定向的问题解决代码详解
Jun 21 Javascript
Vue axios与Go Frame后端框架的Options请求跨域问题详解
Mar 03 Javascript
JavaScript+html5 canvas实现图片破碎重组动画特效
Feb 22 #Javascript
jQuery获取字符串中出现最多的数
Feb 22 #Javascript
jQuery基于muipicker实现仿ios时间选择
Feb 22 #Javascript
简单谈谈javascript中this的隐式绑定
Feb 22 #Javascript
javascript实现一个简单的弹出窗
Feb 22 #Javascript
Js的Array数组对象详解
Feb 22 #Javascript
AngularJS中使用HTML5手机摄像头拍照
Feb 22 #Javascript
You might like
PHP产生随机字符串函数
2006/12/06 PHP
如何写php程序?
2006/12/08 PHP
AMFPHP php远程调用(RPC, Remote Procedure Call)工具 快速入门教程
2010/05/10 PHP
解析curl提交GET,POST,Cookie的简单方法
2013/06/29 PHP
PHP模板引擎Smarty自定义变量调解器用法
2016/04/11 PHP
PHP的时间戳与具体时间转化的简单实现
2016/06/13 PHP
PHP设计模式(六)桥连模式Bridge实例详解【结构型】
2020/05/02 PHP
40个有创意的jQuery图片和内容滑动及弹出插件收藏集之三
2012/01/03 Javascript
基于jquery自定义的漂亮单选按钮RadioButton
2013/11/19 Javascript
jQuery的图片滑块焦点图插件整理推荐
2014/12/07 Javascript
流量统计器如何鉴别C#:WebBrowser中伪造referer
2015/01/07 Javascript
HTML5使用DeviceOrientation实现摇一摇功能
2015/06/05 Javascript
轻松实现js选项卡切换效果
2016/09/24 Javascript
深入学习Bootstrap表单
2016/12/13 Javascript
JS中如何实现复选框全选功能
2016/12/19 Javascript
AngularJs 终极购物车(实例讲解)
2017/11/08 Javascript
vue.js根据代码运行环境选择baseurl的方法
2018/02/28 Javascript
vue v-model的用法解析
2020/10/19 Javascript
Python抓取聚划算商品分析页面获取商品信息并以XML格式保存到本地
2018/02/23 Python
使用python脚本实现查询火车票工具
2018/07/19 Python
Python中使用pypdf2合并、分割、加密pdf文件的代码详解
2019/05/21 Python
HTML5之tabindex属性全面解析
2016/07/07 HTML / CSS
Pretty Little Thing爱尔兰:时尚女性服饰
2017/03/27 全球购物
Tretorn美国官网:瑞典外套和鞋类品牌,抵御风雨
2018/07/19 全球购物
美国亚马逊旗下时尚女装网店:SHOPBOP(支持中文)
2020/10/17 全球购物
AOP的定义以及作用
2013/09/08 面试题
Java程序开发中如何应用线程
2016/03/03 面试题
业务代表的岗位职责
2013/11/16 职场文书
哈理工毕业生的求职信
2013/12/22 职场文书
党员批评与自我批评
2014/02/12 职场文书
经济信息系毕业生自荐信范文
2014/03/15 职场文书
机关党员公开承诺书
2014/08/30 职场文书
学校感恩节活动策划方案
2014/10/06 职场文书
民主评议政风行风活动心得体会
2014/10/29 职场文书
爱心募捐感谢信
2015/01/22 职场文书
2015初中生物教研组工作总结
2015/07/21 职场文书