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 相关文章推荐
jquery 隐藏与显示tr标签示例代码
Jun 06 Javascript
jquery制作 随机弹跳的小球特效
Feb 01 Javascript
JQuery查找DOM节点的方法
Jun 11 Javascript
浅谈JavaScript的Polymer框架中的behaviors对象
Jul 29 Javascript
JS实现从网页顶部掉下弹出层效果的方法
Aug 06 Javascript
javascript中不易分清的slice,splice和split三个函数
Mar 29 Javascript
JS实现iframe编辑器光标位置插入内容的方法(兼容IE和Firefox)
Jun 24 Javascript
js 定位到某个锚点的方法
Nov 19 Javascript
利用Mongoose让JSON数据直接插入或更新到MongoDB
May 03 Javascript
babel之配置文件.babelrc入门详解
Feb 22 Javascript
浅谈vue项目用到的mock数据接口的两种方式
Oct 09 Javascript
vue swipeCell滑动单元格(仿微信)的实现示例
Sep 14 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下几个常用的去空、分组、调试数组函数
2009/02/22 PHP
php学习笔记之 函数声明
2011/06/09 PHP
php中对2个数组相加的函数
2011/06/24 PHP
使用array mutisort 实现按某字段对数据排序
2013/06/18 PHP
yii操作session实例简介
2014/07/31 PHP
ThinkPHP模板替换与系统常量及应用实例教程
2014/08/22 PHP
php基于base64解码图片与加密图片还原实例
2014/11/03 PHP
Yii框架调试心得--在页面输出执行sql语句
2014/12/25 PHP
yii框架搜索分页modle写法
2016/12/19 PHP
js实现简单模态窗口,背景灰显
2008/11/14 Javascript
文本框input聚焦失焦样式实现代码
2012/10/12 Javascript
Js与下拉列表处理问题解决
2014/02/13 Javascript
JS 事件绑定、事件监听、事件委托详细介绍
2016/09/28 Javascript
微信小程序 教程之条件渲染
2016/10/18 Javascript
JS中解决谷歌浏览器记住密码输入框颜色改变功能
2017/02/13 Javascript
使用bat打开多个cmd窗口执行gulp、node
2017/02/17 Javascript
Vue2.0使用过程常见的一些问题总结学习
2017/04/10 Javascript
Angular.js中上传指令ng-upload的基本使用教程
2017/07/30 Javascript
vue的无缝滚动组件vue-seamless-scroll实例
2017/12/18 Javascript
浅谈vue项目可以从哪些方面进行优化
2018/05/05 Javascript
Node 模块原理与用法详解
2020/05/13 Javascript
实例讲解JavaScript 计时事件
2020/07/04 Javascript
全面解析JavaScript Module模式
2020/07/24 Javascript
浅谈插入排序算法在Python程序中的实现及简单改进
2016/05/04 Python
利用 python 对目录下的文件进行过滤删除
2017/12/27 Python
Django集成celery发送异步邮件实例
2019/12/17 Python
使用Python操作ArangoDB的方法步骤
2020/02/02 Python
详解python UDP 编程
2020/08/24 Python
英国网上香水店:Fragrance Direct
2016/07/20 全球购物
管理学专业个人求职信范文
2013/09/21 职场文书
酒店管理专业学生求职信
2013/09/27 职场文书
物业公司的岗位任命书
2014/06/06 职场文书
湖南省召开党的群众路线教育实践活动总结大会报告
2014/10/21 职场文书
新员工考核评语
2014/12/31 职场文书
初中重阳节活动总结
2015/05/05 职场文书
go xorm框架的使用
2021/05/22 Golang