1. 鑳借鍑烘潵涓ょ瀵逛簬 JavaScript 宸ョ▼甯堝緢閲嶈鐨勭紪绋嬭寖寮忎箞锛烰avaScript 鏄竴闂ㄥ鑼冨紡锛坢ulti-paradigm锛夌殑缂栫▼璇█锛屽畠鏃㈡敮鎸佸懡浠ゅ紡锛坕mperative锛?闈㈠悜杩囩▼锛坧rocedural锛夌紪绋嬶紝涔熸敮鎸侀潰鍚戝璞＄紪绋嬶紙OOP锛孫bject-Oriented Programming锛夛紝杩樻敮鎸佸嚱鏁板紡缂栫▼锛坒unctional programming锛夈€侸avaScript 鎵€鏀寔鐨勯潰鍚戝璞＄紪绋嬪寘鎷師鍨嬬户鎵匡紙prototypal inheritance锛夈€傞潰璇曞姞鍒嗛」鍘熷瀷缁ф壙锛堝嵆锛氬師鍨嬶紝OLOO鈥斺€旈摼鎺ュ埌鍏跺畠瀵硅薄鐨勫璞★級锛涘嚱鏁板紡缂栫▼锛堝嵆锛氶棴鍖咃紙closure锛夛紝涓€绫诲嚱鏁帮紙first class functions锛夛紝lambda 鍑芥暟锛氱澶村嚱鏁帮級銆傞潰璇曞噺鍒嗛」杩炶寖寮忛兘涓嶇煡閬擄紝鏇村埆鎻愪粈涔堝師鍨?OO锛坧rototypal oo锛夋垨鑰呭嚱鏁板紡缂栫▼浜嗐€傛繁鍏ヤ簡瑙he Two Pillars of JavaScript Part 1锛欽S 涓ゅぇ鏀煴涔嬩竴锛氬師鍨?OOThe Two Pillars of JavaScript Part 2锛欽S 涓ゅぇ鏀煴涔嬩簩锛氬嚱鏁板紡缂栫▼2. 浠€涔堟槸鍑芥暟寮忕紪绋嬶紵鍑芥暟寮忕紪绋嬶紝鏄皢鏁板鍑芥暟缁勫悎璧锋潵锛屽苟涓旈伩鍏嶄簡鐘舵€佸叡浜紙shared state锛夊強鍙彉鏁版嵁锛坢utable data锛夛紝鐢辨鑰屼骇鐢熺殑缂栫▼璇█銆傚彂鏄庝簬 1958 骞寸殑 Lisp 灏辨槸棣栨壒鏀寔鍑芥暟寮忕紪绋嬬殑璇█涔嬩竴锛岃€?位 婕旂畻锛坙ambda calculus锛夊垯鍙互璇存槸瀛曡偛浜嗚繖闂ㄨ瑷€銆傚嵆浣垮湪浠婂ぉ锛孡isp 杩欎釜瀹舵棌鐨勭紪绋嬭瑷€搴旂敤鑼冨洿渚濈劧寰堝箍銆傚嚱鏁板紡缂栫▼鍙槸 JavaScript 璇█涓潪甯搁噸瑕佺殑涓€涓蹇碉紙瀹冨彲鏄?JavaScript 鐨勪袱澶ф敮鏌变箣涓€锛夈€侲S5 瑙勮寖涓氨澧炲姞浜嗗緢澶氬父鐢ㄧ殑鍑芥暟寮忓伐鍏枫€傞潰璇曞姞鍒嗛」绾嚱鏁帮紙pure functions锛?鍑芥暟鐨勭函绮规€э紙function purity锛夌煡閬撳浣曢伩鍏嶅壇浣滅敤锛坰ide-effects锛夌畝鍗曞嚱鏁扮殑缁勫悎鍑芥暟寮忕紪绋嬭瑷€锛歀isp锛孧L锛孒askell锛孍rlang锛孋lojure锛孍lm锛孎#锛孫Caml锛岀瓑绛夋彁鍒颁簡 JavaScript 璇█涓敮鎸佸嚱鏁板紡缂栫▼锛團P锛夌殑鐗规€э細涓€绫诲嚱鏁帮紝楂橀樁鍑芥暟锛坔igher order functions锛夛紝浣滀负鍙傛暟锛坅rguments锛?鍊硷紙values锛夌殑鍑芥暟闈㈣瘯鍑忓垎椤规病鏈夋彁鍒扮函鍑芥暟锛屼互鍙婂浣曢伩鍏嶅壇浣滅敤娌℃湁鎻愪緵鍑芥暟寮忕紪绋嬭瑷€鐨勪緥瀛愭病鏈夎鏄?JavaScript 涓殑鍝簺鐗规€т娇寰楀嚱鏁板紡缂栫▼寰椾互瀹炵幇娣卞叆浜嗚ВThe Two Pillars of JavaScript Part 2锛欽S 涓ゅぇ鏀煴涔嬩簩锛氬嚱鏁板紡缂栫▼The Dao of ImmutabilityComposing SoftwareThe Haskell School of Music3. 绫荤户鎵垮拰鍘熷瀷缁ф壙鏈変粈涔堝尯鍒紵绫荤户鎵匡紙Class Inheritance锛夛細瀹炰緥锛坕nstances锛夌敱绫荤户鎵胯€屾潵锛堢被鍜屽疄渚嬬殑鍏崇郴锛屽彲浠ョ被姣斾负寤虹瓚鍥剧焊鍜屽疄闄呭缓绛?馃彔 鐨勫叧绯伙級锛屽悓鏃惰繕浼氬垱寤虹埗绫烩€斿瓙绫昏繖鏍蜂竴绉嶅叧绯伙紝涔熷彨鍋氱被鐨勫垎灞傚垎绫伙紙hierarchical class taxonomies锛夈€傞€氬父鏄敤 new 鍏抽敭瀛楄皟鐢ㄧ被鐨勬瀯閫犲嚱鏁帮紙constructor functions锛夋潵鍒涘缓瀹炰緥鐨勩€備笉杩囧湪 ES6 涓紝瑕佺户鎵夸竴涓被锛屼笉鐢?class 鍏抽敭瀛椾篃鍙互銆傚師鍨嬬户鎵匡紙Prototypal Inheritance锛夛細瀹炰緥/瀵硅薄鐩存帴浠庡叾瀹冨璞＄户鎵胯€屾潵锛屽垱寤哄疄渚嬬殑璇濓紝寰€寰€鐢ㄥ伐鍘傚嚱鏁帮紙factory functions锛夋垨鑰?Object.create() 鏂规硶銆傚疄渚嬪彲浠ヤ粠澶氫釜涓嶅悓鐨勫璞＄粍鍚堣€屾潵锛岃繖鏍峰氨鑳介€夋嫨鎬у湴缁ф壙浜嗐€傚湪 JavaScript 涓紝鍘熷瀷缁ф壙姣旂被缁ф壙鏇寸畝鍗曪紝涔熸洿鐏垫椿銆傞潰璇曞姞鍒嗛」绫伙細浼氬垱寤虹揣瀵嗙殑鑰﹀悎锛屾垨鑰呰灞傜骇缁撴瀯锛坔ierarchies锛?鍒嗙被锛坱axonomies锛夈€傚師鍨嬶細鎻愬埌浜嗚鎺ョ户鎵匡紙concatenative inheritance锛夈€佸師鍨嬪鎵橈紙 prototype delegation锛夈€佸嚱鏁扮户鎵匡紙functional inheritance锛夛紝浠ュ強瀵硅薄缁勫悎锛坥bject composition锛夈€傞潰璇曞噺鍒嗛」鍘熷瀷缁ф壙鍜岀粍鍚堬紝涓庣被缁ф壙鐩告瘮锛屼笉鐭ラ亾鍝釜鏇村ソ銆傛繁鍏ヤ簡瑙he Two Pillars of JavaScript Part 1锛欽S 涓ゅぇ鏀煴涔嬩竴锛氬師鍨?OOCommon Misconceptions About Inheritance in JavaScript锛氬浜?JavaScript 涓户鎵胯繖涓蹇碉紝鎵€鏅亶瀛樺湪鐨勮瑙?. 鍑芥暟寮忕紪绋嬪拰闈㈠悜瀵硅薄缂栫▼锛屽悇鏈変粈涔堜紭鐐瑰拰涓嶈冻鍛紵闈㈠悜瀵硅薄缂栫▼鐨勪紭鐐癸細鍏充簬鈥滃璞♀€濈殑涓€浜涘熀纭€姒傚康鐞嗚В璧锋潵姣旇緝瀹规槗锛屾柟娉曡皟鐢ㄧ殑鍚箟涔熷ソ瑙ｉ噴銆傞潰鍚戝璞＄紪绋嬮€氬父浣跨敤鍛戒护寮忕殑缂栫爜椋庢牸锛屽０鏄庡紡锛坉eclarative style锛夌殑鐢ㄥ緱姣旇緝灏戙€傝繖鏍风殑浠ｇ爜璇昏捣鏉ワ紝鍍忔槸涓€缁勭洿鎺ョ殑銆佽绠楁満寰堝鏄撳氨鑳介伒寰殑鎸囦护銆傞潰鍚戝璞＄紪绋嬬殑涓嶈冻锛氶潰鍚戝璞＄紪绋嬪線寰€闇€瑕佸叡浜姸鎬併€傚璞″強鍏惰涓哄父甯镐細娣诲姞鍒板悓涓€涓疄浣撲笂锛岃繖鏍蜂竴鏉ワ紝濡傛灉涓€鍫嗗嚱鏁伴兘瑕佽闂繖涓疄浣擄紝鑰屼笖杩欎簺鍑芥暟鐨勬墽琛岄『搴忎笉纭畾鐨勮瘽锛屽緢鍙兘灏变細鍑轰贡瀛愪簡锛屾瘮濡傜珵浜夋潯浠讹紙race conditions锛夎繖绉嶇幇璞★紙鍑芥暟 A 渚濊禆浜庡疄浣撶殑鏌愪釜灞炴€э紝浣嗘槸鍦?A 璁块棶灞炴€т箣鍓嶏紝灞炴€у凡缁忚鍑芥暟 B 淇敼浜嗭紝閭ｄ箞鍑芥暟 A 鍦ㄤ娇鐢ㄥ睘鎬х殑鏃跺€欙紝寰堝彲鑳藉氨寰椾笉鍒伴鏈熺殑缁撴灉锛夈€傚嚱鏁板紡缂栫▼鐨勪紭鐐癸細鐢ㄥ嚱鏁板紡鑼冨紡鏉ョ紪绋嬶紝灏变笉闇€瑕佹媴蹇冨叡浜姸鎬佹垨鑰呭壇浣滅敤浜嗐€傝繖鏍峰氨閬垮厤浜嗗嚑涓嚱鏁板湪璋冪敤鍚屼竴鎵硅祫婧愭椂鍙兘浜х敓鐨?bug 浜嗐€傛嫢鏈変簡鈥滄棤鍙傞鏍尖€濓紙point-free style锛屼篃鍙殣寮忕紪绋嬶級涔嬬被鐨勭壒鎬т箣鍚庯紝鍑芥暟寮忕紪绋嬪氨澶уぇ绠€鍖栦簡锛屾垜浠篃鍙互鐢ㄥ嚱鏁板紡缂栫▼鐨勬柟寮忔潵鎶婁唬鐮佺粍鍚堟垚澶嶇敤鎬ф洿寮虹殑浠ｇ爜浜嗭紝闈㈠悜瀵硅薄缂栫▼鍙仛涓嶅埌杩欎竴鐐广€傚嚱鏁板紡缂栫▼鏇村亸鐖卞０鏄庡紡銆佺鍙峰紡锛坉enotational style锛夌殑缂栫爜椋庢牸锛岃繖鏍风殑浠ｇ爜锛屽苟涓嶆槸閭ｇ涓轰簡瀹炵幇鏌愮鐩殑鑰岄渶瑕佹寜閮ㄥ氨鐝湴鎵ц鐨勪竴澶у爢鎸囦护锛岃€屾槸鍏虫敞瀹忚涓婅鍋氫粈涔堛€傝嚦浜庡叿浣撳簲璇ユ€庝箞鍋氾紝灏遍兘闅愯棌鍦ㄥ嚱鏁板唴閮ㄤ簡銆傝繖鏍蜂竴鏉ワ紝瑕佹槸鎯抽噸鏋勪唬鐮併€佷紭鍖栨€ц兘锛岄偅灏卞ぇ鏈夊彲涓轰簡銆傦紙璇戣€呮敞锛氫互鍋氫竴閬撹彍涓轰緥锛屽氨鏄敱 涔拌彍 -> 娲楄彍 -> 鐐掕彍 杩欎笁姝ョ粍鎴愶紝姣忎竴姝ラ兘鏄嚱鏁板紡缂栫▼鐨勪竴涓嚱鏁帮紝涓嶇鍋氫粈涔堣彍锛岃繖涓祦绋嬮兘鏄笉浼氬彉鐨勩€傝€屾兂瑕佷紭鍖栬繖涓繃绋嬶紝鑷劧灏辨槸瑕佹繁鍏ユ瘡涓€姝ヤ箣涓簡銆傝繖鏍蜂笉绠″唴閮ㄥ浣曢噸鏋勩€佷紭鍖栵紝鏁翠綋鐨勬祦绋嬪苟涓嶄細鍙橈紝杩欏氨鏄嚱鏁板紡缂栫▼鐨勫ソ澶勩€傦級鐢氳嚦鍙互鎶婁竴绉嶇畻娉曟崲鎴愬彟涓€绉嶆洿楂樻晥鐨勭畻娉曪紝鍚屾椂杩樺熀鏈笉闇€瑕佷慨鏀逛唬鐮侊紙姣斿鎶婂強鏃╂眰鍊肩瓥鐣ワ紙eager evaluation锛夋浛鎹负鎯版€ф眰鍊肩瓥鐣ワ紙lazy evaluation锛夛級銆傚埄鐢ㄧ函鍑芥暟杩涜鐨勮绠楋紝鍙互寰堟柟渚垮湴鎵╁睍鍒板澶勭悊鍣ㄧ幆澧冧笅锛屾垨鑰呭簲鐢ㄥ埌鍒嗗竷寮忚绠楅泦缇や笂锛屽悓鏃惰繕涓嶇敤鎷呭績绾跨▼璧勬簮鍐茬獊銆佺珵浜夋潯浠朵箣绫荤殑闂銆傚嚱鏁板紡缂栫▼鐨勪笉瓒筹細浠ｇ爜濡傛灉杩囧害鍒╃敤浜嗗嚱鏁板紡鐨勭紪绋嬬壒鎬э紙濡傛棤鍙傞鏍笺€佸ぇ閲忔柟娉曠殑缁勫悎锛夛紝灏变細褰卞搷鍏跺彲璇绘€э紝浠庤€岀畝娲佸害鏈変綑銆佹槗璇绘€т笉瓒炽€傚ぇ閮ㄥ垎宸ョ▼甯堣繕鏄洿鐔熸倝闈㈠悜瀵硅薄缂栫▼銆佸懡浠ゅ紡缂栫▼锛屽浜庡垰鎺ヨЕ鍑芥暟寮忕紪绋嬬殑浜烘潵璇达紝鍗充娇鍙槸杩欎釜棰嗗煙鐨勪竴浜涚殑绠€鍗曟湳璇紝閮藉彲鑳借浠栨€€鐤戜汉鐢熴€傚嚱鏁板紡缂栫▼鐨勫涔犳洸绾挎洿闄″抄锛屽洜涓洪潰鍚戝璞＄紪绋嬪お鏅強浜嗭紝瀛︿範璧勬枡澶浜嗐€傜浉姣旇€岃█锛屽嚱鏁板紡缂栫▼鍦ㄥ鏈鍩熺殑搴旂敤鏇村箍娉涗竴浜涳紝鍦ㄥ伐涓氱晫鐨勫簲鐢ㄧ◢閫婁竴绛癸紝鑷劧涔熷氨涓嶉偅涔堚€滃钩鏄撹繎浜衡€濅簡銆傚湪鎺㈣鍑芥暟寮忕紪绋嬫椂锛屼汉浠線寰€鐢?位 婕旂畻銆佷唬鏁般€佽寖鐣村绛夊绉戠殑涓撲笟鏈鍜屼笓涓氱鍙锋潵鎻忚堪鐩稿叧鐨勬蹇碉紝閭ｄ箞鍏朵粬浜烘兂瑕佸叆闂ㄥ嚱鏁板紡缂栫▼鐨勮瘽锛屽氨寰楀厛鎶婅繖浜涢鍩熺殑鍩虹鐭ヨ瘑鎼炴槑鐧斤紝鑳戒笉璁╀汉澶村ぇ涔堛€傞潰璇曞姞鍒嗛」鍏变韩鐘舵€佺殑缂虹偣銆佽祫婧愮珵浜夈€佺瓑绛夛紙闈㈠悜瀵硅薄缂栫▼锛夊嚱鏁板紡缂栫▼鑳藉鏋佸ぇ鍦扮畝鍖栧簲鐢ㄥ紑鍙戦潰鍚戝璞＄紪绋嬪拰鍑芥暟寮忕紪绋嬪涔犳洸绾跨殑涓嶅悓涓ょ缂栫▼鏂瑰紡鍚勮嚜鐨勪笉瓒充箣澶勶紝浠ュ強瀵逛唬鐮佸悗鏈熺淮鎶ゅ甫鏉ョ殑褰卞搷鍑芥暟寮忛鏍肩殑浠ｇ爜搴擄紝瀛︿範鏇茬嚎浼氬緢闄″抄闈㈠悜瀵硅薄缂栫▼椋庢牸鐨勪唬鐮佸簱锛屼慨鏀硅捣鏉ュ緢闅撅紝寰堝鏄撳嚭闂锛堝拰姘村钩鐩稿綋鐨勫嚱鏁板紡椋庢牸鐨勪唬鐮佺浉姣旓級涓嶅彲鍙樻€э紙immutability锛夛紝鑳藉鏋佸ぇ鍦版彁鍗囩▼搴忓巻鍙茬姸鎬侊紙program state history锛夌殑鍙鎬э紙accessible锛夊拰鎵╁睍鎬э紙malleable锛夛紝杩欐牱涓€鏉ワ紝鎯宠娣诲姞璇稿鏃犻檺鎾ら攢/閲嶅仛銆佸€掑甫/鍥炴斁銆佸彲鍚庨€€鐨勮皟璇曚箣绫荤殑鍔熻兘鐨勮瘽锛屽氨绠€鍗曞浜嗐€備笉绠℃槸闈㈠悜瀵硅薄缂栫▼杩樻槸鍑芥暟寮忕紪绋嬶紝杩欎袱绉嶈寖寮忛兘鑳藉疄鐜颁笉鍙彉鎬э紝浣嗘槸瑕佺敤闈㈠悜瀵硅薄鏉ュ疄鐜扮殑璇濓紝鍏变韩鐘舵€佸璞＄殑鏁伴噺灏变細鍓у锛屼唬鐮佷篃浼氬彉寰楀鏉傚緢澶氥€傞潰璇曞噺鍒嗛」娌℃湁璁茶繖涓ょ缂栫▼鑼冨紡鐨勭己鐐光€斺€斿鏋滅啛鎮夎嚦灏戝叾涓竴绉嶈寖寮忕殑璇濓紝搴旇鑳藉璇村嚭寰堝杩欑鑼冨紡鐨勭己鐐瑰惂銆傛繁鍏ヤ簡瑙ｆ€绘槸浣犱咯锛岀湅鏉ヤ綘淇╃湡鏄潪甯搁噸瑕佸晩銆俆he Two Pillars of JavaScript Part 1锛欽S 涓ゅぇ鏀煴涔嬩竴锛氬師鍨?OOThe Two Pillars of JavaScript Part 2锛欽S 涓ゅぇ鏀煴涔嬩簩锛氬嚱鏁板紡缂栫▼5. 浠€涔堟椂鍊欒鐢ㄧ被缁ф壙锛熷崈涓囧埆鐢ㄧ被缁ф壙锛佹垨鑰呰灏介噺鍒敤銆傚鏋滈潪瑕佺敤锛屽氨鍙敤瀹冪户鎵夸竴绾э紙one level锛夊氨濂戒簡锛屽绾х殑绫荤户鎵跨畝鐩村氨鏄弽妯″紡鐨勩€傝繖涓瘽棰橈紙涓嶅お鏄庣櫧鏄叧浜庝粈涔堢殑鈥︹€︼級鎴戜篃鍙備笌璁ㄨ杩囧ソ浜涘勾浜嗭紝浠呮湁鐨勪竴浜涘洖绛旀渶缁堜篃娌︿负 甯歌鐨勮瑙?涔嬩竴銆傛洿澶氱殑鏃跺€欙紝杩欎釜璇濋璁ㄨ鐫€璁ㄨ鐫€灏辨病鍔ㄩ潤浜嗐€傚鏋滀竴涓壒鎬ф湁鏃跺€欏緢鏈夌敤 浣嗘湁鏃跺€欏張寰堝嵄闄?骞朵笖杩樻湁鍙︿竴绉嶆洿濂界殑鐗规€у彲浠ョ敤 閭ｅ姟蹇呰鐢ㄥ彟涓€绉嶆洿濂界殑鐗规€ Douglas Crockford闈㈣瘯鍔犲垎椤瑰敖閲忓埆鐢紝鐢氳嚦鏄交搴曚笉鐢ㄧ被缁ф壙銆傛湁鏃跺€欏彧缁ф壙涓€绾х殑璇濅篃杩樻槸 OK 鐨勶紝姣斿浠庢鏋剁殑鍩虹被缁ф壙锛屼緥濡?React.Component銆傜浉姣旂被缁ф壙锛屽璞＄粍鍚堬紙object composition锛夋洿濂戒竴浜涖€傛繁鍏ヤ簡瑙he Two Pillars of JavaScript Part 1锛欽S 涓ゅぇ鏀煴涔嬩竴锛氬師鍨?OOJS Objects鈥娾€斺€奍nherited a Mess锛欽S 瀵硅薄锛堢户鎵匡級鈥斺€斿彧鏄户鎵夸簡娣蜂贡锛坢ess锛夎€屽凡6. 浠€涔堟椂鍊欒鐢ㄥ師鍨嬬户鎵匡紵鍘熷瀷缁ф壙鍙互鍒嗕负涓嬮潰鍑犵被锛氬鎵橈紙delegation锛屼篃灏辨槸鍘熷瀷閾撅級缁勫悎锛坈oncatenative锛屾瘮濡傛贩鐢紙mixins锛夈€?Object.assign()锛夊嚱鏁板紡锛坒unctional锛岃繖涓嚱鏁板紡鍘熷瀷缁ф壙涓嶆槸鍑芥暟寮忕紪绋嬨€傝繖閲岀殑鍑芥暟鏄敤鏉ュ垱寤轰竴涓棴鍖咃紝浠ュ疄鐜扮鏈夌姸鎬侊紙private state锛夋垨鑰呭皝瑁咃紙encapsulation锛夛級涓婇潰杩欎笁绉嶅師鍨嬬户鎵块兘鏈夊悇鑷殑閫傜敤鍦烘櫙锛屼笉杩囧畠浠兘寰堟湁鐢紝鍥犱负閮借兘瀹炵幇缁勫悎缁ф壙锛坈omposition锛夛紝涔熷氨鏄缓绔嬩簡 A 鎷ユ湁鐗规€?B锛坔as-a锛夈€丄 鐢ㄥ埌浜嗙壒鎬?B锛坲ses-a锛?鎴栬€?A 鍙互瀹炵幇鐗规€?B锛坈an-do锛?鐨勮繖鏍蜂竴绉嶅叧绯汇€傜浉姣旇€岃█锛岀被缁ф壙寤虹珛鐨勬槸 A 灏辨槸 B 杩欐牱涓€绉嶅叧绯汇€傞潰璇曞姞鍒嗛」鐭ラ亾鍦ㄤ粈涔堟儏鍐典笅涓嶉€傚悎鐢ㄦā鍧楀寲锛坢odules锛夋垨鑰呭嚱鏁板紡缂栫▼銆傜煡閬撻渶瑕佺粍鍚堝涓笉鍚屾潵婧愮殑瀵硅薄鏃讹紝搴旇鎬庝箞鍋氥€傜煡閬撲粈涔堟椂鍊欒鐢ㄧ户鎵裤€傞潰璇曞噺鍒嗛」涓嶇煡閬撲粈涔堟椂鍊欏簲璇ョ敤鍘熷瀷銆備笉鐭ラ亾娣风敤鍜?Object.assign()銆傛繁鍏ヤ簡瑙rogramming JavaScript Applications锛氭枃绔犱腑鐨勨€滃師鍨嬧€濊繖涓€鑺?. 涓轰粈涔堣鈥滃璞＄粍鍚堟瘮绫荤户鎵挎洿濂解€濓紵杩欏彞璇濆紩鐢ㄧ殑鏄€婅璁¤姳绾广€嬶紙Design Patterns锛岃璁℃ā寮忥級杩欐湰涔︾殑鍐呭銆傛剰鎬濇槸瑕佹兂瀹炵幇浠ｇ爜閲嶇敤锛屽氨搴旇鎶婁竴鍫嗗皬鐨勫姛鑳藉崟鍏冪粍鍚堟垚婊¤冻闇€姹傜殑鍚勭瀵硅薄锛岃€屼笉鏄€氳繃绫荤户鎵垮紕鍑烘潵涓€灞備竴灞傜殑瀵硅薄銆傛崲鍙ヨ瘽璇达紝灏辨槸灏介噺缂栫▼瀹炵幇 can-do銆乭as-a 鎴栬€?uses-a 杩欑鍏崇郴锛岃€屼笉鏄?is-a 杩欑鍏崇郴銆傞潰璇曞姞鍒嗛」閬垮厤浣跨敤绫荤户鎵裤€傞伩鍏嶄娇鐢ㄩ棶棰樺澶氱殑鍩虹被銆傞伩鍏嶇揣鑰﹀悎銆傞伩鍏嶆瀬鍏朵笉鐏垫椿鐨勫眰娆″垎绫伙紙taxonomy锛夛紙绫荤户鎵挎墍浜х敓鐨?is-a 鍏崇郴鍙兘浼氬鑷村緢澶氳鐢ㄧ殑鎯呭喌锛夐伩鍏嶅ぇ鐚╃尒棣欒晧闂锛堚€滀綘鍙槸鎯宠涓€鏍归钑夛紝缁撴灉鏈€鍚庡嵈鏁村嚭鏉ヤ竴鍙嬁鐫€棣欒晧鐨勫ぇ鐚╃尒锛岃繕鏈夋暣涓笡鏋椻€濓級銆傝璁╀唬鐮佹洿鍏锋墿灞曟€с€傞潰璇曞噺鍒嗛」娌℃湁鎻愬埌涓婇潰浠讳綍涓€绉嶉棶棰樸€傛病鏈夎〃杈炬竻妤氬璞＄粍鍚堜笌绫荤户鎵挎湁浠€涔堝尯鍒紝涔熸病鏈夋彁鍒板璞＄粍鍚堢殑浼樼偣銆傛繁鍏ヤ簡瑙omposition over InheritanceIntroducing the Stamp Specification8. 鍙屽悜鏁版嵁缁戝畾/鍗曞悜鏁版嵁娴佺殑鍚箟鍜屽尯鍒弻鍚戞暟鎹粦瀹氾紙two-way data binding锛夛紝鎰忓懗鐫€ UI 灞傛墍鍛堢幇鐨勫唴瀹瑰拰 Model 灞傜殑鏁版嵁鍔ㄦ€佸湴缁戝畾鍦ㄤ竴璧蜂簡锛屽叾涓竴涓彂鐢熶簡鍙樺寲锛屽氨浼氱珛鍒诲弽鏄犲湪鍙︿竴涓笂銆傛瘮濡傜敤鎴峰湪鍓嶇椤甸潰鐨勮〃鍗曟帶浠朵腑杈撳叆浜嗕竴涓€硷紝Model 灞傚搴旇鎺т欢鐨勫彉閲忓氨浼氱珛鍒绘洿鏂颁负鐢ㄦ埛鎵€杈撳叆鐨勫€硷紱鍙嶄箣浜︾劧锛屽鏋?Modal 灞傜殑鏁版嵁鏈夊彉鍖栵紝鍙樺寲鍚庣殑鏁版嵁涔熶細绔嬪埢鍙嶆槧鑷?UI 灞傘€傚崟鍚戞暟鎹祦锛坥ne-way data flow锛夛紝 鎰忓懗鐫€鍙湁 Model 灞傛墠鏄崟涓€鏁版嵁婧愶紙single source of truth锛夈€俇I 灞傜殑鍙樺寲浼氳Е鍙戝搴旂殑娑堟伅鏈哄埗锛屽憡鐭?Model 灞傜敤鎴风殑鐩殑锛堝搴?React 鐨?store锛夈€傚彧鏈?Model 灞傛墠鏈夋洿鏀瑰簲鐢ㄧ姸鎬佺殑鏉冮檺锛岃繖鏍蜂竴鏉ワ紝鏁版嵁姘歌繙閮芥槸鍗曞悜娴佸姩鐨勶紝涔熷氨鏇村鏄撲簡瑙ｅ簲鐢ㄧ殑鐘舵€佹槸濡備綍鍙樺寲鐨勩€傞噰鐢ㄥ崟鍚戞暟鎹祦鐨勫簲鐢紝鍏剁姸鎬佺殑鍙樺寲鏄緢瀹规槗璺熻釜鐨勶紝閲囩敤鍙屽悜鏁版嵁缁戝畾鐨勫簲鐢紝灏卞緢闅捐窡韪苟鐞嗚В鐘舵€佺殑鍙樺寲浜嗐€傞潰璇曞姞鍒嗛」React 鏄崟鍚戞暟鎹祦鐨勫吀鍨嬶紝闈㈣瘯鏃舵彁鍒拌繖涓鏋剁殑璇濅細鍔犲垎銆侰ycle.js 鍒欐槸鍙︿竴涓緢娴佽鐨勫崟鍚戞暟鎹祦鐨勫簱銆侫ngular 鍒欐槸鍙屽悜鏁版嵁缁戝畾鐨勫吀鍨嬨€傞潰璇曞噺鍒嗛」涓嶇悊瑙ｅ崟鍚戞暟鎹祦/鍙屽悜鏁版嵁缁戝畾鐨勫惈涔夛紝涔熻涓嶆竻妤氫袱鑰呬箣闂寸殑鍖哄埆銆傛繁鍏ヤ簡瑙ntroduction to React.js9. 鍗曚綋鏋舵瀯鍜屽井鏈嶅姟鏋舵瀯鍚勬湁浣曚紭鍔ｏ紵閲囩敤鍗曚綋鏋舵瀯锛坢onolithic architecture锛夌殑搴旂敤锛屽悇缁勪欢鐨勪唬鐮佹槸浣滀负涓€涓暣浣撳瓨鍦ㄧ殑锛岀粍浠朵箣闂翠簰鐩稿悎浣滐紝鍏变韩鍐呭瓨鍜岃祫婧愩€傝€屽井鏈嶅姟鏋舵瀯锛坢icroservice architecture锛夊垯鏄敱璁歌澶氬涓簰鐩哥嫭绔嬬殑灏忓簲鐢ㄧ粍鎴愶紝姣忎釜搴旂敤閮芥湁鑷繁鐨勫唴瀛樼┖闂达紝搴旂敤鍦ㄦ墿瀹规椂涔熸槸鐙珛浜庡叾瀹冨簲鐢ㄨ繘琛岀殑銆傚崟浣撴灦鏋勭殑浼樺娍锛氬ぇ閮ㄥ垎搴旂敤閮芥湁鐩稿綋鏁伴噺鐨勬í鍒囧叧娉ㄧ偣锛坈ross-cutting concerns锛夛紝姣斿鏃ュ織璁板綍锛屾祦閲忛檺鍒讹紝杩樻湁瀹¤璺熻釜鍜?DOS 闃叉姢绛夊畨鍏ㄦ柟闈㈢殑闇€姹傦紝鍗曚綋鏋舵瀯鍦ㄨ繖鏂归潰灏卞緢鏈変紭鍔裤€傚綋鎵€鏈夊姛鑳介兘杩愯鍦ㄤ竴涓簲鐢ㄩ噷鐨勬椂鍊欙紝灏卞彲浠ュ緢鏂逛究鍦板皢缁勪欢涓庢í鍒囧叧娉ㄧ偣鐩稿叧鑱斻€傚崟浣撴灦鏋勪篃鏈夋€ц兘涓婄殑浼樺娍锛屾瘯绔熻闂叡浜唴瀛樿繕鏄瘮杩涚▼闂撮€氫俊锛坕nter-process communication锛孖PC锛夎蹇殑銆傚崟浣撴灦鏋勭殑鍔ｅ娍锛氶殢鐫€鍗曚綋鏋舵瀯搴旂敤鍔熻兘鐨勪笉鏂紑鍙戯紝鍚勯」鏈嶅姟涔嬮棿鐨勮€﹀悎绋嬪害涔熶細涓嶆柇澧炲姞锛岃繖鏍蜂竴鏉ュ氨寰堥毦鎶婂悇椤规湇鍔″垎绂诲紑鏉ヤ簡锛岃鍋氱嫭绔嬫墿瀹规垨鑰呬唬鐮佺淮鎶や篃灏辨洿涓嶆柟渚夸簡銆傚井鏈嶅姟鐨勪紭鍔匡細寰湇鍔℃灦鏋勪竴鑸兘鏈夋洿濂界殑缁勭粐缁撴瀯锛屽洜涓烘瘡椤规湇鍔￠兘鏈夎嚜宸辩壒瀹氱殑鍒嗗伐锛岃€屼笖涔熶笉浼氬共娑夊叾瀹冪粍浠舵墍璐熻矗鐨勯儴鍒嗐€傛湇鍔¤В鑰︿箣鍚庯紝鎯宠閲嶆柊缁勫悎銆侀厤缃潵涓哄悇涓笉鍚岀殑搴旂敤鎻愪緵鏈嶅姟鐨勮瘽锛屼篃鏇存柟渚夸簡锛堟瘮濡傚悓鏃朵负 Web 瀹㈡埛绔拰鍏叡 API 鎻愪緵鏈嶅姟锛夈€傚鏋滅敤鍚堢悊鐨勬灦鏋勬潵閮ㄧ讲寰湇鍔＄殑璇濓紝瀹冨湪鎬ц兘涓婁篃鏄緢鏈変紭鍔跨殑锛屽洜涓鸿繖鏍蜂竴鏉ワ紝灏卞彲浠ュ緢杞绘澗鍦板垎绂荤儹闂ㄦ湇鍔★紝瀵瑰叾杩涜鎵╁锛屽悓鏃惰繕涓嶄細褰卞搷鍒板簲鐢ㄤ腑鐨勫叾瀹冮儴鍒嗐€傚井鏈嶅姟鐨勫姡鍔匡細鍦ㄥ疄闄呮瀯寤轰竴涓柊鐨勫井鏈嶅姟鏋舵瀯鐨勬椂鍊欙紝浼氶亣鍒板緢澶氬湪璁捐闃舵娌℃湁棰勬枡鍒扮殑妯垏鍏虫敞鐐广€傚鏋滄槸鍗曚綋鏋舵瀯搴旂敤鐨勮瘽灏卞緢绠€鍗曪紝鏂板缓涓€涓腑闂翠欢锛坰hared magic helpers 涓嶇煡閬撴€庝箞缈昏瘧鈥︹€︼級鏉ヨВ鍐宠繖鏍风殑闂灏辫浜嗭紝娌′粈涔堥夯鐑︾殑銆備絾鏄湪寰湇鍔℃灦鏋勪腑灏变笉涓€鏍蜂簡锛岃瑙ｅ喅杩欎釜闂锛岃涔堜负姣忎釜妯垏鍏虫敞鐐归兘寮曞叆涓€涓嫭绔嬬殑妯″潡锛岃涔堝氨鎶婃墍鏈夋í鍒囧叧娉ㄧ偣鐨勮В鍐虫柟妗堝皝瑁呭埌涓€涓湇鍔″眰涓紝璁╂墍鏈夋祦閲忛兘浠庤繖閲岃蛋涓€閬嶅氨琛屼簡銆備负浜嗚В鍐虫í鍒囧叧娉ㄧ偣鐨勯棶棰橈紝铏界劧鍗曚綋鏋舵瀯涔熻秼鍚戜簬鎶婃墍鏈夌殑璺敱娴侀噺閮戒粠涓€涓閮ㄦ湇鍔″眰璧颁竴閬嶏紝浣嗘槸鍦ㄨ繖绉嶆灦鏋勪腑锛屽彲浠ョ瓑鍒伴」鐩潪甯告垚鐔熶箣鍚庡啀杩涜杩欑鏀归€狅紝杩欐牱灏卞彲浠ユ妸杩樿繖绗旀妧鏈€虹殑鏃堕棿灏介噺寰€鍚庢嫋涓€鎷栥€傚井鏈嶅姟涓€鑸兘鏄儴缃插湪铏氭嫙鏈烘垨瀹瑰櫒涓婄殑锛岄殢鐫€搴旂敤瑙勬ā鐨勪笉鏂鍔狅紝铏氭嫙鏈烘姠宸ヤ綔锛圴M wrangling work锛夌殑鎯呭喌涔熶細杩呴€熷鍔犮€備换鍔＄殑鍒嗛厤涓€鑸兘鏄€氳繃瀹瑰櫒缇わ紙container fleet锛夌鐞嗗伐鍏锋潵鑷姩瀹炵幇鐨勩€傞潰璇曞姞鍒嗛」瀵逛簬寰湇鍔＄殑绉瀬鎬佸害锛岃櫧鐒跺垵濮嬫垚鏈細姣斿崟浣撴灦鏋勮楂樹竴浜涖€傜煡閬撳井鏈嶅姟鐨勬€ц兘鍜屾墿瀹瑰湪闀挎湡鐪嬫潵琛ㄧ幇鏇翠匠銆傚湪寰湇鍔℃灦鏋勫拰鍗曚綋鏋舵瀯搴旂敤涓婇兘鏈夊疄鎴樼粡楠屻€傝兘澶熶娇搴旂敤涓殑鍚勯」鏈嶅姟鍦ㄤ唬鐮佸眰闈簰鐩哥嫭绔嬶紝浣嗘槸鍙堝彲浠ュ湪寮€鍙戝垵鏈熻繀閫熷湴灏嗗悇椤规湇鍔℃墦鍖呮垚涓€鏁翠釜鐨勫崟浣撴灦鏋勫簲鐢ㄣ€傚井鏈嶅姟鍖栫殑鏀归€犲彲浠ュ湪搴旂敤鐩稿綋鎴愮啛涔嬪悗锛屾敼閫犳垚鏈湪鍙壙鍙楄寖鍥村唴鐨勬椂鍊欏啀杩涜銆傞潰璇曞噺鍒嗛」涓嶇煡閬撳崟浣撴灦鏋勫拰寰湇鍔℃灦鏋勭殑鍖哄埆銆備笉鐭ラ亾寰湇鍔℃灦鏋勯澶栫殑寮€閿€锛屾垨鑰呮病鏈夊疄闄呯粡楠屻€備笉鐭ラ亾寰湇鍔℃灦鏋勪腑锛孖PC 鍜岀綉缁滈€氫俊鎵€瀵艰嚧鐨勯澶栫殑鎬ц兘寮€閿€銆傝繃鍒嗚船浣庡井鏈嶅姟銆傝涓嶆竻妤氫粈涔堟椂鍊欏簲璇ユ妸鍗曚綋鏋舵瀯搴旂敤瑙ｈ€︽垚寰湇鍔°€備綆浼颁簡鍙嫭绔嬫墿瀹圭殑寰湇鍔＄殑浼樺娍銆?0. 寮傛缂栫▼鏄粈涔堬紵鍙堜负浠€涔堝湪 JavaScript 涓繖涔堥噸瑕侊紵鍦ㄥ悓姝ョ紪绋嬩腑锛屼唬鐮佷細鎸夐『搴忚嚜椤跺悜涓嬩緷娆℃墽琛岋紙鏉′欢璇彞鍜屽嚱鏁拌皟鐢ㄩ櫎澶栵級锛屽鏋滈亣鍒扮綉缁滆姹傛垨鑰呯鐩樿/鍐欙紙I/O锛夎繖绫昏€楁椂鐨勪换鍔★紝灏变細鍫靛鍦ㄨ繖鏍风殑鍦版柟銆傚湪寮傛缂栫▼涓紝JS 杩愯鍦ㄤ簨浠跺惊鐜紙event loop锛変腑銆傚綋闇€瑕佹墽琛屼竴涓樆濉炴搷浣滐紙blocking operation锛夋椂锛屼富绾跨▼鍙戣捣涓€涓紙寮傛锛夎姹傦紝锛堝伐浣滅嚎绋嬪氨浼氬幓鎵ц杩欎釜寮傛鎿嶄綔锛岋級鍚屾椂涓荤嚎绋嬬户缁墽琛屽悗闈㈢殑浠ｇ爜銆傦紙宸ヤ綔绾跨▼鎵ц瀹屾瘯涔嬪悗锛岋級灏变細鍙戣捣鍝嶅簲锛岃Е鍙戜腑鏂紙interrupt锛夛紝鎵ц浜嬩欢澶勭悊绋嬪簭锛坋vent handler锛夛紝鎵ц瀹屽悗涓荤嚎绋嬬户缁線鍚庤蛋銆傝繖鏍蜂竴鏉ワ紝涓€涓▼搴忕嚎绋嬪氨鍙互澶勭悊澶ч噺鐨勫苟鍙戞搷浣滀簡銆傜敤鎴风晫闈紙user interface锛孶I锛夊ぉ鐒跺氨鏄紓姝ョ殑锛屽ぇ閮ㄥ垎鏃堕棿瀹冮兘鍦ㄧ瓑寰呯敤鎴疯緭鍏ワ紝浠庤€屼腑鏂簨浠跺惊鐜紝瑙﹀彂浜嬩欢澶勭悊绋嬪簭銆侼ode.js 榛樿鏄紓姝ョ殑锛岄噰鐢ㄥ畠鏋勫缓鐨勬湇鍔＄鍜岀敤鎴风晫闈㈢殑鎵ц鏈哄埗宸笉澶氾紝鍦ㄤ簨浠跺惊鐜腑绛夊緟缃戠粶璇锋眰锛岀劧鍚庝竴涓帴涓€涓湴澶勭悊杩欎簺璇锋眰銆傚紓姝ュ湪 JavaScript 涓潪甯搁噸瑕侊紝鍥犱负瀹冩棦閫傚悎缂栧啓 UI锛屽湪鏈嶅姟绔篃鏈変笂浣崇殑鎬ц兘琛ㄧ幇銆傞潰璇曞姞鍒嗛」鐞嗚В闃诲鐨勫惈涔夛紝浠ュ強瀵规€ц兘甯︽潵鐨勫奖鍝嶃€傜悊瑙ｄ簨浠跺鐞嗙▼搴忥紝浠ュ強瀹冧负浠€涔堝 UI 閮ㄥ垎鐨勪唬鐮佸緢閲嶈銆傞潰璇曞噺鍒嗛」涓嶇啛鎮夊悓姝ャ€佸紓姝ョ殑姒傚康銆傝涓嶆竻妤氬紓姝ヤ唬鐮佸拰 UI 浠ｇ爜鐨勬€ц兘褰卞搷锛屼篃璇翠笉鏄庣櫧瀹冧咯涔嬮棿鐨勫叧绯汇€傛€荤粨澶氶棶闂簲鑱樿€呴珮灞傛鐨勭煡璇嗙偣锛屽鏋滆兘璁叉竻妤氳繖浜涙蹇碉紝灏辫鏄庡嵆浣垮簲鑱樿€呮病鎬庝箞鎺ヨЕ杩?JavaScript锛屼篃鑳藉鍦ㄧ煭鐭嚑涓槦鏈熶箣鍐呭氨鎶婅瑷€缁嗚妭鍜岃娉曚箣绫荤殑涓滆タ寮勬竻妤氥€備笉瑕佸洜涓哄簲鑱樿€呭湪涓€浜涚畝鍗曠殑鐭ヨ瘑涓婅〃鐜颁笉浣冲氨鎶婂鏂?pass 鎺夛紝姣斿缁忓吀鐨?CS-101 绠楁硶璇撅紝鎴栬€呬竴浜涜В璋滅被鐨勯鐩€傞潰璇曞畼鐪熸搴旇鍏虫敞鐨勶紝鏄簲鑱樿€呮槸鍚︾煡閬撳浣曟妸涓€鍫嗗姛鑳界粍缁囧湪涓€璧凤紝褰㈡垚涓€涓畬鏁寸殑搴旂敤銆傜數璇濋潰璇曠殑娉ㄦ剰鐐瑰氨杩欎簺浜嗭紝鍦ㄧ嚎涓嬬殑闈㈣瘯涓紝鎴戞洿鍔犲叧娉ㄥ簲鑱樿€呭疄闄呯紪鍐欎唬鐮佺殑鑳藉姏锛屾垜浼氳瀵熶粬濡備綍鍐欎唬鐮併€傚湪鎴戠殑銆婄簿閫?JavaScript 闈㈣瘯銆嬭繖涓郴鍒楁枃绔犱腑锛屼細鏈夋洿娣卞叆鐨勬弿杩般€?/p>
