µ±Ç°Î»Ö㺠´úÂëÃÔ >> JavaScript >> Javascriptѧϰ֮һ - Ê©ÐÐʱµÄ×¼±¸¹¤¹¤×÷
  Ïêϸ½â¾ö·½°¸

Javascriptѧϰ֮һ - Ê©ÐÐʱµÄ×¼±¸¹¤¹¤×÷

Èȶȣº306   ·¢²¼Ê±¼ä£º2012-06-28 15:20:03.0
Javascriptѧϰ֮һ -- Ö´ÐÐʱµÄ×¼±¸¹¤¹¤×÷

?

JavascriptÖ´ÐÐʱµÄ×¼±¸¹¤×÷£º

µ±JSÒýÇæ½øÈëÒ»¸öÖ´Ðл·¾³£¬×¼±¸Ö´ÐиÃÇøÓòµÄ´úÂëʱ£¬ÈçϹ¤×÷ÒѾ­Íê³É£º(1) ±äÁ¿µÄʵÀý»¯£¬(2) ×÷ÓÃÓòÁ´µÄ´´½¨ºÍ³õʼ»¯£¬(3) thisÖ¸ÕëËùÖ¸ÏòµÄÄ¿±ê¶ÔÏóµÄÈ·¶¨¡£

?

1¡¢Ö´Ðл·¾³£¨Execution Contexts£©

Ò»¶Î¿ÉÖ´ÐеÄJS´úÂ뼴Ϊһ¸öÖ´Ðл·¾³£¬·ÖΪÈýÀࣺ

1.1 È«¾Ö´úÂ룻ȫ¾Ö´úÂëÊDz»°üº¬Èκκ¯ÊýÌåµÄ´úÂ루¿ÉÒÔÓк¯Êýµ÷Óã©£»

1.2 Eval´úÂ룻evalÊÇJSÖеÄÒ»¸öÄÚÖú¯Êý£¬evalµÄ²ÎÊý¼´È«¾Ö´úÂ룻

1.3 º¯Êý´úÂ룻º¯Êý´úÂëÊǺ¯ÊýÌåÖеÄÒ»²¿·Ö´úÂ룬Õⲿ·Ö´úÂ벻ǶÌ×°üÀ¨Èκκ¯ÊýÌå´úÂë¡£×¢Òânew Function(argList)×îºóÒ»¸ö²ÎÊýÒ²Êǵ±×÷º¯Êý´úÂë´¦Àí¡£

?

?

2¡¢±äÁ¿ÊµÀý»¯£¨Variable Instantiation?£©

?

JSµÄÿ¸öÖ´Ðл·¾³£¨Ò²½ÐÖ´ÐÐÉÏÏÂÎÄ£©¶¼¹ØÁªµ½Ò»¸ö±äÁ¿¶ÔÏó£¨variable object£©¡£±äÁ¿ÊµÀý»¯½«×öÒÔÏÂÊÂÇ飺

2.1 ?Èç¹û¸ÃÖ´Ðл·¾³ÊǺ¯Êý´úÂëµÄÖ´Ðл·¾³£¬Ã¿Ò»¸öÐβÎ×÷ΪÊôÐÔÌí¼Óµ½±äÁ¿¶ÔÏóÖУ¬ÊôÐÔÃûΪÐβÎÃû£¬ÖµÊǵ÷Óøú¯ÊýʱËùÌṩµÄʵ²ÎµÄÖµ¡£Èç¹ûʵ²ÎÉÙÓÚÐβΣ¬Ôò¶à³öµÄÐβθ³ÖµÎªundefined¡£Èç¹ûÓÐÐβÎÖÐÓÐÁ½¸ö»òÕßÁ½¸öÒÔÉϵIJÎÊýµÄÃû×ÖÏàͬ£¬Ôò×îºóÒ»¸öÐβεÄÖµÊDZäÁ¿¶ÔÏóÖиÃÐβεÄÖµ£¬¼´Ê¹×îºóÒ»¸öÐβÎΪundefined¡£

?

?

2.2 ?°Ñº¯Êý¶¨Òåʽ¶¨ÒåµÄº¯Êý£¨²»ÊǺ¯Êý±í´ïʽ¶¨ÒåµÄº¯Êý£©×÷ΪÊôÐÔÌí¼Óµ½±äÁ¿¶ÔÏóÖС£ÊôÐÔÃûΪº¯ÊýÃû£¬ÖµÎªÍ¨¹ýnew Function(²ÎÊýÁбí) ´´½¨µÄÒ»¸öº¯Êý¶ÔÏ󣬸öÔÏóµÄÊôÐÔÓÉ´úÂë¾ö¶¨£¨Ö´ÐеÄʱºòÈ·¶¨£©¡£Èç¹û±äÁ¿¶ÔÏóÖÐÒѾ­´æÔÚ¸ÃÃû×ÖµÄÊôÐÔ£¬ÔòÓÃеÄÖµºÍÊôÐÔÌæ»»¾ÉµÄÖµºÍÊôÐÔ¡£

?? Èç¹ûÖ´Ðл·¾³ÊǺ¯Êý´úÂ룬±ØÐëÏȳõʼ»¯º¯ÊýµÄÐβÎÁÐ±í£¬È»ºóÔÙ´¦Àí¸Ã²½Öè¡£

?

?

2.3 °Ñͨ¹ý¹Ø¼ü×Övar¶¨ÒåµÄ±äÁ¿£¨¸Ã±äÁ¿Ò²¿ÉÒÔÊÇÔ´Âëij¸öÓï¾ä¿éÖж¨ÒåµÄ£¬È磺forÓï¾äÑ­»·ÌåÖж¨ÒåµÄ£©×÷ΪÊôÐÔÌí¼Óµ½±äÁ¿¶ÔÏóÖУ¬ÊôÐÔÃûΪ±äÁ¿Ãû£¬ÖµÎªundefined£¬ÖµµÄÊôÐÔÓÉ´úÂëÈ·¶¨£¨Ö´ÐеÄʱºòÈ·¶¨£©£»Èç¹û¸Ã±äÁ¿ÃûºÍº¯Êý¶¨Òå»òÕßÐβÎÖØºÏ£¬Ôò²»±÷Æú±äÁ¿¶ÔÏóÖиÃÊôÐÔµÄÒÑÓÐÊôÐÔ¡£

?? ? ?ÓïÒåÉÏ£¬±ØÐëÏȳõʼ»¯º¯ÊýÐβÎÁбíºÍº¯Êý¶¨Ò壬ÔÙ´¦Àí¸Ã²½Öè¡£

?

?

?

ʵÑé1(»·¾³Chrome 8 )£º

<script language="javascript">
var fun;
function fun(a, b, a){
	alert(a);
}
fun(1, 2, 3);//µ¯³ö£º3
fun(1, 2);//µ¯³ö£ºundefined
var fun = 'not function';
fun(1);//³ö´í
</script>

³ÌÐò½â¶Á£º
(1) ÔÚÖ´ÐеÚ2ÐдúÂëʱ£¬È«¾Ö¶ÔÏówindowÖÐÒѾ­´æÔÚÊôÐÔwindow.funÆäֵΪfunº¯Êý£¬¶ø²»ÊÇÒ»¸ö±äÁ¿£¬¼´Ê¹ÔÚº¯Êýfunǰºó¶¼ÓжԱäÁ¿funµÄÉùÃ÷£¬ÕâÊÇÒòΪ2.3ËùÊö¡£
(2) µÚ6Ðе¯³ö3£¬µÚ7Ðе¯³öundefined£¬ÕâÊÇÒòΪ2.1ËùÊö¡£
(3) µÚ9Ðгö´íÊÇÒòΪִÐеÚ8ÐдúÂëʱ£¬¸Ä±äÁËwindow.funµÄÖµ(µÚ°ËÐв»ÊDZäÁ¿ÊµÀý»¯£¬¶øÊǼÆËã±í´ïʽִÐдúÂë)¡£

?

?

3¡¢×÷ÓÃÓòÁ´£¨Scope Chain£©ºÍ±äÁ¿Ê¶±ð£¨Identifier Resolution£©

ÿ¸öÖ´Ðл·¾³¶¼ÓëÒ»¸ö×÷ÓÃÓòÁ´¹ØÁª¡£×÷ÓÃÓòÁ´ÊÇÒ»¸ö¶ÔÏóÁÐ±í£¬Ö÷ÒªÓÃÓÚ±äÁ¿Ê¶±ð£¨¿ÉÒÔÀí½âΪËüÓɸ³ÖµºóµÄ±äÁ¿¶ÔÏóÒÔÁ´±íµÄÐÎʽ¹¹³É£©¡£ÏµÍ³°´ÕÕÒÔϲ½ÖèÀ´¼ÆËãÒ»¸ö±äÁ¿ vµÄÖµ£º

step 1: ?»ñÈ¡×÷ÓÃÓòÁ´ÖеÄÏÂÒ»¸ö¶ÔÏó ob£¬Èç¹û²»´æÔÚÏÂÒ»¸öÔòתstep 3£»
step 2: ?µ÷ÓÃob.hasProperty(v)£¬Èç¹û½á¹ûΪtrue£¬·µ»Øob.vµÄÒýÓã»Èç¹ûΪfalse£¬Ôòתµ½step 1£»
step?3: ?·ñÔò·µ»ØÒ»¸önull.v (nullÊÇNullµÄÒ»¸ö¶ÔÏó).

×¢Ò⣺Óõ½×÷ÓÃÓòÁ´Ê±£¬ËµÃ÷´úÂëÒѾ­¿ªÊ¼Ö´ÐУ¬Õâʱ×÷ÓÃÓòÁ´Öи÷¸ö¶ÔÏóµÄÖµÒѼÆËãµÃµ½£¬ÀýÈ磺±äÁ¿¶ÔÏóÖÐδȷ¶¨µÄÊôÐÔµÄÖµ¡£

4¡¢È«¾Ö±äÁ¿£¨global object£©

?

ÔÚJSÔËÐл·¾³ÖдæÔÚÒ»¸öÌØÊâµÄÈ«¾Ö¶ÔÏ󣬸öÔÏóÔÚÖ´ÐÐÈκδúÂë֮ǰ´´½¨¡£ÔÚHTMLÎĵµ¶ÔÏóÄ£ÐÍÖÐÈ«¾Ö¶ÔÏóΪDOMWindow£¬DOMWindowÓÐÒ»¸öÊôÐÔwindow£¬ÓÃÀ´ÊµÏÖ¶ÔËü×ÔÉíµÄÒýÓ᣹ʿɰÑwindowÊÓΪȫ¾Ö¶ÔÏó¡£È«¾Ö¶ÔÏóÖÐÓÐһЩJSÓïÑÔÒÔÍâµÄ¶ÔÏó£¨ËüÃDz»ÊÇÓÉJSÓïÑÔʵÏÖ£©£¬ÈçDate£¬MathµÈ¡£Ö´ÐдúÂëʱ£¬¿É¸Ä±äÈ«¾Ö¶ÔÏóÖеÄÊôÐÔ£¬ÈçÌí¼Ó¡¢É¾³ý¡¢ÐÞ¸ÄÊôÐԵȡ£

?

?

5¡¢»î¶¯¶ÔÏó(activation object)

µ±JSÖ´ÐÐÒýÇæÌø×ªµ½Ò»¸öº¯Êý´úÂëÖ´Ðл·¾³Ê±£¬½«´´½¨Ò»¸ö»î¶¯¶ÔÏóÓëÖ´Ðл·¾³¹ØÁª£¬»î¶¯¶ÔÏó½«ÓµÓÐÒ»¸öÃûΪargumentsµÄÊôÐÔ£¬ÆäֵΪ´æ·Åº¯Êý²ÎÊýµÄÒ»¸öarguments¶ÔÏ󡣸û¶ÔÏó½«×÷ΪִÐк¯Êý´úÂëµÄ±äÁ¿¶ÔÏó¡£

?

´ËʱµÄ»î¶¯¶ÔÏó±»µ±×÷±äÁ¿¶ÔÏóÀ´Ö´ÐбäÁ¿ÊµÀý»¯¡£

?

»î¶¯¶ÔÏóÊÇÒ»ÖÖÌØÊâµÄʵÏÖ»úÖÆ£¬JS³ÌÐòÖ»ÄÜ·ÃÎʻ¶ÔÏóµÄ³ÉÔ±£¬²»ÄÜ·ÃÎʻ¶ÔÏó±¾Éí¡£


6¡¢arguments¶ÔÏó(Arguments object)

?

?

µ±JSÌø×ªµ½º¯Êý´úÂëÖ´Ðл·¾³Ê±£¬½«´´½¨Ò»¸öarguments¶ÔÏ󣬸öÔÏóÓÐÈçÏÂÌØµã£º

(1) arguments¶ÔÏóµÄprototypeÔ­ÐÍΪObject¶ÔÏóµÄÔ­ÐͶÔÏ󣬸ÃÔ­ÐͶÔÏóµÄֵΪ¼´Object.prototype£»

(2) argumentsÓÐÒ»¸öcalleeÊôÐÔ£¬Æä³õʼֵΪ±»Ö´Ðеĺ¯Êý¶ÔÓ¦µÄº¯Êý¶ÔÏ󣨼´º¯Êý×ÔÉí£©£¬¸ÃÌØÐÔʹµÃÄäÃûº¯ÊýÒ²¿ÉÒԵݹéµ÷Óá£

(3) argumentsÓÐÒ»¸ölengthÊôÐÔ£¬ÓÃÀ´¸æËßʵ²ÎµÄ¸öÊý£»

(4) ¶ÔÓÚʵ²Î½«ÒÀ´Î·ÅÈëarguments[0], arguments[1], ?... ?, arguments[n]£»

?

?

ͼ£ºÊµÑé1ÖеÚÒ»´ÎÖ´Ðк¯Êýfunʱarguments¶ÔÏóÊôÐÔ


?

?

?

?

?

?

?

?

7¡¢Ô¤±àÒ루Ԥ´¦Àí£©

JSÒýÇæÒÔ¶ÎΪµ¥Î»À´½âÊͺÍÖ´ÐÐjs£¬Ò»¸ö<script>±êǩΪһ¶Î¡£ÔÚÖ´ÐÐjs֮ǰÓÐÒ»¸öÔ¤±àÒë¹ý³Ì£¬Ô¤±àÒëÖ÷ÒªÊÇ´´½¨±äÁ¿¶ÔÏó¡£

1¡¢ÔÚÈ«¾Ö´úÂëÖУ¬±äÁ¿¶ÔÏóΪwindow¶ÔÏó£»
2¡¢ÔÚÖ´Ðк¯Êý´úÂëʱ£¬½«´´½¨Ò»¸ö»î¶¯¶ÔÏó£¨activation object£©×÷Ϊ±äÁ¿¶ÔÏó£»


8¡¢´úÂëµÄÖ´ÐÐ

?

8.1 È«¾Ö´úÂëµÄÖ´ÐÐ

??Step 1£º ´´½¨×÷ÓÃÓòÁ´£¬´ËʱµÄ×÷ÓÃÓòÁ´ÖнöÓÐÒ»¸ö¶ÔÏóÈ«¾ÖµÄwindow¶ÔÏó£»

??Step 2£º window¶ÔÏóΪµ±Ç°Ö´Ðл·¾³µÄ±äÁ¿¶ÔÏó£¬ÓÃÀ´Ö´ÐбäÁ¿ÊµÀý»¯ºÍ±äÁ¿µÄÖµµÄ¼ÆË㣻
??Step 3£º ´ËʱµÄthisÖ¸ÕëΪwindow¶ÔÏó£»

8.2 º¯Êý´úÂëµÄÖ´ÐÐ

??Step 1£º ´´½¨Ò»¸ö»î¶¯¶ÔÏ󣬲¢°Ñ»î¶¯¶ÔÏó¼ÓÈ뺯Êý¶¨ÒåʱËù´´½¨µÄ×÷ÓÃÓòÁ´(¸Ã×÷ÓÃÓòÁ´ÊÇÔÚ¶¨Ò庯Êýʱ´´½¨µÄ£¬´æ´¢ÔÚ´´½¨¸Ãº¯Êý¶ÔÏóʱËù´´½¨µÄFunction¶ÔÏóµÄScopeÊôÐÔÖÐ)£»¹Ê´ËʱµÄ×÷ÓÃÓòÁ´Îª£º [»î¶¯¶ÔÏó£¬ º¯Êý¶¨ÒåʱµÄscope]¡££¨Ç¿µ÷£ºÒ²¾ÍÊÇ˵º¯Êý´úÂëµÄÖ´Ðл·¾³Ó뺯Êý¶¨ÒåʱµÄ»·¾³Ïà¹Ø£¬Óëµ÷Óøú¯ÊýµÄ»·¾³Î޹أ©¡£
??Step 2£º °Ñ»î¶¯¶ÔÏó×÷Ϊ±äÁ¿¶ÔÏó£¬ÔÚº¯ÊýÌåÄÚ½øÐбäÁ¿ÊµÀý»¯£¨Çë²Î¿´±äÁ¿¶ÔÏóÒ»½Ú£©£»
??Step 3£º ´ËʱµÄthisÖ¸ÕëΪµ÷Óøú¯ÊýµÄ¶ÔÏó£¬Èçob.func();´Ëʱfun()º¯ÊýÖгöÏÖµÄthisΪob£»Èç¹ûµ÷Óøú¯µÄ¶ÔÏóΪ¿Õ£¬ÔòthisΪwindow¶ÔÏó£¬È磺func()£¬´Ëʱº¯ÊýÌåÄÚµÄthisÖ¸ÕëΪwindow£¨thisÖ¸ÕëËùÖ¸´ú¶ÔÏóµÄ»ù±¾Ô­Àí£©¡£

˵Ã÷£º
(1) ÿ¸öº¯Êý¶¨Òåʱ£¬¶¼½«¹ØÁªµ½Ò»¸ö×÷ÓÃÓòÁ´¡£ÔÚÈ«¾Ö´úÂëÖк¯Êý£¬ º¯Êý¶¨ÒåʱÆä×÷ÓÃÓòÁ´Ö»ÓÐÒ»¸ö¶ÔÏówindow£»
(2) ÔÚº¯ÊýAÌåÄÚ¶¨ÒåµÄº¯ÊýBÆä×÷ÓÃÓòÁ´Îª : [Aº¯ÊýµÄ»î¶¯¶ÔÏó£¬Window¶ÔÏó]£¬Èç¹ûº¯ÊýBÄÚ»¹¶¨ÒåÓÐÒ»¸öº¯ÊýC£¬Ôòº¯ÊýCµÄ×÷ÓÃÓòÁ´Îª£º[Bº¯ÊýµÄ»î¶¯¶ÔÏó£¬Aº¯ÊýµÄ»î¶¯¶ÔÏó£¬Window¶ÔÏó]

?

8.3 Eval´úÂëµÄÖ´ÐÐ

??evalÖÐÖ´ÐеĴúÂëÊÓΪÔÚµ±Ç°´úÂëÖÐÌí¼ÓÁËÒ»¶Î´úÂë¼´¿É¡£

?

´úÂë·ÖÎöÒ»

?

<script>
var var1;
var2 = 'var2';
fun1();
function fun1(){
	alert('fun1');
	var3 = 'var3';
}
var var4 = function(){
	alert('ÄäÃûº¯Êý');
};

var var5 = function fun2(){
	alert('fun2');
};

for(var i=0; i<10; i++){
	var var6 = i*i;
}
var var6;
var5();
fun3();
var4();
</script>
<script>
var var7;
fun3();
function fun3(){
	alert('fun3');
}
</script>
?
³ÌÐò½â¶Á£º
(1) µÚ2ÐÐÖ´ÐÐ֮ǰwindow¶ÔÏóÒѾ­´æÔÚ£¬ÇÒÒÑÔ¤±àÒëÍê¸Ãscript±êÇ©ÖеĴúÂë¡£´ËʱµÄwindow¶ÔÏóÓÐÈçÏÂÌØµã£º
  • i, fun1, var1,?var4, var6¶¼×÷ΪÊôÐÔÌí¼Óµ½±äÁ¿¶ÔÏówindowÖС£ÆäÖÐfun1µÄֵΪһ¸öFunction¶ÔÏ󣬯äËü±äÁ¿µÄÖµ¶¼ÊÇundefined¡£
  • ±äÁ¿iÊÇÔÚforÓï¾ä½á¹¹Öж¨ÒåµÄ£¬ var6ÊÇÔÚforÓï¾äÑ­»·ÌåÖж¨ÒåµÄ£¬´Ëʱ¶¼ÒÑÌí¼Ó£»
  • var7£¬ fun3²¢Ã»ÓÐÌí¼Ó£¬ÒòΪËüÔÚÁíÍâÒ»¸öscript±êÇ©ÖУ¬var2ҲûÓÐÌí¼Ó£¬ÒòΪËüûÓÐͨ¹ý¹Ø¼ü×Ö var À´¶¨Òå
  • var4¶ÔÓ¦µÄÄäÃûº¯Êý±í´ïʽºÍvar5¶ÔÓ¦µÄÓÐÃûº¯Êý±í´ïʽ¶¼Ã»ÓÐÌí¼Óµ½windowÖУ¬ÒòΪËüÃÇÊǺ¯Êý±í´ïʽ£¬Ö´ÐеÄʱºò²Å½øÐмÆËã¡£var4ºÍvar5µÄֵΪundefined£¬¶øfun1µÄÖµ²»ÊÇundefined£»
  • ×÷ÓÃÓòÁ´Îª: [window]

(2) Ö´ÐеÚ3ÐÐʱ£¬ÒòΪ³ÌÐò¶ÔÒ»¸öûÓж¨ÒåµÄ±äÁ¿var2¸³Öµ£¬ÏµÍ³½«ÒþʽµÄ¶¨ÒåÒ»¸ö±äÁ¿var2£¬²¢×÷ΪÊôÐÔÌí¼Óµ½windowÖУ»µÚ3ÐÐÖ´ÐнáÊøºówindow.var1 = 'undefined'; window.var2 = 'var2';

?

(3)Ö´ÐеÚ4ÐÐʱ£¬½«ÔÚµ±Ç°×÷ÓÃÓòÁ´ÖУ¬½øÐÐÒ»´Î±äÁ¿Ê¶±ð£¬ÔÚ±äÁ¿¶ÔÏówindow.fun1ÖÐÕÒµ½ÁËfun1µÄÖµ£¬²¢Ö´ÐÐfun1¡£

?

(4) µÚ9ÐÐÖ´ÐÐÍêºó£¬window.var4µÄֵΪ£ºÍ¨¹ýÄäÃûº¯Êý±í´ïʽ´´½¨µÄÒ»¸öFunction¶ÔÏó¡£

?

(5) Ö´ÐеÚ13Ðкówindow.var5µÄֵΪ£ºÍ¨¹ýÓÐÃûº¯Êý±í´ïʽ´´½¨µÄÒ»¸öFunction¶ÔÏó¡£µ«ÊÇ´Ëʱwindow¶ÔÏóÖв¢²»´æÔÚfun2Õâ¸öÊôÐÔ£»

?

(6) Ö´ÐÐÍêµÚ19Ðкó£¬window.var6¸³ÖµÎª81£»

?

(7) Ö´ÐÐÍêµÚ20Ðкó£¬window.var6ÈÔÈ»ÊÇ81£¬ÒòΪÕâÖ»ÊÇÒ»¸ö±äÁ¿¶¨ÒåÓï¾ä£»

?

(8) Ö´ÐеÚ22ÐÐʱ³ö´í£¬ÒòΪÔÚwindowÖÐÕÒ²»µ½ÃûΪfun3µÄÊôÐÔ£¬¹Ê·µ»Ønull.fun3£¬ÊÔͼ¼ÆËãnull.fun3()ʱ±¨´í£»?

?

(9) ÔÚÒ»¸öÖ´Ðпé(script)Öгö´íºó£¬¸Ã¿éÖеĺóÐøJS½«²»ÔÙÖ´ÐУ¬¹Êvar4()²»»áÖ´ÐУ»µ«ÊǺóÃæscript±êÇ©Öп齫¼ÌÐøÖ´ÐÐ

?

(10) Ö´ÐеÚ26ÐÐ֮ǰ£¬´Ëʱ»áÔ¤´¦Àí¸Ãscript±êÇ©ÖеÄJSÔ´Â룬Á÷³ÌºÍ´¦ÀíµÚÒ»¸öscript±êÇ©ÏàËÆ¡£

?

(11) Ö´ÐеÚ27ÐÐʱ½«µ¯³öfun3¡£

?

?


  Ïà¹Ø½â¾ö·½°¸