一、事件循环机制的理解

test();//按秒输出5个5

function test() {
for (var i = 0; i < 5; i++) {
setTimeout(() => {
console.log(i);
}, 1000 * i);//for循环里面添加异步操作
}
}
test();//分别按秒输出0  1  2  3  4

function test() {
for (let i = 0; i < 5; i++) {
setTimeout(() => {
console.log(i);
}, 1000 * i);//for循环里面添加异步操作
}
}

首先,先解释一下产生不同的结果的原因:

我们知道,var跟let的核心区别主要就是作用域的问题。

详细解释:

因为let i 声明的是区块变量,每个i只能存活到大括号结束,并不会把后面for循环的 i 值赋给前面的setTimeout中的i;

而var i 则是局部变量,这个 i 的生命周期不受for循环的大括号限制;

这道面试题还涉及到了JavaScript中的事件循环机制,稍微重点讲解一下:

我们知道,JavaScript是单线程的(一次只能执行一个任务),那单线程是如何做到异步的呢?

在大学里,数据结构中,我们学过栈(先进后出)和队列(先进先出)这两种数据结构吧。

js引擎中,便用到了,栈中存放执行的代码,队列中存放多个任务。

事件循环机制(Event Loop):js会检查栈中是否为空,为空的话,将队列中的任务加入到这个栈中。

这样的话,还是不能实现异步的,毕竟js是单线程,一次只能执行一个任务,即使有栈和队列,还是不能实现异步的,那异步到底是怎么实现的呢?

这里需要了解一下回调函数,举个例子,jQuery中Ajax异步请求我们经常用到吧,其中的success就是个回调函数。

其实呢,如果是个异步操作的话,当放入到队列中后,它会注册一个回调事件,然后再执行这个回调函数,如此,便实现了异步。

举个例子吧:

var x = 6;
console.log(x);
var pro = new Promise(function (reslove, reject) {
var i = 3;
setTimeout(() => {
i++;
reslove(i);
}, 3000);
});
pro.then(function (data) {
console.log(data);
});

分析:前两行代码定义变量便打印出来,接下来便是个异步操作,便是通过resolve回调函数来真正实现异步的。

二、函数柯里化

乍一看,给人一种很是高大上的感觉。这东西呢,理解起来真的是云里雾里的。

柯里化,是函数式编程里面的一个概念。

说下初步的理解吧

function add(num1, num2) {
return num1 + num2;
}
// 柯里化的思想
function curriedAdd(num2) {
return add(5, num2);
}
console.log(add(2, 3));//5 写好一个函数,然后在需要的时候调用这个函数。这便是函数式编程的基本思想。
console.log(curriedAdd(3));//8

正如上面的代码,本来add方法里面需要传递2个参数,函数柯里化后,类似curriedAdd只需要传递1个参数即可。这便是所谓的函数柯里化。当然,这上面并不够标准,只是表达了柯里化的思想。

function add(num1, num2) {
return num1 + num2;
}
//柯里化方法
function curry(fn) {
var args = Array.prototype.slice.call(arguments, 1);
return function () {
var innerArgs = Array.prototype.slice.call(arguments);
var finalArgs = args.concat(innerArgs);
return fn.apply(null, finalArgs);
}
}
var curriedAdd = curry(add, 5);//函数柯里化
console.log(curriedAdd(3));//8

那函数柯里化的好处是什么呢?既然提出了这个概念,没有好处是不可能滴!

简单来说就是为了简便,调用函数的时候,只需传递一个参数。当然了,我理解得还不够深,没达到那种透彻的地步,仍然有点云里雾里的感觉,没充分地体会到函数柯里化的好处。

总结

发现自己还有很长的一段路要走!钻的还是不够深!不够精!

JavaScript中的事件循环机制跟函数柯里化的更多相关文章

  1. 精读JavaScript模式(六),Memoization模式与函数柯里化的应用

    假期就这么结束了!十天假就有三天在路上,真的难受!想想假期除了看了两场电影貌似也没做什么深刻印象的事情.流浪地球,特效还是很赞,不过对于感情的描写还是逃不掉拖沓和尴尬的通病,对于国产科幻还是抱有支持的 ...

  2. JavaScript函数柯里化的一些思考

    1. 高阶函数的坑 在学习柯里化之前,我们首先来看下面一段代码: var f1 = function(x){ return f(x); }; f1(x); 很多同学都能看出来,这些写是非常傻的,因为函 ...

  3. 深入理解javascript中的事件循环event-loop

    前面的话 本文将详细介绍javascript中的事件循环event-loop 线程 javascript是单线程的语言,也就是说,同一个时间只能做一件事.而这个单线程的特性,与它的用途有关,作为浏览器 ...

  4. JavaScript中的函数柯里化与反柯里化

    一.柯里化定义 在计算机科学中,柯里化是把 接受多个参数的函数 变换成 接受一个单一参数(最初函数的第一个参数)的函数 并且返回 接受余下参数且返回结果的新函数的技术 高阶函数 高阶函数是实现柯里化的 ...

  5. 简单粗暴详细讲解javascript实现函数柯里化与反柯里化

    函数柯里化(黑人问号脸)???Currying(黑人问号脸)???妥妥的中式翻译既视感:下面来一起看看究竟什么是函数柯里化: 维基百科的解释是:把接收多个参数的函数变换成接收一个单一参数(最初函数的第 ...

  6. 【转载】JS中bind方法与函数柯里化

    原生bind方法 不同于jQuery中的bind方法只是简单的绑定事件函数,原生js中bind()方法略复杂,该方法上在ES5中被引入,大概就是IE9+等现代浏览器都支持了(有关ES5各项特性的支持情 ...

  7. 深入理解javascript函数进阶系列第二篇——函数柯里化

    前面的话 函数柯里化currying的概念最早由俄国数学家Moses Schönfinkel发明,而后由著名的数理逻辑学家Haskell Curry将其丰富和发展,currying由此得名.本文将详细 ...

  8. 简单粗暴详细讲解javascript实现函数柯里化

    函数柯里化(黑人问号脸)???Currying(黑人问号脸)???妥妥的中式翻译既视感:下面来一起看看究竟什么是函数柯里化: 维基百科的解释是:把接收多个参数的函数变换成接收一个单一参数(最初函数的第 ...

  9. Javascript函数柯里化(curry)

    函数柯里化currying,是函数式编程非常重要的一个标志.它的实现需要满足以下条件,首先就是函数可以作为参数进行传递,然后就是函数可以作为返回值return出去.我们依靠这个特性编写很多优雅酷炫的代 ...

随机推荐

  1. 南阳ccpc C题 The Battle of Chibi && hdu5542 The Battle of Chibi (树状数组优化+dp)

    题意: 给你一个长度为n的数组,你需要从中找一个长度为m的严格上升子序列 问你最多能找到多少个 题解: 我们先对原序列从小到大排序,排序之后的序列就是一个上升序列 这里如果两个数相等的话,那么因为题目 ...

  2. URAL - 1029 dp

    题意: n层楼,每层楼有m个房间.找出一个路径从第一层到达第M层,使得路径上的所有数的和是所有可达路径中最小的,每次上到下一层以后就不能再上去,依次输出路径上的各点在所在层的列数. 题解: 参考链接: ...

  3. hdu5433 Xiao Ming climbing

    Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/65536 K (Java/Others) Total Submission ...

  4. CF1463-A. Dungeon

    题意: 你面前有三个怪物,他们分别有a, b, c点血量.现在你可以指定一个怪物,用大炮向他们射击,之后该怪物就会掉一滴血.每七次射击就会使得炮弹威力加强一次,即第7, 14, 21次射击的时候炮弹威 ...

  5. js中for循环遍历的写法

    众所周知,for循环是编程中必不可少的知识点:那么如何高效的写出循环呢? 我们要先知道for循环的基础样式是由自有变量自增自减和if判组成的: 1 for(条件){ 2 执行语句 3 } 而for循环 ...

  6. Service Cloud 零基础(四)快速配置一个问卷调查(无开发)

    本篇参考:https://trailhead.salesforce.com/content/learn/modules/survey-basics 我们在工作和生活中会经历过形形色色得调查问卷,有一些 ...

  7. codeforces 1016C - Vasya And The Mushrooms 【构造 + 思维】

    题目链接:戳这里 题意:从(1,1)出发,一遍把格子走完,每个格子只能走一次.问怎么走总和最大. 解题思路:画图可知,总共就3种走法的混合. dw: 样例1的走法 up: 样例1反过来的走法 lp: ...

  8. HDU 6706 huntian oy(杜教筛 + 一些定理)题解

    题意: 已知\(f(n,a,b)=\sum_{i=1}^n\sum_{j=1}^igcd(i^a-j^a,i^b-j^b)[gcd(i,j)=1]\mod 1e9+7\),\(n\leq1e9\),且 ...

  9. mybatis(一)常见ORM框架及JDBC操作工具类

      转载:https://www.cnblogs.com/wuzhenzhao/p/11075569.html 在Java 程序里面去连接数据库,最原始的办法是使用JDBC 的API.我们先来回顾一下 ...

  10. 求第n行杨辉三角(n很大,取模

    1 #include <iostream> 2 #include <cstdio> 3 4 using namespace std; 5 typedef long long l ...