function wrapElements(a){

var res=[],i,n;

for(i=0,n=a.length;i<n;i++){

res[i]=function(){return a[i]};

}

return res;

}

var wrapped=wrapElements([10,20,30,40,50]);

var f=wrapped[0];

f();//undefined

这个可以由之前的闭包来讲,res里的每个函数都是一个闭包,它们都可以访问上一个函数的作用域内的变量,所以每个函数都可以访问到i,但这个i是for循环运行过的i,它的值应该是a.length。所以f里对应的应该就是a[a.length],这时数组已经溢出了,所以是undefined。

注意闭包存储的是其外部变量的引用而不是值。

下面这个是一种解决方法

function wrapElements(a){

var res=[],i,n;

for(i=0,n=a.length;i<n;i++){

(function(j){

res[j]=function(){return a[j]};

})(i)

}

return res;

}

var wrapped=wrapElements([10,20,30,40,50]);

var f=wrapped[0];

f();//10

这是使用立即调用的函数表达式或叫IIFE(immediately-invoked function expression)。这是一种解决js缺少块级作用域的方法

使用IIEF来创建局部作用域注意点:

  1. 代码块不能包含任何跳出块的break和continue语句。
  2. 如果代码块引用了this或特别的arguments变量,会得到错误的含义。

提示

  • 理解绑定与赋值的区别
  • 闭包通过引用而不是值捕获它们的外部变量
  • 使用立即调用的函数表达式(IIFE)来创建局部作用域
  • 当心在立即调用的函数表达式中包裹代码块可能改变其行为的情形

[Effective JavaScript 笔记] 第13条:使用立即调用的函数表达式创建局部作用域的更多相关文章

  1. [Effective JavaScript 笔记]第17条:间接调用eval函数优于直接调用

    eval函数不仅仅是一个函数.大多数函数只访问定义它们所在的作用域,而不能访问除此之外的作用域(词法作用域).eval函数具有访问调用它时的整个作用域的能力.编译器编写者首次设法优化js时,eval函 ...

  2. [Effective JavaScript 笔记]第31条:使用Object.getPrototypeOf函数而不要使用__proto__属性

    ES5引入Object.getPrototypeOf函数作为获取对象原型的标准API,但由于之前的很多js引擎使用了一个特殊的__proto__属性来达到相同的目的.但有些浏览器并不支持这个__pro ...

  3. [Effective JavaScript 笔记]第27条:使用闭包而不是字符串来封装代码

    函数是一种将代码作为数据结构存储的便利方式,代码之后可以被执行.这使得富有表现力的高阶函数抽象如map和forEach成为可能.它也是js异步I/O方法的核心.与此同时,也可以将代码表示为字符串的形式 ...

  4. [Effective JavaScript 笔记] 第4条:原始类型优于封闭对象

    js有5种原始值类型:布尔值.数字.字符串.null和undefined. 用typeof检测一下: typeof true; //"boolean" typeof 2; //&q ...

  5. [Effective JavaScript 笔记] 第5条:避免对混合类型使用==运算符

    “1.0e0”=={valueOf:function(){return true;}} 是值是多少? 这两个完全不同的值使用==运算符是相等的.为什么呢?请看<[Effective JavaSc ...

  6. [Effective JavaScript 笔记]第28条:不要信赖函数对象的toString方法

    js函数有一个非凡的特性,即将其源代码重现为字符串的能力. (function(x){ return x+1 }).toString();//"function (x){ return x+ ...

  7. 深入理解javascript系列(4):立即调用的函数表达式

    本文来自汤姆大叔 前言 大家学JavaScript的时候,经常遇到自执行匿名函数的代码,今天我们主要就来想想说一下自执行. 在详细了解这个之前,我们来谈了解一下“自执行”这个叫法,本文对这个功能的叫法 ...

  8. [JS]深入理解JavaScript系列(4):立即调用的函数表达式

    转自:汤姆大叔的博客 前言 大家学JavaScript的时候,经常遇到自执行匿名函数的代码,今天我们主要就来想想说一下自执行.在详细了解这个之前,我们来谈了解一下"自执行"这个叫法 ...

  9. [Effective JavaScript 笔记]第67条:绝不要同步地调用异步的回调函数

    设想有downloadAsync函数的一种变种,它持有一个缓存(实现为一个Dict)来避免多次下载同一个文件.在文件已经被缓存的情况下,立即调用回调函数是最优选择. var cache=new Dic ...

随机推荐

  1. 解放双手:如何在本地调试远程服务器上的Node代码

    写在前面 谈到node断点调试,目前主要有三种方式,通过node内置调试工具.通过IDE(如vscode).通过node-inspector,三者本质上差不多.本文着重点在于介绍 如何在本地通过nod ...

  2. 最简单的 Web Service 入门 (看了包会)

    原理:WebService是一个SOA(面向服务的编程)的架构,它是不依赖于语言,不依赖于平台,可以实现不同的语言间的相互调用,通过Internet进行基于SOAP协议的网络应用间的交互. 作用:主要 ...

  3. 微信小程序剖析【下】:运行机制

    在上一篇<微信小程序「官方示例代码」浅析[上]>中,我们只是简单的罗列了一下代码,这一篇,让我们来玩点刺激的——就是看看IDE的代码,了解它是怎么运行的. 还好微信的开发团队在软件工程的实 ...

  4. (旧)子数涵数·Flash——遮罩动画

    一.打开Flash,并新建一个flash文档 二.然后,用矩形工具,快捷键R,绘制一个背景图 三.新建一个图层 四.右击刚刚新建的"图层2"图层,选择"遮罩层" ...

  5. DOM系列---进阶篇

    内容提纲: 1.DOM类型 2.DOM扩展 3.DOM操作内容 一.DOM类型 DOM基础篇中,我们了解了DOM的节点并且了解怎样查询和操作节点,而本身这些不同的节点,又有着不同的类型.   DOM类 ...

  6. 解决 SQL Server Profiler 跟踪[不断]出现检索数据

    问题简单回顾: 当我们使用SQL Server Profiler根据数据时,有时刚打开什么也没干呢,就显示很多数据了,当我们用橡皮擦清除,没过两秒就又有了,如图: 是不是很恼火!~不怕,解决方案如下: ...

  7. Android音乐播放器的开发实例

    本文将引导大家做一个音乐播放器,在做这个Android开发实例的过程中,能够帮助大家进一步熟悉和掌握学过的ListView和其他一些组件.为了有更好的学习效果,其中很多功能我们手动实现,例如音乐播放的 ...

  8. beta版本贡献率

    队名:攻城小分队 031302410 郭怡锋 : 占比:50% 031302411 洪大钊: 占比:30% 031302206 陈振贵: 占比:10% 031302416 黄伟祥: 占比:10%

  9. sql-select

    SELECT 将资料从数据库中的表格内选出 指令 SELECT "栏位名" FROM "表格名"; 例如:查询Store_Information表中所有的的St ...

  10. DLX模型问题

    问题:sevenzero liked Warcraft very much, but he haven't practiced it for several years after being add ...