javascript 内部函数的定义及调用
内部函数：定义在另一个函数中的函数
例如：
<script>
function outer(){
function inner(){
}
}
</script>
inner()就是一个被包含在outer()作用域中的内部函数，所以：
在outer()内部调用inner()函数有效，
在outer()外部调用inner()函数无效。
例如：
<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中的内部函数能够逃脱定义他们的外部函数。
方式：
① 给内部函数指定一个全局变量
<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 )
<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) 内部函数的变量都被限制在内部函数作用域中
<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)内部函数可以像其他函数一样引用全局变量
<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）内部函数会继承父函数的作用域,因此内部函数也可以引用父函数的变量
<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
学习的时候做的笔记 ，资料 《 jquery 基础教程（第四版） 》
相关文章
最新发布
阅读排行
热门文章
猜你喜欢