您的位置:首页> 前端教程> JS教程
文章导航

JavaScript Function

2018-11-17 10:42| 作者: admin| 查看: 1069| 评论: 0|来自: 蚂蚁部落

我们说JavaScript是面向对象的语言,基本做到一切皆是对象。

通过构造函数可以创建对象实例,代码如下:

[JavaScript] 纯文本查看 复制代码
function Antzone(){
  // code
}  
let ant=new Antzone()

上述代码通过构造函数Antzone创建一个对象实例ant。

关于构造函数更多内容可以参阅JavaScript 构造函数一章节。

既然一切皆为对象,那么function函数也不例外,由Function构造函数创建。

那么问题来了,Function又是由谁创建的,Function是由Function创建。

因为Function也是一个function函数,看起来关系有点乱,代码如下:

[JavaScript] 纯文本查看 复制代码运行代码
Function instanceof Function

代码运行效果截图如下:

a:3:{s:3:\"pic\";s:43:\"portal/201811/23/110529qoktsdzwh55n5wkj.png\";s:5:\"thumb\";s:0:\"\";s:6:\"remote\";N;}

这不是本文要关注的,更多内容参阅JavaScript instanceof一文底部继承关系图。

语法结构:

[JavaScript] 纯文本查看 复制代码
let function_name = new function(arg1, arg2, ..., argN, function_body)

通过Function构造函数可以创建function函数对象。

原本用来创建其他对象实例的function,现在成为Function构造函数的对象实例。

特别说明:注意F的大小写。

参数解析:

(1).arg1..argN:被创建函数的形式参数。

(2).function_body:被创建函数体中的代码。

代码实例如下:

[JavaScript] 纯文本查看 复制代码运行代码
let func=new Function("a","b","let num=a+b;return num;")
console.log(func(2,3));

代码运行效果截图如下:

a:3:{s:3:\"pic\";s:43:\"portal/201811/17/104351qtzt79uu0ijuohty.png\";s:5:\"thumb\";s:0:\"\";s:6:\"remote\";N;}

代码分析如下:

(1).Function前两个参数"a"与"b"是创建函数的两个形式参数a与b。

(2).Function最后一个参数是新创建函数的函数体部分,也就是大括号中的内容。

上述代码创建的函数等价于如下代码:

[JavaScript] 纯文本查看 复制代码
let func=function(a,b){
  let num=a+b;
  return num;
}

实际应用中不推荐使用Function构造函数创建function函数。

原因主要有如下两点:
(1).创建过程复杂,函数声明或者表达式方式创建方式更加清晰便捷。

(2).效率不高。

[JavaScript] 纯文本查看 复制代码运行代码
let func=Function("a","b","let num=a+b;return num;")
console.log(func(2,3));

代码运行效果截图如下:

a:3:{s:3:\"pic\";s:43:\"portal/201811/17/104437e9dihzvojjccxpoa.png\";s:5:\"thumb\";s:0:\"\";s:6:\"remote\";N;}

可以看到Function前面并没有加关键字new。

但是依然可以创建一个函数对象,与加new关键字效果完全一样。

关于new的作用可以参阅JavaScript new 运算符一章节。

[JavaScript] 纯文本查看 复制代码运行代码
let b=5;
function createF(){
  let b=2;
  let func=new Function("a","console.log(a+b)");
  func(1);
}
createF();

代码运行效果截图如下:

a:3:{s:3:\"pic\";s:43:\"portal/201811/17/104542nhy23cz2ahw2yar4.png\";s:5:\"thumb\";s:0:\"\";s:6:\"remote\";N;}

代码分析如下:

(1).在函数createF内通过Function创建函数并赋值给func。

(2).调用func函数后,打印结果是5。

(3).由打印结果可见,func函数在全局作用域查找超找变量,而不是在声明它的函数作用域。

1

鲜花

握手

雷人

路过

鸡蛋

刚表态过的朋友 (1 人)

最新评论

返回顶部