上一章 JS执行上下文、变量提升、函数声明 传送门:https://segmentfault.com/a/11...

本次我们主要讲讲变量作用域和闭包
变量作用域:
顾名思义:变量起作用的范围。
变量分为全局变量和局部变量。
全局变量:在任何地方都能用,在所有函数之外。
局部变量:只能在定义它的函数中,以及它的子函数中使用。

当前作用域没有定义的变量,称为自由变量。

举例子:

<!DOCTYPE html>
<html>
<head>
<title>dsfg</title>
</head>
<body>
<script type="text/javascript">
var g = 'globle';
function fn(){
var p = 'part';
console.log(g);//globle
console.log(p);//part
}
fn();
console.log(g);//globle
console.log(p);//报错: p is not defined
</script>
</body>
</html>

在上述例子中,g是全局变量,不存在于任何函数中,能在任何地方使用。
p则是局部变量,只能在fn函数中使用。在外部使用则会报错。

作用域链:
函数的变量在寻找作用域时,不看在哪执行,只看在哪定义。

举例子:

<!DOCTYPE html>
<html>
<head>
<title>dsfg</title>
</head>
<body>
<script type="text/javascript">
var a = 100;
function fn1(){
var b = 200; function fn2(){
var c = 300;
console.log(a);//100
console.log(b);//200
console.log(c);//300
}
fn2();
}
fn1();
</script>
</body>
</html>

以变量a来解析,上述例子中体现的作用域链。当执行console.log(a)时,先在fn2中寻找变量a,找不到则去到fn2的父级fn1中寻找,也找不到。再到fn1的父级中寻找,也就是全局变量中寻找,终于找到了。像这样一层一层向上查找,就叫变量作用域链。
如果在其中任何一层找到了,则不会继续向上查找。

闭包:
下个定义:可以访问另一个函数作用域变量的函数。所以闭包其实是个函数。

为什么要用闭包呢?
局部变量无法共享和长久的保存,全局变量则很容易造成变量污染。闭包则能长久保存变量,又不会污染。
闭包特点:占用更多内存,不容易被释放。
闭包使用场景:1.函数作为返回值(retrun 一个函数)

         2.函数作为参数传递到另一个函数中。

举例子:

<!DOCTYPE html>
<html>
<head>
<title>lalala</title>
</head>
<body>
<script type="text/javascript">
function fn(){
var a = 100;
return function(){
console.log(a);
}
}
var f1 = fn();
var a = 200;
f1();//100
</script>
</body>
</html>

1.定义外层函数,封装被保护的局部变量。
2.定义内层函数,执行对外部函数的变量操作。
3.外层函数返回内层函数的对象,且外层函数被调用时,结果保存在一个全局变量中。

执行f1()时,a在当前函数中未定义,往父级查找fn中a=100,所以a=100;
函数变量作用域不看在哪执行,只看在哪定义

好啦好啦,jS三座大山翻过两座了,还剩一个异步,单线程~

原型模式故事链(5)--JS变量作用域、作用域链、闭包的更多相关文章

  1. 原型模式故事链(4)--JS执行上下文、变量提升、函数声明

    上一章:JS的数据类型 传送门:https://segmentfault.com/a/11... 好!话不多少,我们就开始吧.对变量提升和函数声明的理解,能让你更清楚容易的理解,为什么你的程序报错了~ ...

  2. 原型模式故事链(3)--JS的数据类型、以及区别、区分、转化

    上一章--原型链讲解:传送门:https://segmentfault.com/a/11... 在上一章讲解原型链时提到了:所有的引用类型都有一个_proto_属性,称之为隐式原型.那么引用类型是什么 ...

  3. js变量及其作用域(附例子及讲解)

    Javascript和Java.C这些语言不同,它是一种无类型.弱检测的语言.它对变量的定义并不需要声明变量类型,我们只要通过赋值的形式,可以将各种类型的数据赋值给同一个变量   工具/原料   Ch ...

  4. 详解js变量、作用域及内存

    详解js变量.作用域及内存 来源:伯乐在线 作者:trigkit4       原文出处: trigkit4    基本类型值有:undefined,NUll,Boolean,Number和Strin ...

  5. JS变量、作用域、内存

    写到这个题目<JS变量.作用域,内存>,我就不由自主想起了黄金三嫖客.可能是名字有点像,嗯,一定是这样子的! JS接触下来,应该是要比Java简单不少的,所以,要学好啊.立个flag半年后 ...

  6. js课程 1-4 js变量的作用域是怎样的

    js课程  1-4   js变量的作用域是怎样的 一.总结 一句话总结:只有在函数内部前面带var的变量为局部变量,局部变量只能在函数体内使用. 1.什么情况下会出现NaN类型的错误,举一例? Num ...

  7. js变量及其作用域

    Javascript和Java.C这些语言不同,它是一种无类型.弱检测的语言.它对变量的定义并不需要声明变量类型,我们只要通过赋值的形式,可以将各种类型的数据赋值给同一个变量   一.js变量的类型及 ...

  8. Js 变量的作用域

    变量的作用域 所有的变量作用域是指在哪里可用哪里不可用 局部作用域和全局作用域 在js中以函数来分割作用域 在函数里面就叫做局部作用域,在函数外面的就叫全局作用域 在函数里面如果省略var 关键字 那 ...

  9. JS变量的作用域

    深入理解JavaScript变量的作用域   1.JavaScript的作用域链 2.函数体内部,局部变量的优先级比同名的全局变量高. 3.JavaScript没有块级作用域. 4.函数中声明的变量在 ...

随机推荐

  1. linux如何使用QQmail实现网络邮件报警?

    环境:CentOS7 目的:考虑到实现服务的高可用性.使用电子邮件通知服务,可以快速的通知维护人员.提高服务的可靠性,而通过 smtp.qq.com 实现脚本邮件报警 一.设置并取得 smtp.qq. ...

  2. docker遇到防火墙报错问题解决方法

    -- 报错信息[root@localhost docker]# docker run -d -p 5000:5000 training/webapp python app.pycc61442060cb ...

  3. redhat 5 中文乱码

    安装 1.fonts-chinese-3.02-9.6.el5.noarch.rpm. 如果无法安装,则加个--force 2.fonts-ISO8859-2-75dpi-1.0-17.1.noarc ...

  4. zabbix监控ssl证书过期时间

    获取证书过期时间脚本: /etc/zabbix/scripts/check-cert-expire.sh: #!/bin/bash host=$ port=$ end_date=`/usr/bin/o ...

  5. 熟悉GitHub、VS工具的使用(《构建之法》第二次作业)

    GIT地址 https://github.com/slothph GIT用户名 slothph 学号后五位    62323 博客地址 https://www.cnblogs.com/slothph/ ...

  6. Spring实现构造注入

    Spring通过setter访问器实现对属性的赋值,这种做法称为设值注入:Spring还提供了通过构造方法赋值的能力,称为构造注入.使用设值注入时,Spring通过JavaBean的无参构造方法实例化 ...

  7. C++ 的关键字(保留字)完整介绍

    转载至:https://www.runoob.com/w3cnote/cpp-keyword-intro.html 1. asm asm (指令字符串):允许在 C++ 程序中嵌入汇编代码. 2. a ...

  8. Django中ajax发送post请求,报403错误CSRF验证失败解决办法

    今天学习Django框架,用ajax向后台发送post请求,直接报了403错误,说CSRF验证失败:先前用模板的话都是在里面加一个 {% csrf_token %} 就直接搞定了CSRF的问题了:很显 ...

  9. Python 条件判断 和循环

    使用条件判断 if else # 条件派单 if else print('条件派单 if else') # s = input('请输入生日年号:') # birth = int(s) birth = ...

  10. 字符串转数组(php版)

    思路: 1.判断当前传来的值是否为数组 2.若不是现将传来的值转换为字符串类型 3.判断当前值是否为空 4.若不为空,采用正则进行匹配,如下图 preg_match('/^{.*?}$/', $str ...