js closures all in one
js closures all in one
setTimeout 闭包,log(i, arr[¡])
var, let, closures, IIFE
"use strict";
/**
*
* @author xgqfrms
* @license MIT
* @copyright xgqfrms
* @created 2020-09-30
* @modified
*
* @description closures 闭包
* @difficulty Easy
* @complexity O(n)
* @augments
* @example
* @link
* @solutions
*
* @best_solutions
*
*/
const log = console.log;
// setTimeout 闭包,log(i, arr[¡])
const arr = ["A", "B", "C"];
// var
for (var i = 0; i < arr.length; i++) {
if(i == 0) {
log(`var bug`);
}
setTimeout(() => {
log(`i =`, i, `arr[${i}] =`, arr[i]);
}, 1000);
}
// IIFE
for (var i = 0; i < arr.length; i++) {
((i) => {
setTimeout(() => {
if(i == 0) {
log(`\nIIFE`);
}
log(`i =`, i, `arr[${i}] =`, arr[i]);
}, 1000);
})(i);
}
// closures
for (var i = 0; i < arr.length; i++) {
function test(i) {
setTimeout(() => {
if(i == 0) {
log(`\nclosures`);
}
log(` i =`, i, `arr[${i}] =`, arr[i]);
}, 1000);
}
test(i);
}
// let
for (let i = 0; i < arr.length; i++) {
setTimeout(() => {
if(i == 0) {
log(`\nlet`);
}
log(`i =`, i, `arr[${i}] =`, arr[i]);
}, 1000);
}
/*
$ node closures.js
var bug
i = 3 arr[3] = undefined
i = 3 arr[3] = undefined
i = 3 arr[3] = undefined
IIFE
i = 0 arr[0] = A
i = 1 arr[1] = B
i = 2 arr[2] = C
closures
i = 0 arr[0] = A
i = 1 arr[1] = B
i = 2 arr[2] = C
let
i = 0 arr[0] = A
i = 1 arr[1] = B
i = 2 arr[2] = C
*/
for & log
"use strict";
/**
*
* @author xgqfrms
* @license MIT
* @copyright xgqfrms
* @created 2020-10-16
* @modified
*
* @description for & log
* @difficulty Easy Medium Hard
* @complexity O(n)
* @augments
* @example
* @link
* @solutions
*
* @best_solutions
*
*/
const log = console.log;
const len = 3;
for (var i = 0; i < len; i++) {
setTimeout(() => {
log(` i =`, i);
}, 0);
}
// ES6 let
for (let j = 0; j < len; j++) {
setTimeout(() => {
if(j === 0) {
log(`\n`);
}
log(` j =`, j);
// if(j === len - 1) {
// log(`\n`);
// }
}, 0);
}
// IIFE
for (var k = 0; k < len; k++) {
(function(k) {
setTimeout(() => {
if(k === 0) {
log(`\n`);
}
log(` k =`, k);
}, 0);
})(k);
}
// 闭包 closure
for (var l = 0; l < len; l++) {
function test(l) {
setTimeout(() => {
if(l === 0) {
log(`\n`);
}
log(` l =`, l);
}, 0);
}
test(l);
}
/*
$ node for-var-closures.js
i = 3
i = 3
i = 3
j = 0
j = 1
j = 2
k = 0
k = 1
k = 2
l = 0
l = 1
l = 2
*/
refs
xgqfrms 2012-2020
www.cnblogs.com 发布文章使用:只允许注册用户才可以访问!
原创文章,版权所有️xgqfrms, 禁止转载 ️,侵权必究️!
js closures all in one的更多相关文章
- You Don't Know JS: Scope & Closures (第一章:什么是Scope)
Content What is Scope? Lexical Scope Function Vs. Block Scope Hoisting Scope Closures Appendix: Dyna ...
- You Don't Know JS: Scope & Closures(翻译)
Chapter 1: What is Scope? 第一章:什么是作用域 One of the most fundamental paradigms of nearly all programming ...
- js的closures(闭包)
JS中的闭包(closure) 闭包(closure)是Javascript语言的一个难点,也是它的特色,很多高级应用都要依靠闭包实现.下面就是我的学习笔记,对于Javascript初学者应该是很有用 ...
- You Don't Know JS: Scope & Closures (第4章: Hoisting)
Chapter4: Hoisting 变量附加到哪个层次的scope,由它们在哪里和如何声明(let, var)来决定. Function scope/Block scope都有相同的法则:任何变量在 ...
- You Don't Know JS: Scope & Closures (第3章: 函数 vs 块作用域)
第二章,作用域由一系列的bubbles组成.每一个都代表了一个container或bucket,装着被声明的identifiers(variables, functions).这些bubbles相互嵌 ...
- You Don't Know JS: Scope & Closures (第2章: Lexical Scope)
2种主要的models for how scope work. 最普遍的是Lexical Scope. 另一种 Dynamic Scope.(在Appendix a中介绍.和Lexical Scope ...
- You Don't Know JS: Scope & Closures (附加:Lexical/dynamic作用域)(附加:Lexical-this)
JavaScript只有Lexical Scope 模式 Lexical Scope就是在写代码的时候,定义函数的时候创建的作用域! 而动态作用域是在runtime时,函数被调用的地方的作用域! 实际 ...
- (未完成👃)You Don't Know JS: Scope & Closures (第5章: Scope & Closures)
Chapter 5: Scope Closure 我们到达这里时,已经对作用域如何工作有了非常健康稳固的理解. 下面,我们转移注意力到一个及其重要,但长期难以理解,几乎是神话中的部分语言:Closur ...
- (翻译)《Hands-on Node.js》—— Why?
事出有因 为何选择event loop? Event Loop是一种推进无阻塞I/O(网络.文件或跨进程通讯)的软件模式.传统的阻塞编程也是用一样的方式,通过function来调用I/O.但进程会在该 ...
随机推荐
- 什么是STP
简介 了解STP 配置STP 相关信息 简介 STP(Spanning Tree Protocol)是运行在交换机上的二层破环协议,环路会导致广播风暴.MAC地址表震荡等后果,STP的主要目的就是确保 ...
- 一键配置 github 可用的 hosts
最近发现访问 Github 各种不畅通, 静态资源经常加载不出来. 写了一个一键脚本修改本机 /etc/hosts 文件, 切换到可用的 IP (数据来自 https://gitee.com/xuew ...
- 详解Go中内存分配
转载请声明出处哦~,本篇文章发布于luozhiyun的博客:https://www.luozhiyun.com 本文使用的go的源码15.7 介绍 Go 语言的内存分配器就借鉴了 TCMalloc 的 ...
- mysql本地中127.0.0.1连接不上数据库怎么办
首先在本地使用Navicat for MySQL建立一个bai数据库.在dreamweaver中建立一个PHP格式的网页,方便链接测试.测试发du现,如果zhi无法使用localhost链接mysql ...
- 大数据开发-Spark-拷问灵魂的5个问题
1.Spark计算依赖内存,如果目前只有10g内存,但是需要将500G的文件排序并输出,需要如何操作? ①.把磁盘上的500G数据分割为100块(chunks),每份5GB.(注意,要留一些系统空间! ...
- Spring听课笔记(tg)
0. 地址:https://www.bilibili.com/video/av21335209 1.综述,Spring主要的复习要点集中在以下几点 -- Spring的整体结构,Maven依赖(环境搭 ...
- SVN、GIT比较
Git是分布式的,完全可以不备份代码,下载下来后,在本地不必联网就可以看到所有的log,跟其他同事不会有太多的冲突,自己写的代码放在自己电脑上,一段时间后再提交.合并,也可以不用联网在本地提交 SVN ...
- Vue技术点整理-vue.config.js
1,proxy代理解决本地开发环境跨域问题 配置proxy代理后,proxy会将任何未知请求 (没有匹配到静态文件的请求) 代理到 https://192.168.3.49:8080 vue.conf ...
- Prometheus+Grafana通过kafka_exporter监控kafka
Prometheus+Grafana通过kafka_exporter监控kafka 一.暴露 kafka-metric 方式 二.jmx_exporter方式 2.1 下载jmx_prometheus ...
- 内网渗透之信息收集-linux
linux 系统信息 grep MemTotal /proc/meminfo #查看系统内存总量 cat /etc/issue #查看系统名称 ...