javascript 内部函数的定义及调用

内部函数:定义在另一个函数中的函数
例如:

1

2

3

4

5

6

7

<script>

    function outer(){

        function inner(){

 

        }  

    }

</script> 

inner()就是一个被包含在outer()作用域中的内部函数,所以:
在outer()内部调用inner()函数有效,
在outer()外部调用inner()函数无效。
例如:

1

2

3

4

5

6

7

8

9

10

11

12

13

<script>

    function outer(){

        console.log('外部函数');

        function inner(){

            console.log('内部函数');

        }

        inner();

    }

    console.log('outer():');

    outer();

    console.log('inner():');

    inner();

</script>

结果:
outer():
外部函数
内部函数
inner():
Uncaught ReferenceError: inner is not defined(报错)

-----------------------------------------------------------------------------

1.如何在任何地方调用内部函数
javascript允许像传递任何类型的数据一样传递函数,也就是说,javascript中的内部函数能够逃脱定义他们的外部函数。
方式:
① 给内部函数指定一个全局变量

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

<script>

    var globalVar;

        function outer(){

            console.log('外部函数');

            function inner(){

                console.log('内部函数');

            }  

        globalVar = inner; 

    }

    console.log("outer():");

    outer();

    console.log("globalVar():");

    globalVar();

    console.log("inner():");

    inner();

</script>

结果:
outer():
外部函数
globalVar():
内部函数
inner():
Uncaught ReferenceError: inner is not defined(报错)

-----------------------------------------------------------------------------
inner():会报错是因为虽然内部函数通过把引用保存在全局变量中实现了逃脱,但这个函数的名字仍然被截留在outer()的作用域中。

在函数定义之后调用outer()会修改全局变量globalVar,因为globalVar引用的是innerFn(),所以在执行globalVar()的时候,相当于调用了inner()一样,得到了以上结果。

② 通过在父函数中返回值来实现对内部函数的引用( return )

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

<script>

    function outer(){

        console.log('外部函数');

        function inner(){

            console.log('内部函数');

        }

        return inner;

    }

    console.log('var res = outer():');

    var res = outer();

    console.log("res():");

    res();

    console.log("outer():");

    outer();

    console.log("inner():");

    inner();

</script>

结果:
var res = outer():
外部函数
res():
内部函数
outer():
外部函数
inner():
Uncaught ReferenceError: inner is not defined(报错)

-----------------------------------------------------------------------------
2. 变量作用域
1) 内部函数的变量都被限制在内部函数作用域中

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

<script>

    function outer(){

        console.log('外部函数')

        function inner(){

            var innerVar = 0;

            innerVar ++;

            console.log('内部函数 innerVar=' + innerVar );

        }

        return inner;

    }

    var res = outer();

    res();

    res();

    var res2 = outer();

    res2();

    res2();

</script>

每当通过某种方式调用这个内部函数时,都会创建一个新的变量innerVar,然后递增
结果:
外部函数
内部函数 innerVar=1
内部函数 innerVar=1
外部函数
内部函数 innerVar=1
内部函数 innerVar=1

-----------------------------------------------------------------------------
2)内部函数可以像其他函数一样引用全局变量

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

<script>

    var innerVar = 0;

        function outer(){

            console.log('外部函数')

            function inner(){

                innerVar ++;

                console.log('内部函数 innerVar=' + innerVar );

            }

        return inner;

    }

    var res = outer();

    res();

    res();

    var res2 = outer();

    res2();

    res2();

</script>

结果:
外部函数
内部函数 innerVar=1
内部函数 innerVar=2
外部函数
内部函数 innerVar=3
内部函数 innerVar=4

-----------------------------------------------------------------------------
3)内部函数会继承父函数的作用域,因此内部函数也可以引用父函数的变量

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

<script>

    function outer(){

        var innerVar = 0;

        console.log('外部函数')

        function inner(){

            innerVar ++;

            console.log('内部函数 innerVar=' + innerVar );

        }

        return inner;

    }

    var res = outer();

    res();

    res();

    var res2 = outer();

    res2();

    res2();

</script>

结果:
外部函数
内部函数 innerVar=1
内部函数 innerVar=2
外部函数
内部函数 innerVar=1
内部函数 innerVar=2

转载于:https://my.oschina.net/airship/blog/824556

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值