创建函数

通过构造器的方式来创建函数,最后一个参数为函数体其他为形参

new Function('a','b','alert(a)')
/* function anonymous(a,b) {
alert(a)
}
*/

由于函数体是通过字符串拼接的,因此我们可以用这个特性来实现代码的组合

function foo(){
var a = 10;
console.log(a);
}
new Function('say',foo + 'foo();console.log(say)')('Hello foo');
// 10
// Hello foo // 实际上以上代码是这样的
function anonymous(say) {
function foo(){
var a = 10;
console.log(a);
}foo();console.log(say)
}

还可以用这个特性来实现json字符串转对象

var json = '{a:123, b:456}';
new Function('return ' + json)();
// Object {a: 123, b: 456}

甚至我们可以利用它来实现重载运算符

function calc(num1,num2,operator){
return new Function('return ' + num1 + operator + num2)();
}
console.log(calc(2,3,'+'));
console.log(calc(5,2,'-'));
// 5
// 3

我们可以将返回的函数作为构造器来创建对象

new new Function();
// Object {}

执行函数

函数名加()可以执行一个函数

function foo(){
console.log(123);
}
foo();
// 123

那如果没有函数名呢

function(){};
// Uncaught SyntaxError: Unexpected token (

也就是不支持直接这么写,我们需要将以上函数改成一段表达式,将函数进行运算就成表达式了

'' + function(){console.log(5)};
// "function (){console.log(5)}"

那么怎么执行它呢,在函数后面加()

'' + function(){console.log(5)}();
// 5

以上代码不太优雅对吧,我们可以用一个()将它包起来

(function(){console.log(123)}());
// 123

()也是会进行运算的

(1) // 1

非惰性求值

只要你给函数传递参数它就会进行运算,并不会因为你没有使用它

var a = 10;
(function(){}(a++,a++));
console.log(a); // 12

非惰性求值得另外一个例子就是在使用alert时

var a = 1;
alert(a+=1,a++); // 2
console.log(a); // 3

第一个输出2是因为alert只接受一个参数,但由于函数是不限制参数个数的并且是非惰性求值所以alert中的第二个参数还是会被运算只是没有被alert使用罢了

函数中的callee、caller

callee的意义就在于当我们使用匿名函数时可以去调用函数本身

var a = 0;
(function(){
if(a > 3) return;
console.log(++a);
arguments.callee();
}());
// 1
// 2
// 3
// 4

还有一种情况是当我们重写函数时

var a = 0;
function foo(){
if(a > 2)return;
console.log(++a);
foo = null;
arguments.callee();
}
foo()
// 1
// 2
// 3

caller的意义就在于我们能够知道此函数是被谁调用的

function f1(){
f2();
}
function f2(){
console.log(arguments.callee.caller);
}
f1();
/* function f1(){
f2();
}
/*

走进JavaScript——重拾函数的更多相关文章

  1. 走进JavaScript——重拾对象

    创建对象 Object构造器的参数如果为空或null.undefined将返回一个空的Object对象,如果为其他值则调用相应的构造器,如 new Object() // Object {} new ...

  2. 走进javascript——重拾数组

    Array构造器 如果参数只有一个并且是Number类型,那么就是指定数组的长度,但不能是NaN,如果是多个会被当做参数列表. new Array(12) // (12) [undefined × 1 ...

  3. 重拾算法之复杂度分析(大O表示法)

    .katex { display: block; text-align: center; white-space: nowrap; } .katex-display > .katex > ...

  4. CSS魔法堂:重拾Border之——不仅仅是圆角

    前言  当CSS3推出border-radius属性时我们是那么欣喜若狂啊,一想到终于不用再添加额外元素来模拟圆角了,但发现border-radius还分水平半径和垂直半径,然后又发现border-t ...

  5. JavaScript 基础回顾——函数

    在JavaScript中,函数也是一种数据类型,属于 function 类型,所以使用Function关键字标识函数名.函数可以在大括号内编写代码并且被调用,作为其他函数的参数或者对象的属性值. 1. ...

  6. 重拾qt

    最近公司又接了一个煤矿的项目,要写个小程序摘取数据,我是公司唯一c++程序员,本来搞ios搞好好的,现在又得重拾半年没摸得qt了.呵呵...呵呵呵. 这里只记录这次小程序的一些小的总结吧.. 1.中文 ...

  7. Javascript中的函数

    Javascript中的函数 1.什么是函数 函数是被命名的,独立的,完成特定功能的代码段.其可能给调用它的程序返回值,我们把这个代码段就称之为"函数". 被命名的:函数大部分都是 ...

  8. JavaScript原生数组函数

    有趣的JavaScript原生数组函数 在JavaScript中,可以通过两种方式创建数组,构造函数和数组直接量, 其中后者为首选方法.数组对象继承自Object.prototype,对数组执行typ ...

  9. 重拾C

    重拾C,一天一点点_10 来博客园今天刚好两年了,两年前开始学编程. 忙碌近两个月,项目昨天上线了,真心不容易,也不敢懈怠,接下来的问题会更多.这两天调试服务器,遇到不少麻烦. 刚出去溜达了一下,晚上 ...

随机推荐

  1. [UWP]使用Reveal

    1. 前言 之前在 如何使用Fluent Design System 这篇文章里已经简单介绍过Reveal的用法,这篇再详细介绍其它内容. 2. 自定义RevealButtonStyle 我觉得常用I ...

  2. Oracle_insert_delete_update

    Oracle_insert_delete_update --复制表格的结构 create table temp as (select * from emp where 1=2); select * f ...

  3. Laravel5中使用阿里大于(鱼)发送短信验证码

    在做用户注册和个人中心的安全管理时,我实现借助第三方短信平台(阿里大于(鱼))在Laravel框架中进行手机验证的设置:阿里大于,是阿里通信旗下优质便捷的云通信服务平台,整合了三大运营商的通信能力,为 ...

  4. Intellij idea 导入 jdbc

    第一步,去官网https://dev.mysql.com/downloads/connector/j/ 下载驱动程序 第二步,解压压缩包,记住路径 第三步,打开你的idea工程,打开Project S ...

  5. java开发常用jar包

    mail.jar与activation.jar 里面包含了activation.jar和mail.jar两个包.通过里面的类的调用便可以达到发送电子邮件的目的 commons-beanutils.ja ...

  6. flask + Python3 实现的的API自动化测试平台---- IAPTest接口测试平台(总结感悟篇)

    前言: 在前进中去发现自己的不足,在学习中去丰富自己的能力,在放弃时想想自己最初的目的,在困难面前想想怎么踏过去.在不断成长中去磨炼自己. 正文: 时间轴 flask + Python3 实现的的AP ...

  7. ClassLoader.getResourceAsStream() 与 Class.getResourceAsStream()的区别

        Class.getResourceAsStream() 会指定要加载的资源路径与当前类所在包的路径一致. 例如你写了一个MyTest类在包com.test.mycode 下,那么MyTest. ...

  8. java面向对象的三大特性——继承

    ul,ol { margin: 0; list-style: none; padding: 0 } a { text-decoration: none; color: inherit } * { ma ...

  9. 译-HTTP-GET HTTP-POST SOAP protocol for ASP.NET services的异同

    参考 http://stackoverflow.com/questions/4646146/http-soap-get-post https://support.microsoft.com/en-us ...

  10. Linux实践篇--crontab定时任务

    原文出处:http://www.cnblogs.com/tracy/archive/2011/12/27/2303788.html.感谢作者的无私分享 一.  Crontab 介绍           ...