JavaScript引用类型Function实例详解


Posted in Javascript onAugust 09, 2018

本文实例讲述了JavaScript引用类型Function。分享给大家供大家参考,具体如下:

Function类型

函数是对象,函数名是指针:每个函数都是Function类型的实例。由于函数是对象,因此函数名是一个指向函数对象的指针,不会与某个函数绑定,一个函数可能会有多个名字。

function getSum(a, b) {
  return a + b;
}
alert(getSum(2, 3));//5
var copy = getSum;
alert(copy(2, 3));//5
getSum = null;
alert(copy(2, 3));//5

定义函数的方式有三种:函数声明函数表达式Function构造函数

Function构造函数接收任意数量的参数,前面的参数枚举了函数的参数,最后一个参数是函数体。一般不推荐使用Function构造函数定义函数。

var getSum = new Function("a", "b", "return a + b";

JavaScript没有函数重载的概念,若声明了两个同名函数,则后面的函数会覆盖前面的函数。

由于函数名本身是变量,因此函数也可以作为值来使用,不仅可以传递一个函数作为参数,还可以将函数作为返回值。

function callFunction(func, arguments) {
  return func(arguments);
}
function sayHello(name) {
  return "Hello, " + name;
}
var result = callFunction(sayHello, "Alice");
alert(result);//Hello, Alice

①、函数声明

function 函数名称(参数|可选) { 函数体 }

例:

function func1(){// 声明,程序的一部分
  function func() {// 声明,函数体的一部分
    ...//函数体
  }
}

②、函数表达式

function 函数名称|可选(参数|可选) { 函数体 }

例1:

var fun = function func() {};//表达式,赋值表达式的一部分

例2:

new function func(){};//表达式,new表达式

例3:

(function func(){});
//表达式,包含在分组操作符——括号()内,括号()内只能包含表达式

例4:

[function func() {}];//表达式,数组初始化器内只能是表达式

例5:

1, function func() {};//表达式,逗号只能操作表达式

③、函数构造器

函数构造器创建的函数的[[Scope]]属性仅包含全局对象。

<script>
  var a = 1;
  func1();
  function func1() {
    var a = 2;
    var b = 3;
    var func2 = new Function("alert(a); alert(b);");
    func2();//1,b is not defined
  }
</script>

函数构造器创建的函数func2可以从全局对象中取得变量a,但全局对象中没有b,因此报错:b未定义。

函数声明和函数表达式的区别

1)函数声明在进入上下文阶段创建,在代码执行阶段就已经可用了,函数表达式则是在代码执行阶段才创建,所以函数声明可以提升,但函数表达式则不能。

函数声明提升:

func();//Function declaration
function func(){
  alert("Function declaration");
}

函数表达式不能提升:

func();//报错:func is not a function
var func = function (){
  alert("Function expression");
}

2)函数声明影响变量对象VO,也就是存储在上下文的VO中的变量对象,函数表达式不影响变量对象VO,不存在于变量对象中,这意味着既不可能通过名称在函数声明之前调用它,也不可能在声明之后调用它。但是,函数表达式在递归调用中可以通过名称调用自身。

例1:

alert(func); //报错:func is not a function。定义之前不可用,因为它在代码执行阶段创建
(function func() {});
alert(func); //报错:func is not a function。定义之后也不可用,因为它不在变量对象VO中

例2:

(function func(param) {
  if (param) {
    return;
  }
  func(true);//func可用,递归调用可以通过名称调用自身
})();
func(); // func is not a function,外部不可用

3)函数声明只能出现在程序或函数体内,不能出现在表达式或块({ … })中,如if、while或for语句中。因为JavaScript无块级作用域,只有函数和全局作用域。 函数表达式出现在表达式的位置。

函数声明:有的浏览器会返回if,而有的浏览器会返回else。

if (true) {
  function func() {
    alert('if');
  }
}
else {
  function func() {
    alert('else');
  }
}
func();

函数表达式:所有浏览器都返回if。

var func;
if (true) {
  func = function() {
    alert('if');
  };
}
else {
  func = function() {
    alert('else');
  };
}
func();

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
Egret引擎开发指南之编译项目
Sep 03 Javascript
JS实现简易图片轮播效果的方法
Mar 25 Javascript
javascript封装 Cookie 应用接口
Aug 07 Javascript
跟我学习javascript的作用域与作用域链
Nov 19 Javascript
JS组件系列之Bootstrap Icon图标选择组件
Jan 28 Javascript
js操作XML文件的实现方法兼容IE与FireFox
Jun 25 Javascript
浅谈js构造函数的方法与原型prototype
Jul 04 Javascript
基于JQuery及AJAX实现名人名言随机生成器
Feb 10 Javascript
详解微信JS-SDK选择图片遇到的坑
Aug 15 Javascript
解决微信小程序scroll-view组件无横向滚动的问题
Feb 04 Javascript
JS面向对象编程——ES6 中class的继承用法详解
Mar 03 Javascript
JS实现悬浮球只在一侧滑动并且是横屏状态下
Aug 19 Javascript
jquery ajax加载数据前台渲染方式 不用for遍历的方法
Aug 09 #jQuery
JavaScript引用类型之基本包装类型实例分析【Boolean、Number和String】
Aug 09 #Javascript
vue修改对象的属性值后页面不重新渲染的实例
Aug 09 #Javascript
vue异步axios获取的数据渲染到页面的方法
Aug 09 #Javascript
vue2.0的虚拟DOM渲染思路分析
Aug 09 #Javascript
Angular动画实现的2种方式以及添加购物车动画实例代码
Aug 09 #Javascript
Vue.js 通过jQuery ajax获取数据实现更新后重新渲染页面的方法
Aug 09 #jQuery
You might like
php xml文件操作实现代码(二)
2009/03/20 PHP
PHP5 的对象赋值机制介绍
2011/08/02 PHP
ThinkPHP的I方法使用详解
2014/06/18 PHP
PHP getDocNamespaces()函数讲解
2019/02/03 PHP
利用PHP如何统计Nginx日志的User Agent数据
2019/03/06 PHP
javascript 一个自定义长度的文本自动换行的函数
2007/08/19 Javascript
JQuery AJAX实现目录浏览与编辑的代码
2008/10/21 Javascript
jquery插件之easing 动态菜单
2010/08/21 Javascript
继续学习javascript闭包
2015/12/03 Javascript
Node.js实用代码段之获取Buffer对象字节长度
2016/03/17 Javascript
jQuery弹出下拉列表插件(实现kindeditor的@功能)
2016/08/16 Javascript
用AngularJS的指令实现tabs切换效果
2016/08/31 Javascript
JavaScript+Html5实现按钮复制文字到剪切板功能(手机网页兼容)
2017/03/30 Javascript
p5.js入门教程和基本形状绘制
2018/03/15 Javascript
layui use 定义js外部引用函数的方法
2019/09/26 Javascript
Python3 正在毁灭 Python的原因分析
2014/11/28 Python
Python遍历目录中的所有文件的方法
2016/07/08 Python
Windows下安装python2和python3多版本教程
2017/03/30 Python
django中send_mail功能实现详解
2018/02/06 Python
Python切片操作实例分析
2018/03/16 Python
Python 3.7新功能之dataclass装饰器详解
2018/04/21 Python
python实现写数字文件名的递增保存文件方法
2018/10/25 Python
在unittest中使用 logging 模块记录测试数据的方法
2018/11/30 Python
Python使用scrapy爬取阳光热线问政平台过程解析
2019/08/14 Python
python plotly画柱状图代码实例
2019/12/13 Python
如何使用python-opencv批量生成带噪点噪线的数字验证码
2020/12/21 Python
阿巴庭院:Abba Patio
2019/06/18 全球购物
Linux机考试题
2015/07/17 面试题
寄语是什么意思
2014/04/10 职场文书
保护黄河倡议书
2014/05/16 职场文书
营销团队口号
2014/06/06 职场文书
安全责任书范文
2014/08/25 职场文书
2014年政府采购工作总结
2014/12/09 职场文书
记者节感言
2015/08/03 职场文书
python生成可执行exe控制Microsip自动填写号码并拨打功能
2021/06/21 Python
Spring中的@Transactional的工作原理
2022/06/05 Java/Android