javascript - js 匿名函數(shù)的相關(guān)問題
問題描述
(function(){ var obj, sayHi; obj = {};sayHi = function(str){console.log(str); }obj.sayHello = function(str1){sayHi(str1); }obj.sayYo = function(str2){console.log(str2); }window.obj = obj; })()obj.sayHello('hello world!'); // hello world! obj.sayYo('yo, what’s up?'); // yo, what’s up?
我自己碰到的一個(gè)小問題,不知道你們有沒有,最近比較喜歡寫匿名函數(shù),剛看到這個(gè)的時(shí)候,習(xí)慣性倒過來看,心想僅僅是把obj暴露出來了,為什么在執(zhí)行sayHello的時(shí)候可以執(zhí)行sayHi?想到之前看過js的運(yùn)行機(jī)制。不知道是不是這樣子:js在運(yùn)行的時(shí)候應(yīng)該是先預(yù)解析所以在執(zhí)行sayHello之前,匿名函數(shù)里面的sayHello應(yīng)該已經(jīng)變成了
obj.sayHello = function(str1){function(str1){ console.log(str1); };};
本人非專業(yè)的,不知道這樣理解對(duì)不對(duì)?
問題解答
回答1:這個(gè)是作用域的問題。只要記住函數(shù)在創(chuàng)建的時(shí)候就已經(jīng)保存了作用域,不管你后面在哪里調(diào)用,結(jié)果都是一樣,就像你這個(gè)代碼,改成這樣,結(jié)果還是一樣(為了下面好分析,給這個(gè)立即調(diào)用函數(shù)加個(gè)名字,叫test):
(function test(){ var obj, sayHi; obj = {};sayHi = function(str){console.log(str); }obj.sayHello = function(str1){sayHi(str1); }obj.sayYo = function(str2){console.log(str2); }window.obj = obj; })() var sayHi = function(str) { // 就算在全局作用域里面加個(gè)sayHi函數(shù),也不會(huì)對(duì)sayHello有任何影響console.log('Hi'); } obj.sayHello('hello world!'); // hello world! obj.sayYo('yo, what’s up?'); // yo, what’s up?
分析一下,當(dāng)obj.sayHello這個(gè)函數(shù)創(chuàng)建的時(shí)候,他會(huì)保存著當(dāng)前所有的作用域:
sayHello.[[scope]] = [ sayHelloContext.AO, testContext.VO, globalContext.VO]
這個(gè)時(shí)候很明顯sayHi函數(shù)在test的作用域里面,所以sayHello里面直接保存著這個(gè)引用,就算在全局作用域里面運(yùn)行了,全局作用域里面重新定義的sayHi依然無法影響它,因?yàn)樗菑膖est函數(shù)里面查找的,看看下面這個(gè)例子你就懂了:
var x = 10; function foo() { alert(x);} (function () { var x = 20; foo(); // 10})();
foo函數(shù)的作用域就是foo本身+全局作用域,所以就算在立即執(zhí)行函數(shù)里面執(zhí)行,輸出值也不會(huì)是20,只會(huì)是10
回答2:這么理解不好吧,這應(yīng)該是閉包概念。http://www.ruanyifeng.com/blo...
在一個(gè)function里面訪問一個(gè)變量,首先先看這個(gè)function有沒有聲明這個(gè)變量,沒有,就到外層作用域去找,這里就是這種情形,在(function(){})()這個(gè)function里找到了sayHi,所以就直接調(diào)用了,如果這個(gè)時(shí)候是沒有聲明sayHi的話,那就繼續(xù)往function外層去找,直接找到全局還是木有。那就沒有然后了
相關(guān)文章:
1. 點(diǎn)擊頁(yè)面就自動(dòng)輸入到mysql.求解2. javascript - 在云服務(wù)器上啟動(dòng)個(gè)node服務(wù),在本機(jī)通過公網(wǎng)ip卻不能訪問3. javascript - angular-ui-bootstrap model 模態(tài)框出現(xiàn)的位置怎么調(diào)整4. javascript - vue 數(shù)據(jù)更新了。但是dom沒有更新,,,,,如圖5. javascript - iframe 為什么加載網(wǎng)頁(yè)的時(shí)候滾動(dòng)條這樣顯示?6. css - PC端不同分辨率下字體大小呈現(xiàn)7. css - 百分比min-height的一個(gè)問題8. javascript - weex 怎么監(jiān)聽滾動(dòng)到某處,然后添加fixed固定效果9. valign=top 是啥意思10. javascript - 判斷用戶網(wǎng)絡(luò)環(huán)境
