js高级-闭包
function foo(x){
var tmp = 3;
return function(y){ //把一个函数作为返回值,定义时候的作用域
console.log(x+y+(++tmp)) //++tmp先自加再参与表达式运算
}
}
var bar = foo(2) //此时bar指向了匿名函数,匿名函数又指向了 x,tmp两个变量 bar就是一个闭包(匿名函数加x,tmp两个父级变量)
bar(10) //16
bar(20) //27 此时函数执行完成后里面的变量没有回收掉 所以tmp还是4 然后++tmp就是5 x还是2 y就是20 (只要bar没有释放里面的变量就不会回收 。关闭浏览器才会释放)
function d(){
var a = 10;
console.log(a)
}
d(); //执行完成后 a会被回收 浏览器关闭函数会被回收 函数+引用的变量就会形成闭包
闭包的应用
匿名函数自执行
var t = function (a){ //污染全局 尽量不要定义全局变量
console.log(a)
}
t(9);
//尽量少的定义全局变量 例如 jQuery 只定义了 $,jQuery两个
;(function(a){
console.log(a)
})(3)
1、循环注册dom事件
<ul>
<li></li>
<li></li>
</ul>
var lis = document.querySelectorAll('li')
for(var i=0; i<lis.length; i++){
//典型错误
lis[i].onclick = function(){ //事件的方法执行是:当事件触发的时候执行 绑定事件只有点击才执行。 是异步的 当事件触发的时候 i的值为lengh长度了
console.log(i) //变量i是父函数里面的变量
}
//正确
(lis[i].onclick = function(a){ //做成自执行函数来注册事件
console.log(a)
})(i)
}
for(var i = 0; i< 10; i++){ //典型错误
setTimeOut(function(){
console.log(i)
},1000)
}
for(var i = 0; i< 10; i++){ //匿名自执行函数解决
(function(a){
setTimeout(function(){
console.log(a)
},1000)
})(i)
}
js高级-闭包的更多相关文章
- JS高级——闭包
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...
- JS高级——闭包练习
从上篇文章我们知道与浏览器的交互操作如鼠标点击,都会被放入任务队列中,而放入到任务队列中是必须等到主线程的任务都执行完之后才能执行,故而我们有时利用for循环给dom注册事件时候,难以获取for循环中 ...
- JS高级---闭包小案例
闭包小案例 普通的函数 //普通的函数 function f1() { var num = 10; num++; return num; } console.log(f1()); //11 conso ...
- 《Node.js 高级编程》简介与第二章笔记
<Node.js 高级编程> 作者简介 Pedro Teixerra 高产,开源项目程序员 Node 社区活跃成员,Node公司的创始人之一. 10岁开始编程,Visual Basic.C ...
- 理解运用JS的闭包、高阶函数、柯里化
JS的闭包,是一个谈论得比较多的话题了,不过细细想来,有些人还是理不清闭包的概念定义以及相关的特性. 这里就整理一些,做个总结. 一.闭包 1. 闭包的概念 闭包与执行上下文.环境.作用域息息相关 执 ...
- js高级-面向对象继承
一.工厂模式创建对象及优缺点 继承就是把公共的部分抽象出来作为父类,基类.吃饭,跑步等 var a = {}; //批量创建不方便,不能重复设置公共属性的代码 //工厂模式出现了,创建10个Cat对象 ...
- [ JS 进阶 ] 闭包,作用域链,垃圾回收,内存泄露
原网址:https://segmentfault.com/a/1190000002778015 1. 什么是闭包? 来看一些关于闭包的定义: 闭包是指有权访问另一个函数作用域中变量的函数 --< ...
- js高级---js架构
ECMAScript1997 年欧洲计算机制造商协会 39 号技术委员会制定了ECMA-262标准(别名 ECMAScript),而浏览器只是负责实现,ie浏览器实现的结果是jscript,远景浏览器 ...
- JS的闭包、高阶函数、柯里化
本文原链接:https://cloud.tencent.com/developer/article/1326958 https://cloud.tencent.com/developer/articl ...
随机推荐
- angularjs路由传递参数
ui-sref.$state.go 的区别 ui-sref 一般使用在 <a>...</a>: $state.go('someState')一般使用在 controller里面 ...
- 记一次http接口格式摸索
有一个需求,需要用到内部通讯工具的一个ERP转发接口,虽然有接口文档,但是对中文的编码格式没有提示,中间几经周折,最后才想起来通过F12查看提供的测试接口发送请求时的数据格式来分析,经过解析中文只有被 ...
- str 操作
str 认识字符串(重点, 多) 字符: 单一的文字符号 字符按照固定的顺序连成串 被' 或者" 或者''' 或者"""括起来的内容 索引 编号, 顺序 从0开 ...
- switch的穿透,是参数里包含case内容就执行。
package rom; import java.lang.*; /* * switch的穿透,是参数里包含case内容就执行. */ public class Xamle_5 { public st ...
- [Unity插件]AI行为树使用总结
参考链接: https://blog.csdn.net/linxinfa/article/details/72937709 https://blog.csdn.net/wanghaodiablo/ar ...
- web session 原理1
原理 我们都知道,浏览器无状态的.浏览器是操作不了session的,浏览器能够做的只是传递cookie,每次都传递. 把当前主机下的,和当前请求相同域下的cookie 传递到服务器去,只要cooki ...
- spark基础知识介绍2
dataframe以RDD为基础的分布式数据集,与RDD的区别是,带有Schema元数据,即DF所表示的二维表数据集的每一列带有名称和类型,好处:精简代码:提升执行效率:减少数据读取; 如果不配置sp ...
- VideoView播放视频——Android
Android为开发人员提供了一种简单的播放视频媒体的方式,那就是VideoView,本篇博客就来讲讲VideoView如何播放视频,最后将以一个简单的Demo演示. VideoView VideoV ...
- django之setup()
#django包的__init__.py包含setup函数def setup(): """ Configure the settings (this happens as ...
- mac 命令行上传文件,mac tar.gz命令压缩
在mac上可以直接打开命令行给服务器上传文件,注意是本地的命令行,不是服务器的命令行,我就走了绕路 命令可以看这里https://www.cnblogs.com/hitwtx/archive/2011 ...