码迷,mamicode.com
首页 > Web开发 > 详细

原型模式故事链(5)--JS变量作用域、作用域链、闭包

时间:2019-11-09 09:22:35      阅读:104      评论:0      收藏:0      [点我收藏+]

标签:ice   参数   content   外部   上下   释放   ext   tps   text   

上一章 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变量作用域、作用域链、闭包

标签:ice   参数   content   外部   上下   释放   ext   tps   text   

原文地址:https://www.cnblogs.com/jlfw/p/11824148.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!