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 相关文章推荐
分享别人写的一个小型js框架
Aug 13 Javascript
javascript获取鼠标位置部分的实例代码(兼容IE,FF)
Aug 05 Javascript
javascript向后台传送相同属性的参数即数组参数
Feb 17 Javascript
浅谈JavaScript中数组的增删改查
Jun 20 Javascript
手机端图片缩放旋转全屏查看PhotoSwipe.js插件实现
Aug 25 Javascript
Angular.js中ng-if、ng-show和ng-hide的区别介绍
Jan 20 Javascript
RequireJS 依赖关系的实例(推荐)
Jan 21 Javascript
微信小程序地图(map)组件点击(tap)获取经纬度的方法
Jan 10 Javascript
Node.js如何优雅的封装一个实用函数的npm包的方法
Apr 29 Javascript
jQuery使用ajax传递json对象到服务端及contentType的用法示例
Mar 12 jQuery
在vue-cli3中使用axios获取本地json操作
Jul 30 Javascript
JS+CSS实现过渡特效
Jan 02 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
echo, print, printf 和 sprintf 区别
2006/12/06 PHP
使用PHP批量生成随机用户名
2008/07/10 PHP
php下删除一篇文章生成的多个静态页面
2010/08/08 PHP
PHP自带ZIP压缩、解压缩类ZipArchiv使用指南
2015/03/03 PHP
php简单socket服务器客户端代码实例
2015/05/18 PHP
PHP实现简单实用的分页类代码
2016/04/08 PHP
WordPress中设置Post Type自定义文章类型的实例教程
2016/05/10 PHP
yii2使用ajax返回json的实现方法
2016/05/14 PHP
php操作路径的经典方法(必看篇)
2016/10/04 PHP
php 替换文章中的图片路径,下载图片到本地服务器的方法
2018/02/06 PHP
php使用pthreads v3多线程实现抓取新浪新闻信息操作示例
2020/02/21 PHP
容易被忽略的JS脚本特性
2011/09/13 Javascript
图片在浏览器中底部对齐 解决方法之一
2011/11/30 Javascript
JS限制文本框只能输入数字和字母方法
2015/02/28 Javascript
JS数组操作(数组增加、删除、翻转、转字符串、取索引、截取(切片)slice、剪接splice、数组合并)
2016/05/20 Javascript
AngularJs 国际化(I18n/L10n)详解
2016/09/01 Javascript
VUE axios发送跨域请求需要注意的问题
2017/07/06 Javascript
jQuery dateRangePicker插件使用方法详解
2017/07/28 jQuery
浅谈Angular单元测试总结
2019/03/22 Javascript
微信小程序实现点击空白隐藏的方法示例
2019/08/13 Javascript
Vuex,iView UI面包屑导航使用扩展详解
2019/11/04 Javascript
Vue基于iview实现登录密码的显示与隐藏功能
2020/03/06 Javascript
jQuery开发仿QQ版音乐播放器
2020/07/10 jQuery
javascript实现搜索筛选功能实例代码
2020/11/12 Javascript
Python使用迭代器打印螺旋矩阵的思路及代码示例
2016/07/02 Python
Python之读取TXT文件的方法小结
2018/04/27 Python
Python中的Django基本命令实例详解
2018/07/15 Python
Python学习笔记之For循环用法详解
2019/08/14 Python
python安装scipy的步骤解析
2019/09/28 Python
可以使用抽象函数重写基类中的虚函数吗
2013/06/02 面试题
党的群众路线教育实践活动个人对照检查剖析材料
2014/09/23 职场文书
党员个人整改措施
2014/10/24 职场文书
幼师自荐信范文
2015/03/06 职场文书
创建文明城市倡议书
2015/04/28 职场文书
休假证明书
2015/06/24 职场文书
小学英语教学随笔
2015/08/14 职场文书