当前位置: 首页 > Web前端 > HTML

一篇文章带你了解JavaScript中的函数表达式,递归,闭包,变量,this对象,模块作用域

时间:2023-04-02 23:20:28 HTML

涓€绡囨枃绔犲甫浣犱簡瑙avaScript涓殑鍑芥暟琛ㄨ揪寮忋€侀€掑綊銆侀棴鍖呫€佸彉閲忋€乼his瀵硅薄銆佹ā鍧椾綔鐢ㄥ煙锛涚浜屼釜鏄嚱鏁拌〃杈惧紡銆傝娉曪細functionfunctionName(arg0,arg1,arg2){//functionbody}鍦‵irefox銆丼afari銆丆hrome鍜孫pera涓湁鏁堬細鍙互閫氳繃璇ュ睘鎬ц闂鍑芥暟鎸囧畾鐨勫悕绉般€俢onsole.log(鍑芥暟鍚?name);//'functionName'鍑芥暟澹版槑锛氬畠鐨勪竴涓噸瑕佺壒鐐规槸锛氬嚱鏁板0鏄庢彁鍗囷紝鍗冲湪鎵ц浠g爜涔嬪墠璇诲彇鍑芥暟澹版槑锛屽彲浠ュ皢鍑芥暟澹版槑鏀惧湪璋冪敤瀹冪殑璇彞涔嬪悗銆?/璋冪敤鍑芥暟dada();//鍑芥暟澹版槑functiondada(){console.log('dada');}浣跨敤鍑芥暟琛ㄨ揪寮忥紝鍑芥暟琛ㄨ揪寮忔湁澶氱涓嶅悓鐨勫舰寮弙arfunctionName=function(arg0,arg1,arg2){//Functionbody}涓婇潰鐨勮鍙ワ紝鎹㈠彞璇濊锛屽垱寤轰簡涓€涓嚱鏁板苟灏嗗叾璧嬪€肩粰涓€涓彉閲忋€傝繖涓嚱鏁扮О涓哄尶鍚嶅嚱鏁帮紝鍥犱负娌℃湁鍑芥暟鍚嶏紝鍏抽敭瀛梖unction鍚庨潰涔熸病鏈夋爣璇嗙銆傚尶鍚嶅嚱鏁扮殑鍚嶇О鍊硷紝寰楀埌鐨勭粨鏋滀负绌哄瓧绗︿覆銆傛敞鎰忓嚱鏁拌〃杈惧紡鍜屽叾浠栬〃杈惧紡涓€鏍凤紝浣跨敤鍓嶅繀椤诲厛璧嬪€硷紝鍚﹀垯锛?/callda();varda=function(){console.log('dada');}鍑芥暟澹版槑鍜屽嚱鏁拌〃杈惧紡鐨勫尯鍒叧閿湪浜庡嚱鏁版彁鍗?/鍑芥暟琛ㄨ揪寮弙ardada;if(name){dada=function(){console.log('da1');};}else{dada=function(){console.鏃ュ織锛?da2'锛?};}閫掑綊鍑芥暟浠€涔堟槸閫掑綊鍑芥暟灏辨槸涓€涓嚱鏁伴€氳繃鍚嶅瓧璋冪敤鑷繁銆傚嚱鏁癲a(num){if(num<5){return'da';}else{杩斿洖num*da(num-2);}}闂寘闂寘鏄竴涓嚱鏁帮紝瀹冨彲浠ヨ闂彟涓€涓嚱鏁颁腑鐨勫彉閲忥紝鍒涘缓涓€涓棴鍖呮槸鍦ㄥ彟涓€涓嚱鏁颁腑鍒涘缓涓€涓嚱鏁般€侸avaScript闂寘JavaScript鍙橀噺鍙互鏄眬閮ㄧ殑鎴栧叏灞€鐨勩€傜鏈夊彉閲忓彲浠ヤ娇鐢ㄩ棴鍖呫€傞棴鍖呮槸鍙互璇诲彇鍏朵粬鍑芥暟鍐呴儴鍙橀噺鐨勫嚱鏁般€傛瘮濡傚湪javascript涓紝鍙湁鍑芥暟鍐呴儴鐨勫瓙鍑芥暟鎵嶈兘璇诲彇灞€閮ㄥ彉閲忥紝鎵€浠ラ棴鍖呭彲浠ョ悊瑙d负鈥滃嚱鏁板唴閮ㄥ畾涔夌殑鍑芥暟鈥濄€傛湰璐ㄤ笂锛岄棴鍖呮槸杩炴帴鍑芥暟鍐呴儴鍜屽嚱鏁板閮ㄧ殑妗ユ銆傞棴鍖咃紙closure锛夋槸涓€涓簿纭絾闅句互瑙i噴鐨勮绠楁満鏈銆傚湪Perl涓紝闂寘鏄綔涓哄尶鍚嶅嚱鏁板疄鐜扮殑锛岃兘澶熷湪鍑芥暟浣滅敤鍩熶箣澶栫户缁紩鐢ㄦ枃瀛楀彉閲忕殑鍊笺€傝繖浜涘閮ㄦ枃瀛楀彉閲忎細绁炲鍦颁繚鐣欏畠浠湪鏈€鍒濆畾涔夊皝闂嚱鏁版椂鐨勫€硷紙娣卞害閾炬帴锛夈€侸avascript涓棴鍖呯殑鍒涘缓杩囩▼functiona(){vari=0;鍑芥暟b(){璀︽姤(++i);}returnb;}varc=a();c();1锛屽嚱鏁癰宓屽鍦ㄥ嚱鏁癮閲岄潰锛?.鍑芥暟a杩斿洖鍑芥暟b銆傞潰璇曞畼闂垜锛氫粈涔堟槸闂寘锛屽簲璇ユ€庝箞鍥炵瓟锛熺畝鍗曞湴璇达紝涓€涓嚱鏁板彲浠ヨ闂彟涓€涓嚱鏁拌寖鍥村唴鐨勫彉閲忋€傚畠鐢变袱閮ㄥ垎缁勬垚锛氬嚱鏁板拰鍒涘缓鍑芥暟鐨勭幆澧冦€傜幆澧冪敱鍒涘缓闂寘鏃惰寖鍥村唴鐨勪换浣曞眬閮ㄥ彉閲忕粍鎴愩€傚唴瀛樻硠婕忛棴鍖呮寚鐨勬槸鍖呭惈鍑芥暟鐨勬暣涓彉閲忓璞°€傚鏋滀竴涓狧TML鍏冪礌淇濆瓨鍦ㄩ棴鍖呯殑浣滅敤鍩熼摼涓紝鍒欐剰鍛崇潃璇ュ厓绱犱笉鑳借閿€姣併€傛垜浠渶瑕佸杩欎釜鍏冪礌杩涜鎿嶄綔鍚庝富鍔ㄩ攢姣佸畠銆俧unctionda(){varelement=document.getElementById('nameDa');varid=鍏冪礌.id;element.onclick=function(){console.log(id);};element=null;}鍑芥暟鍐呴儴璁℃椂褰撳嚱鏁板唴閮ㄧ殑瀹氭椂鍣ㄥ紩鐢ㄥ閮ㄥ嚱鏁扮殑鍙橀噺瀵硅薄鏃讹紝璇ュ彉閲忓璞′笉浼氳閿€姣併€?function(){varda=0;setInterval(function(){console.log(da++);},1000);})();浣跨敤闂寘鐨勬祦绋嬮棴鍖呭紩鐢ㄥ閮ㄥ嚱鏁板彉閲忓璞′腑鐨勫€硷紝鍦ㄥ閮ㄥ嚱鏁扮殑澶栭儴璋冪敤闂寘涓€傛眰鍜屽嚱鏁板畾涔夊涓嬶細functionsum(arr){returnarr.reduce(function(x,y){returnx+y;});}sum([1,2,3,4,5]);//15鍑芥暟琛ㄧず锛歠unctionlazy_sum(arr){varsum=function(){returnarr.reduce(function(x,y){returnx+y;});}杩斿洖鎬诲拰;}varf=lazy_sum([1,2,3,4,5]);//鍑芥暟鎬诲拰()f();//15闂寘鐗规€э細浣垮閮ㄨ闂嚱鏁板唴閮ㄥ彉閲忔垚涓哄彲鑳斤紱灞€閮ㄥ彉閲忓皢椹荤暀鍦ㄥ唴瀛樹腑锛涘彲浠ラ伩鍏嶄娇鐢ㄥ叏灞€鍙橀噺锛岄槻姝㈠叏灞€鍙橀噺姹℃煋锛涗細閫犳垚鍐呭瓨娉勬紡锛堜竴鍧楀唴瀛樼┖闂磋闀挎湡鍗犵敤锛屼絾娌℃湁閲婃斁锛夈€傛瘡涓墽琛岀幆澧冮兘鏈変竴涓唬琛ㄥ彉閲忕殑瀵硅薄銆傚彉閲忓璞′竴鑸寘鍚袱涓綔鐢ㄥ煙閾俱€傚彉閲忓璞★紝灞€閮ㄦ椿鍔ㄥ璞″拰鍏ㄥ眬鍙橀噺瀵硅薄锛屼綔鐢ㄥ煙閾剧殑鏈川鏄竴涓寚鍚戝彉閲忓璞$殑鎸囬拡鍒楄〃锛屽畠鍙槸寮曠敤浣嗗疄闄呬笂骞朵笉鍖呭惈鍙橀噺瀵硅薄銆傚湪鍑芥暟涓闂彉閲忔椂锛屼細浠庝綔鐢ㄥ煙閾句腑鏌ユ壘鍚屽悕鍙橀噺銆備竴鑸湪鍑芥暟鎵ц鏃讹紝灞€閮ㄦ椿鍔ㄥ璞′細琚攢姣侊紝鍏ㄥ眬浣滅敤鍩熶細淇濆瓨鍦ㄥ唴瀛樹腑銆傚唴閮ㄥ嚱鏁板皢鍏跺閮ㄥ嚱鏁扮殑娲诲姩瀵硅薄娣诲姞鍒板叾浣滅敤鍩熼摼涓€傞棴鍖呬細鎵胯浇鍏跺嚱鏁颁綔鐢ㄥ煙锛屼細鍗犵敤杈冨鐨勫唴瀛橈紝杩囧害浣跨敤闂寘浼氬鑷村唴瀛樺崰鐢ㄨ繃澶氥€傚嚱鏁拌〃杈惧紡鏃犻渶鍛藉悕鍗冲彲瀹炵幇鍔ㄦ€佽鍒掋€傚嚱鏁拌〃杈惧紡涓嶉渶瑕佸悕瀛楋紝鍑芥暟澹版槑闇€瑕佸悕瀛椼€傛病鏈夊悕瀛楃殑鍑芥暟琛ㄨ揪寮忕О涓哄尶鍚嶅嚱鏁般€傞€掑綊鍑芥暟浣跨敤arguments.callee閫掑綊璋冪敤鑷韩銆傞棴鍖呯殑浣滅敤鍩熼摼鍖呭惈鑷繁鐨勪綔鐢ㄥ煙锛屽寘鎷嚱鏁颁綔鐢ㄥ煙鍜屽叏灞€浣滅敤鍩熴€備竴鑸儏鍐典笅锛屽嚱鏁颁細鍦ㄦ墽琛屽悗琚攢姣併€備絾鏄紝璇ュ嚱鏁拌繑鍥炰竴涓棴鍖咃紝骞朵笖杩欎釜鍑芥暟鐨勪綔鐢ㄥ煙灏嗕竴鐩村瓨鍌ㄥ湪鍐呭瓨涓紝鐩村埌闂寘涓嶅啀瀛樺湪銆傛ā鍧楁ā寮忔槸涓哄崟渚嬪垱寤虹鏈夊彉閲忓拰鐗规潈鏂规硶銆傚崟渚嬫槸鍙湁涓€涓疄渚嬬殑瀵硅薄锛屽崟渚嬪璞℃槸閫氳繃瀵硅薄瀛楅潰閲忔柟娉曞垱寤虹殑銆倂arda={name:'dada',eat:function(){//浠g爜}};绉佹湁寤虹珛鍜岀鏈夊嚱鏁皏arsingleton=function(){//绉佹湁鍙橀噺鍜岀鏈夊嚱鏁皏arprivateVariable=10;鍑芥暟privateFunction(){杩斿洖false锛泒//鐗规潈/鍏叡鏂规硶鍜屽睘鎬eturn{publicProperty:true,publicMethod:function(){privateVariable++;杩斿洖绉佹湁鍑芥暟锛堬級锛泒};}();varapplication=function(){//绉佹湁鍙橀噺鍜屽嚱鏁皏arcomponents=newArray();//鍒濆鍖朿omponents.push(newBaseComponent());//publicreturn{getComponentCount:function(){returncomponents.length;},registerComponent:function(component){if(typeofcomponent=="object"){components.push(component);}}};}();varsingleton=function(){//绉佹湁鍙橀噺鍜岀鏈夊嚱鏁皏arprivateVariable=10;鍑芥暟privateFunction(){杩斿洖false;}//鍒涘缓瀵硅薄varobject=newCustomType();//娣诲姞鐗规潈/鍏叡灞炴€у拰鏂规硶object.publicProperty=true;object.publicMethod=function(){privateVariable++;杩斿洖绉佹湁鍑芥暟锛堬級锛泒;//杩斿洖杩欎釜瀵硅薄杩斿洖瀵硅薄锛泒();var搴旂敤绋嬪簭=鍑芥暟ion(){//绉佹湁鍙橀噺鍜屽嚱鏁皏arcomponents=newArray();//鍒濆鍖朿omponents.push(newBaseComponent());//鍒涘缓搴旂敤绋嬪簭鐨勬湰鍦板壇鏈瑅arapp=newBaseComponent();//鍏叡鎺ュ彛app.getComponentCount=function(){returncomponents.length;};app.registerComponent=function(component){if(typeofcomponent=="object"){components.push(component);}};杩斿洖搴旂敤绋嬪簭锛泒();妯′豢鍧楃骇浣滅敤鍩熷嚱鏁皁utputNumbers(count){for(vari=0;i