闭包看似很简单,其实牵扯了很多东西,例如:上下文作用域(事件处理程序)、内存占用、局部以及全局变量、回调函数以及编程模式等

首先我们谈论一个问题,为什么需要闭包?

1.var全局定义(全局污染)- 指的是同一变量名会影响到所有的同名变量。

<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<script src="Test.js"></script>
<!-- <script src="Tests.js"></script> -->
<script>
console.log(ok);
</script>
</head> <body> </body> </html>

运行好像真的没问题,没关系,我们试一试下面

//Test.js

var ok = "666";
//Tests.js
var ok = "999";

搞什么嘛,明明是不同JavaScript文件 - 牵扯到JavaScript引擎对JavaScript的处理机制。

2.ES6相对于ES5,增加了const 、let声明变量的方式(你该知道它们为什么出世的)。

//Test.js
let ok = "666";
//Tests.js

var ok = "999";

当我们其中一个js文件使用了Let同名变量声明后,浏览器报错了

说该变量已经被使用了! 当我们更改了Tests.js同名变量以后,浏览器会作何反应呢?

//Tests.js

var oks = "999";

它显示了let定义的变量值

Let只能被变量同名定义一次,记住了! 下面这个示例会告诉你

 <!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<script src="Test.js"></script>
<script src="Tests.js"></script>
<script>
let ok = "000";
console.log(ok);
</script>
</head> <body> </body> </html>

const 又是怎么回事呢?(const只能被赋值一次,且不可修改,以后可修改的只能是它的对象元素)

//Test.js

// var ok ="666";
let ok = "666";
const ju = "888";
 <!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<script src="Test.js"></script>
<script src="Tests.js"></script>
<script>
const ju = "111";
console.log(ju);
</script>
</head> <body> </body> </html>

什么是闭包

闭包允许你从内部函数访问外部函数的作用域。

在JavaScript中,每次创建函数时都会在函数创建时创建闭包。

要使用闭包,只需在另一个函数内定义一个函数并将其暴露。要公开一个函数,将其返回或传递给另一个函数。

即使在外部函数返回后,内部函数也可以访问外部函数作用域中的变量。

在JavaScript中,闭包是用于启用数据隐私的主要机制。当您使用闭包实现数据隐私时,封闭变量只在包含(外部)函数的范围内。

除了通过对象的特权方法外,您无法从外部范围获取数据。在JavaScript中,在闭包范围内定义的任何公开方法都是有特权的。

data-private.js

 const getSecret = (secret) => {
return {
get: () => secret
};
}; test('Closure for object privacy.', assert => {
const msg = '.get() should have access to the closure.';
const expected = 1;
const obj = getSecret(1); const actual = obj.get(); try {
assert.ok(secret, 'This throws an error.');
} catch (e) {
assert.ok(true, `The secret var is only available
to privileged methods.`);
} assert.equal(actual, expected, msg);
assert.end();
});

谈论javascript闭包的更多相关文章

  1. 《Web 前端面试指南》1、JavaScript 闭包深入浅出

    闭包是什么? 闭包是内部函数可以访问外部函数的变量.它可以访问三个作用域:首先可以访问自己的作用域(也就是定义在大括号内的变量),它也能访问外部函数的变量,和它能访问全局变量. 内部函数不仅可以访问外 ...

  2. JavaScript 闭包深入浅出

    闭包是什么? 闭包是内部函数可以访问外部函数的变量.它可以访问三个作用域:首先可以访问自己的作用域(也就是定义在大括号内的变量),它也能访问外部函数的变量,和它能访问全局变量. 内部函数不仅可以访问外 ...

  3. JavaScript闭包(Closure)

    JavaScript闭包(Closure) 本文收集了多本书里对JavaScript闭包(Closure)的解释,或许会对理解闭包有一定帮助. <你不知道的JavsScript> Java ...

  4. Javascript闭包和C#匿名函数对比分析

    C#中引入匿名函数,多少都是受到Javascript的闭包语法和面向函数编程语言的影响.人们发现,在表达式中直接编写函数代码是一种普遍存在的需求,这种语法将比那种必须在某个特定地方定义函数的方式灵活和 ...

  5. javascript闭包理解

    //闭包理解一 function superFun(){ var _super_a='a'; function subfuc(){ console.log(_super_a); } return su ...

  6. Javascript闭包深入解析及实现方法

    1.什么是闭包 闭包,官方对闭包的解释是:一个拥有许多变量和绑定了这些变量的环境的表达式(通常是一个函数),因而这些变量也是该表达式的一部分.闭包的特点:1. 作为一个函数变量的一个引用,当函数返回时 ...

  7. javascript闭包和作用域链

    最近在学习前端知识,看到javascript闭包这里总是云里雾里.于是翻阅了好多资料记录下来本人对闭包的理解. 首先,什么是闭包?看了各位大牛的定义和描述各式各样,我个人认为最容易一种说法: 外部函数 ...

  8. JavaScript闭包深入解析

    for (var i=1; i<=5; i++) { setTimeout( function timer() { console.log( i ); }, i*1000 ); } --上面这段 ...

  9. JavaScript 闭包系列二(匿名函数及函数的闭包)

    一. 匿名函数 1. 函数的定义,可分为三种 1) 函数声明方式 function double(x) {     return 2*x; } 2)Function构造函数,把参数列表和函数体都作为字 ...

随机推荐

  1. C/C++ 数组、字符串、string

    1.定义数组时,数组中元素的个数不能是动态的,不能用变量表示(const变量可以),必须是已知的. 2.引用数组时只能引用数组中某个元素,不能引用整个数组. 3.定义二维数组时,若同时全部初始化,则可 ...

  2. leetcode_650. 2 Keys Keyboard_dp

    https://leetcode.com/problems/2-keys-keyboard/ 初始一个A,两种操作,复制当前所有A,粘贴,问得到n个A最少需要多少步操作. class Solution ...

  3. Tensorflow入门-上

    前置准备 在阅读本文之前,请确定你已经了解神经网络的基本结构以及前向传播.后向传播的基本原理,如果尚未了解,可以查看下文. 深度学习之神经网络 什么是TensorFlow? TensorFlow是Go ...

  4. date - 打印或设置系统日期和时间

    总览 date [选项]... [+格式] date [选项] [MMDDhhmm[[CC]YY][.ss]] 描述 根据指定格式显示当前时间或设置系统时间. -d, --date=STRING 显示 ...

  5. 使用webpack+vue.js构建前端工程化

    参考文章:https://blog.csdn.net/qq_40208605/article/details/80661572 使用webpack+vue.js构建前端工程化本篇主要介绍三块知识点: ...

  6. Sql Server cross apply和outer apply

    with result as( select t.str from( ' str union all ' str union all ' str union all ' str union all ' ...

  7. mysql事件【定时器】

    一,借鉴[luo奔的蜗牛] 1.创建一张表 create table mytable ( id int auto_increment not null, name ) not null default ...

  8. 笔试算法题(37):二叉树的层序遍历 & 最长递增的数字串

    出题:要求层序遍历二叉树,从上到下的层次,每一层访问顺序为从左到右,并将节点一次编号,输出如下:如果只要求打印指定的level的节点,应该如何实现. a b  c d  e  f  g h  i  分 ...

  9. Windows——bat中的路径和工具栏运行bat的坑

    工具栏添加的批处理环境 编写一个简单的批处理文件 set testEnv = %cd% pause 这里第一句:设置当前文件夹路径为环境变量testEnv的值 这里第二句:暂停命令窗口 第一次我们直接 ...

  10. 根据Dockerfile创建hello docker镜像

    一.编写hello可执行c文件: 1.安装:gcc glibc glibc-static yum install -y gcc glibc glibc-static 2.编写hello.c:vim h ...