js中一个函数中调用另一个函数,内部函数怎么访问外部函数的变量? 无意中逛到这个问题,突然发现自己以前也有这样的困惑
1 2 3 4 5 6 function a(){ alert(num); } function b(){ var num=3; a(); } b(); //num is not defined
a函数不是b的内部函数(闭包),而是全局函数 。所以对于a函数来说,即使你b在内部调用了我a,我a还是访问不了你b。 说到底就是作用域问题,所以我想到了改变作用域的方法
call(),apply(),bind() 实现
1 2 3 4 5 6 function a(){ alert(num); } function b(){ var num=3; a.call(b); } b(); // num is not defined
尝试了很多次,都无法获取到b,原来我对这些方法理解有误,查阅文档,发现此类方法主要作用是,对象调用不属于自己的方法,例如下例: food函数是没有product方法,使用call对food的上下文进行product操作
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 //mozilla官方用例 function Product(name, price) { this.name = name; this.price = price; } function Food(name, price) { Product.call(this, name, price); this.category = 'food'; } function Toy(name, price) { Product.call(this, name, price); this.category = 'toy'; } var cheese = new Food('feta', 5); var fun = new Toy('robot', 40);
使用闭包 闭包就不多说了,一个函数内部定义 (不是调用)另一个函数 内部函数可调用外部函数的变量,作用域链的延长
改写
1 2 3 4 5 6 7 function b(){ var num=3; function a(){ alert(num); } a(); } b(); //3
传参 1 2 3 4 5 6 function a(num){ alert(num); } function b(){ var num=3; a(num); } b(); //3
return 1 2 3 4 5 6 function a(){ alert(b()); } function b(){ var num=3; return num; } a();
总结 一般来说,a是复用的函数,才会有此类用法,传参实现即可。
参考资料 深入浅出妙用 Javascript 中 apply、call、bind 学习Javascript闭包(Closure) call()方法
最后更新时间:2024-08-26 13:25:01