首先我们来绑定一个函数给click事件,这个很好理解,就是创建一个匿名函数作为回调绑定给click事件,如下:

但如果我们想声明一个函数作为回调来绑定多个元素呢,例如下面(注意:绑定事件后不用加括号,否则是调用函数,此时绑定的是函数执行后返回的值):

当然上面这样是没有问题的,但是如果changSize()需要传入形参呢,例如下面:

这样的话就会出错,在给click事件绑定函数回调时就直接执行了changSize()函数,并且绑定的是返回的结果,而非changSize()函数。

这时闭包就可以解决这个问题,如下:

将执行语句作为函数返回,在绑定事件时就函数就不再执行,而是作为新的匿名函数回调绑定给click事件。

当然我们也不一定非要绑定给事件时,也可以传递给新的函数,如下:

新手学习日志,理解不当之处,还望大佬批评指正!

JS闭包应用场景之函数回调(含函数的调用个人理解)的更多相关文章

  1. Javascript中的回调函数和匿名函数的回调

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  2. Javascript中的回调函数和匿名函数的回调示例介绍

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  3. Js闭包常见三种用法

        Js闭包特性源于内部函数可以将外部函数的活动对象保存在自己的作用域链上,所以使内部函数的可以将外部函数的活动对象占为己有,可以在外部函数销毁时依然存有外部函数内的活动对象内容,这样做的好处是可 ...

  4. (原创)JS闭包看代码理解

    <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="C ...

  5. 浅谈js闭包(closure)

    相信很多从事js开发的朋友都或多或少了解一些有关js闭包(closure)的知识. 本篇文章是从小编个人角度,简单地介绍一下有关js闭包(closure)的相关知识.目的是帮助一些对js开发经验不是很 ...

  6. JavaScript函数节流与函数去抖

    介绍 首先解释一下这两个概念: 函数节流(throttle):是让一个函数无法在很短的时间间隔内连续调用,当上一次函数执行后过了规定的时间间隔,才能进行下一次该函数的调用. 函数去抖(debounce ...

  7. JS闭包的理解及常见应用场景

    JS闭包的理解及常见应用场景 一.总结 一句话总结: 闭包是指有权访问另一个函数作用域中的变量的函数 1.如何从外部读取函数内部的变量,为什么? 闭包:f2可以读取f1中的变量,只要把f2作为返回值, ...

  8. 闭包函数&回调函数

    闭包函数&回调函数 谈到回调函数,不得不提匿名函数;匿名函数,也叫闭包函数,也就是没有名字的函数,它可以单独存在,也可以将其赋值给某一个变量.so,先来看一下闭包函数. 闭包函数 php文档: ...

  9. [Node.js] 闭包和高阶函数

    原文地址:http://www.moye.me/2014/12/29/closure_higher-order-function/ 引子 最近发现一个问题:一部分写JS的人,其实对于函数式编程的概念并 ...

随机推荐

  1. python冷知识(续)

    python 冷知识 1.交互式中修改最大递归深度 大家都知道使用递归是有风险的,递归深度过深容易导致堆栈的溢出. 那到底,默认递归次数限制是多少呢? 可以使用sys这个库来查看 >>&g ...

  2. springboot 整合retry(重试机制)

    当我们调用一个接口可能由于网络等原因造成第一次失败,再去尝试就成功了,这就是重试机制,spring支持重试机制,并且在Spring Cloud中可以与Hystaix结合使用,可以避免访问到已经不正常的 ...

  3. 学习前端的时候,突然想起了Sharepoint母版页里的占位符,算知识的融会不?

    今天看到这个段话,我就想起来当时学习Sharepoint的时候,总是搞不明白我们老师讲的那个母版页里的占位符到底是干啥的.现在看到了类似的东西,让我想起来了之前一直搞不懂的东西,很感慨. (完)

  4. html实体引用

    原义字符 等价字符引用 < < > > " " ' &apos; & &

  5. 查看笔记本SN序列号

    https://www.pstips.net/getting-computer-serial-number.html $ComputerName = $env:COMPUTERNAME $serial ...

  6. web网页多语言的实现方案_前端实现多语言切换

    实现的效果 需要在web中实现多语言的切换,当用户语言切换完成后下次重新打开网页,也是上次设置的语言进行显示. 资源网站搜索大全https://55wd.com 实现步骤 1.在用户点击切换语言后,把 ...

  7. 很实用的h5实现名片扫描识功能快速结合市场运营

    功能描述: 点击名片识别按钮,将名片上的个人信息扫描并解析出来显示. 实现步骤: 1.点击第一个页面上的名片识别按钮,调出手机摄像头和相册,让用户进行选择 2.获取照片或者图片的base64数据,传值 ...

  8. OldTrafford after 102 days

    THE RED GO MARCHING ON   One Team One Love Through the highs and the lows   One hundred and two long ...

  9. Traffic Real Time Query System,题解

    题目链接 题意: 问从一条边到另一条边的必经点. 分析: 首先,问必经点,当然是要点双缩点(圆方树)啦,关键是把边映射到哪一点上,其实直接放在某联通分量的方点上就行,但是这个点并不好找,所以我们考虑一 ...

  10. Python-读取文件的大小

    1.python读取文件以及文件夹的大小 1. os.path.getsize(file_path):file_path为文件路径 import os os.path.getsize('d:/svn/ ...