走进JavaScript——重拾函数

时间:2021-10-03 11:43:47

创建函数

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

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. Type.IsContextful 说明

    首先看MSDN的说明: 中文:获取一个值,通过该值指示 Type 在上下文中是否可以被承载. 英文:Gets a value indicating whether the Type can be ho ...

  2. sql server中批量插入与更新两种解决方案分享

    若只是需要大批量插入数据使用bcp是最好的,若同时需要插入.删除.更新建议使用SqlDataAdapter我测试过有很高的效率,一般情况下这两种就满足需求了 bcp方式 复制代码 代码如下: /// ...

  3. JavaScript学习笔记-用于模式匹配的String方法

    用于模式匹配的String方法:   String支持4种使用正则表达式的方法:           seach()用于检索,参数是一个正则表达式,返回第一个与之匹配的子串的位置,找不到则返回-1,如 ...

  4. JavaWEB 通过Listener理解域对象生命周期

    利用 ServletRequestListener.HttpSessionListener 以及 ServletContextListener 可以把request,session,以及Applica ...

  5. mysql——查询练习

    Sutdent表的定义 字段名 字段描述 数据类型 主键 外键 非空 唯一 自增 Id 学号 INT(10) 是 否 是 是 是 Name 姓名 VARCHAR(20) 否 否 是 否 否 Sex 性 ...

  6. UVa 1339,紫书P73,词频

    题目链接:https://uva.onlinejudge.org/external/13/1339.pdf 紫书P73 解题报告: #include <stdio.h> #include ...

  7. Geeks Interview Question: Ugly Numbers

    Ugly numbers are numbers whose only prime factors are 2, 3 or 5. The sequence1, 2, 3, 4, 5, 6, 8, 9, ...

  8. Swift --&gt&semi; Map &amp&semi; FlatMap

    转载自:https://segmentfault.com/a/1190000004050907 Map map函数能够被数组调用,它接受一个闭包作为参数,作用于数组中的每个元素.闭包返回一个变换后的元 ...

  9. python操作email

    python操作email 参考链接: python官网imaplib: https://docs.python.org/2/library/imaplib.html Python 用IMAP接收邮件 ...

  10. Spring Boot 异常处理

    Spring Boot 异常处理 本节介绍一下 Spring Boot 启动时是如何处理异常的?核心类是 SpringBootExceptionReporter 和 SpringBootExcepti ...