涓嶇煡閬撳ぇ瀹舵槸涓嶆槸宸茬粡鍦ㄥ噯澶囨槬鎷涢潰璇曚簡銆備綘鍑嗗寰楁€庝箞鏍凤紵锛岄潰璇曠殑vue澶嶄範濡備綍锛熷鏋滀綘瑙夊緱鑷繁鍦╲ue鏂归潰杩樻瘮杈冭杽寮憋紝涓嶅Θ鏉ュ仛杩欎竴濂梞ockinterview锛岀湅鐪嬭兘涓嶈兘鎷垮埌婊″垎銆傜浣犱竴鍒囬『鍒┿€?-----杩涘叆姝ｉ锛屾垚涓洪潰璇曞畼------鐢佃瘽姝ｅ湪鎷ㄩ€氾紝鍢垮樋锛屼綘鑳藉惉鍒板悧锛屼綘鑳藉惉鍒板悧锛岄偅涔堥潰璇曞紑濮嬩簡锛屽彲浠ュ厛鑷垜浠嬬粛涓€涓嬨€?.鑷垜浠嬬粛鐨勬椂鍊欙紝鎴戜細鐪嬩竴涓嬩綘鍋氳繃鐨勯」鐩紝鎶€鏈爤绛夌瓑銆傜涓€涓棶棰橈紝鍏堣拷鏍圭┒搴曪細闂涓€锛氫綘鐭ラ亾锛堢敤杩囷級react杩樻槸angular锛熷畠浠箣闂存湁浠€涔堝尯鍒紵绛旓細Vue鍊熼壌浜哸ngular鐨勬ā鏉垮拰鏁版嵁缁戝畾鎶€鏈紝鍊熼壌浜唕eact鐨勭粍浠跺寲鍜岃櫄鎷烡OM鎶€鏈€傪煒朵綘瀵筕ue姣旇緝鐔熸倝鍚э紵锛堣繖閲屽彧璋圴ue锛屽亣璁句綘鍙槸绮鹃€歏ue锛夐棶棰?锛氬厛璇磋浣犲Vue鐨勭悊瑙ｏ紵绛旓細瀹樼綉浠嬬粛锛歝n.vuejs.org/index.html閲嶇偣锛氭笎杩涘紡JavaScript妗嗘灦锛屾牳蹇冨簱鍔犳彃浠讹紝鍔ㄦ€佸垱寤虹敤鎴风晫闈紙寮傛鑾峰彇鍚庡彴鏁版嵁锛岀晫闈㈡樉绀烘暟鎹級鐗圭偣锛歁VVM妯″紡;浠ｇ爜绠€娲佸ぇ鏂瑰皬宸ч珮鏁堬紝閫傚悎绉诲姩PC寮€鍙戯紱鍙笓娉ㄤ簬UI锛堢被浼紃eact锛夛紝鍙互鏂逛究鐨勫紩鍏ue鎻掍欢鎴栬€呭叾浠栫涓夋柟搴撹繘琛屽紑鍙戙€?/details>馃尭鎯虫兂浣犺鐨勮繖鍑犵偣锛屼綘鏄笉鏄悊瑙ｇ殑寰堟竻妤氾紵涓嬮潰缁撳悎澶у瀵箆ue鐨勭悊瑙ｆ潵璋堣皥锛氶棶棰?锛氬垰鎵嶆彁鍒癕VVM锛岃兘涓嶈兘璇︾粏璇磋锛熺瓟锛氬叏绉帮細Model-View-ViewModel锛孧odel浠ｈ〃鏁版嵁妯″瀷灞傘€俈iew浠ｈ〃瑙嗗浘灞傦紝ViewModel鏄疺iew灞傚拰Model灞備箣闂寸殑妗ユ銆傛暟鎹粦瀹氬埌viewModel灞傚苟鑷姩鍛堢幇鍒伴〉闈€傝鍥炬洿鏀归€氱煡viewModel灞傛洿鏂版暟鎹€?/details>馃樁宸笉澶氥€傛垜闂簡鍩烘湰鎯呭喌銆傛偍闇€瑕佺煡閬撳搷搴旀暟鎹€傚厛闂棶棰?锛歏ue鏄浣曞疄鐜板搷搴斿紡鏁版嵁鐨勶紵锛堝搷搴斿紡鏁版嵁鍘熺悊锛夆潡绛旓細Vue2:Object.definProperty閲嶆柊瀹氫箟data涓殑鎵€鏈夊睘鎬с€侽bject.definProperty鍙互涓烘暟鎹殑鑾峰彇鍜岃缃坊鍔犳嫤鎴姛鑳斤紝鎷︽埅灞炴€ц幏鍙栵紝鏀堕泦渚濊禆銆傛嫤鎴睘鎬х殑鏇存柊鎿嶄綔骞堕€氱煡瀹冦€傚叿浣撹繃绋嬶細棣栧厛Vue浣跨敤initData鍒濆鍖栫敤鎴蜂紶鍏ョ殑鍙傛暟锛岀劧鍚庝娇鐢╪ewObserver瑙傚療鏁版嵁銆傚鏋滄暟鎹槸瀵硅薄绫诲瀷锛屼細璋冪敤this.walk(value)澶勭悊瀵硅薄锛屽唴閮ㄤ娇鐢╠efineReactive寰幆瀵硅薄灞炴€у畾涔夊搷搴斿紡鍙樺寲鐨勬牳蹇冩槸浣跨敤Object.definProperty閲嶆柊瀹氫箟鏁版嵁銆傪煂稿鏋滀綘鍒氭墠璁蹭簡鐗╀綋鐨勬娴嬶紝鐒跺悗娌℃湁鎶婃暟缁勭殑澶勭悊璇存竻妤氾紝鎴戝氨闂笅闈㈢殑闂銆傞棶棰樹簲锛歏ue濡備綍妫€娴嬫暟缁勭殑鍙樺寲锛熺瓟锛氭暟缁勫氨鏄敤object.defineProperty閲嶆柊瀹氫箟鏁扮粍鐨勬瘡涓€椤广€傛垜浠兘鐭ラ亾鍙互寮曡捣鏁扮粍鍙樺寲鐨勬柟娉曪紝姣斿pop銆乸ush銆乻hift銆乽nshift銆乻plice銆乻ort銆乺everse锛屽彧瑕佹墽琛屼簡杩欎簺鏂规硶锛屽鏋滄暟缁勭殑鍐呭鍙戠敓鍙樺寲锛屾垜鍙槸鏇存柊鍐呭锛屽鏄撶悊瑙ｅ悧锛熺敤浜庡嚱鏁板姭鎸侊紝閲嶅啓鏁扮粍鏂规硶銆傚叿浣撴潵璇达紝灏辨槸鏀瑰彉鏁扮粍鐨勫師鍨嬶紝鏀规垚鑷繁鐨勩€傚綋鐢ㄦ埛璋冪敤鏁扮粍鐨勪竴浜涙柟娉曟椂锛屼娇鐢ㄨ嚜宸辩殑鏂规硶锛岀劧鍚庨€氱煡瑙嗗浘杩涜鏇存柊銆傛暟缁勪腑鐨勬瘡涓€椤归兘鍙兘鏄竴涓璞★紝鎵€浠ユ垜浼氳瀵熸暟缁勪腑鐨勬瘡涓€椤癸紙骞朵笖鍙兘瑙傚療鍒版暟缁勪腑鐨勫璞★紝宸茬粡瑙傚療鍒扮殑涓嶄細瑙傚療鍒帮級vue3:鏀圭敤proxy锛屽氨鍙互鐩存帴鐩戝惉瀵硅薄鏁扮粍鐨勫彉鍖栥€?/details>闂6锛氳璇碫ue鐨勪簨浠剁粦瀹氬師鐞嗙瓟锛氬師鐢烡OM鐨勭粦瀹氾細Vue鍦ㄥ垱寤虹湡瀹濪OM鏃朵細璋冪敤createElm锛岄粯璁よ皟鐢–reateHooks銆備細閬嶅巻褰撳墠骞冲彴涓嬬殑鐩稿叧灞炴€у鐞嗕唬鐮侊紝鍏朵腑鏈塽pdateDOMLListeners鏂规硶锛屽唴閮ㄤ細浼犲叆add()鏂规硶缁勪欢缁戝畾浜嬩欢銆佸師鐢熶簨浠躲€佽嚜瀹氫箟浜嬩欢锛涚粍浠剁粦瀹氭槸閫氳繃on鏂规硶瀹炵幇鐨刅ue涓殑鑷畾涔?銆傦紙鍙互鐞嗚В涓猴細缁勪欢鐨刵ativeOnOn鐩稿綋浜庢櫘閫氬厓绱爋n鐨刼n锛岀粍浠剁殑on浼氬崟鐙鐞嗭級闂7锛歷-model涓殑瀹炵幇鍘熺悊浠ュ強濡備綍鑷畾涔塿-model鉂楃瓟锛歷-model鍙互鐪嬪嚭Cheng鏄痸alue+inputmethod鐨勪竴涓娉曠硸锛坈omponent锛夈€傚師鐢熺殑v-model浼氭牴鎹笉鍚岀殑鏍囩鐢熸垚涓嶅悓鐨勪簨浠跺拰灞炴€с€傝В鏋愪竴涓寚浠ゅ埌銆傝嚜瀹氫箟锛氳嚜宸卞啓model灞炴€э紝鎶妏rop鍜宔vent鏀惧湪閲岄潰馃憤娌′簨~鐭ラ亾鍝嶅簲寮忔暟鎹拰鏁版嵁缁戝畾灏卞畬浜嬩簡锛屽啀闂覆鏌擄細闂鍏細Vue涓轰粈涔堣鐢ㄥ紓姝ユ覆鏌擄紵绛旓細Vue鏄粍浠剁骇鐨勬洿鏂般€傚鏋滀笉浣跨敤寮傛鏇存柊锛屽垯姣忔鏇存柊鏁版嵁鏃堕兘浼氶噸鏂版覆鏌撳綋鍓嶇粍浠躲€傚洜姝わ紝涓轰簡鎬ц兘锛孷ue浼氬湪鏈疆鏁版嵁鏇存柊鍚庡紓姝ユ洿鏂拌鍥俱€傛牳蹇冩€濇兂nextTick銆俤ep.notify()閫氱煡watcher鏇存柊锛宻ubs[i].update渚濇璋冪敤watcher鐨剈pdate锛宷ueueWatcher灏唚atcher鏀惧洖闃熷垪锛宯extTick(flushSchedulerQueue)鍦ㄤ笅涓€涓猼ick鍒锋柊watcher闃熷垪锛堝紓姝ワ級銆?/details>馃尭璺熻繘鍐嶉棶锛屽鏋滀綘鑳藉湪nextTick涓婅娓呮锛岄偅鍩烘湰灏辨槑鐧戒簡銆傞棶棰?锛氫綘浜嗚ВnextTick鍚楋紵绛旓細寮傛鏂规硶锛屽紓姝ユ覆鏌撶殑鏈€鍚庝竴姝ワ紝涓嶫S浜嬩欢寰幆瀵嗗垏鐩稿叧銆備富瑕佷娇鐢ㄥ畯浠诲姟鍜屽井浠诲姟锛坰etTimeout銆乸romises锛夛紝瀹氫箟涓€涓紓姝ユ柟娉曪紝澶氭璋冪敤nextTick灏嗘柟娉曞瓨鍏ラ槦鍒楋紝閫氳繃寮傛鏂规硶娓呯┖褰撳墠闃熷垪銆傚瀵瑰锛屾垜鍏堥棶浣犵敓鍛藉懆鏈燂紝鐒跺悗鎴戝啀鎯虫兂鎬庝箞闅惧€掍綘馃槃闂10锛氳璇碫ue鐨勭敓鍛藉懆鏈熷惂鉂楃瓟锛氫粈涔堟椂鍊欒皟鐢ㄧ殑锛焍eforeCreate锛氬疄渚嬪垵濮嬪寲鍚庯紝鏁版嵁瑙傚療鍓嶈皟鐢ㄣ€俢reated锛氬垱寤哄疄渚嬪悗璋冪敤銆傚疄渚嬪畬鎴愶細鏁版嵁瑙傚療锛屽睘鎬у拰鏂规硶鐨勬搷浣滐紝watch/event浜嬩欢鍥炶皟銆侼one$el.beforeMount锛氭寕杞藉墠璋冪敤锛岀涓€娆℃寕杞芥椂璋冪敤鐩稿叧render鍑芥暟锛氭浛鎹负鏂板垱寤虹殑vm.$el锛屾寕杞藉埌瀹炰緥涓婂悗璋冪敤hook銆俠eforeUpdate锛氬湪鏁版嵁鏇存柊鍓嶈皟鐢紝鍙戠敓鍦ㄨ櫄鎷烡OM閲嶆柊娓叉煋鎵撹ˉ涓佹椂锛屼箣鍚庝細璋冪敤changehook銆倁pdated锛氳櫄鎷烡OM鐢变簬鏁版嵁鍙樺寲鑰岃閲嶆柊娓叉煋鍜屾墦琛ヤ竵锛屼箣鍚庝細璋冪敤changehook銆俠eforeDestroy锛氬湪瀹炰緥閿€姣佷箣鍓嶈皟鐢紝瀹炰緥浠嶇劧鍙敤銆俤estroyed锛氬疄渚嬮攢姣佸悗璋冪敤銆傝皟鐢ㄥ悗锛孷ue瀹炰緥鎸囩ず鐨勬墍鏈夊唴瀹归兘灏嗚瑙ｉ櫎缁戝畾锛屾墍鏈変簨浠剁洃鍚櫒鍜屾墍鏈夊瓙瀹炰緥閮藉皢琚Щ闄ゃ€傛瘡涓敓鍛藉懆鏈熷唴鍙互鍋氫粈涔堬紵created锛氬疄渚嬪凡缁忓垱寤猴紝鍥犱负鏄渶鏃╄Е鍙戠殑锛屾墍浠ュ彲浠ヨ繘琛屼竴浜涙暟鎹拰璧勬簮鐨勮姹傘€俶ounted锛氬疄渚嬪凡缁忔寕杞斤紝鍙互杩涜涓€浜汥OM鎿嶄綔銆俠eforeUpdate锛氫綘鍙互鍦ㄨ繖涓挬瀛愪腑杩涗竴姝ユ敼鍙樼姸鎬佽€屼笉瑙﹀彂閲嶆柊娓叉煋銆倁pdated锛氬彲浠ユ墽琛屼緷璧栦簬DOM鐨勬搷浣滐紝浣嗚閬垮厤鏀瑰彉鐘舵€侊紝杩欏彲鑳戒細瀵艰嚧鏇存柊鐨勬棤闄愬惊鐜€俤estroyed锛氬彲浠ヨ繘琛屼竴浜涗紭鍖栨搷浣滐紝娓呴櫎瀹氭椂鍣紝瑙ｉ櫎缁戝畾浜嬩欢銆俛jax鏀惧湪鍝釜鐢熷懡鍛ㄦ湡锛燂細涓€鑸斁鍦╩ounted涓繚璇侀€昏緫缁熶竴锛屽洜涓虹敓鍛藉懆鏈熸槸鍚屾鎵ц鐨勶紝ajax鏄紓姝ユ墽琛岀殑銆傚崟涓€鏈嶅姟绔覆鏌搒sr涔熸斁鍦╟reated閲岄潰锛屽洜涓烘湇鍔＄娓叉煋涓嶆敮鎸乵ounted鏂规硶銆備粈涔堟椂鍊欎娇鐢╞eforeDestroy锛?褰撳墠椤甸潰浣跨敤浜?on锛岄渶瑕佽В缁戜簨浠躲€傛竻闄ゅ畾鏃跺櫒銆傚彇娑堢粦瀹氫簨浠讹紝婊氬姩mousemove銆?/details>闂11锛氱埗瀛愮粍浠剁敓鍛藉懆鏈熻皟鐢ㄩ『搴忥紙绠€鍗曪級绛旓細娓叉煋椤哄簭锛氬厛parent锛屽悗child锛屽畬鎴愰『搴忥細鍏坈hild锛屽啀parent鏇存柊椤哄簭锛歱arent鏇存柊瀵艰嚧child鏇存柊锛宲arent閿€姣侀『搴忓瓙鏇存柊瀹屾垚鍚庯細鍏堢埗浜诧紝鍐嶅効瀛愶紝瀹屾垚椤哄簭锛氬厛鍎垮瓙锛屽啀鐖朵翰绗崄浜岄锛歏ue缁勪欢閫氫俊鉂楃瓟锛氱埗瀛愰€氫俊锛氱埗浜叉彁渚涙暟鎹紝浼犻€掔粰鍎垮瓙閫氳繃灞炴€ч亾鍏凤紱鍎垮瓙閫氳繃$on缁戝畾鐖朵翰鐨勪簨浠讹紝鐒跺悗閫氳繃$emit瑙﹀彂鑷繁鐨勪簨浠讹紙鍙戝竷鍜岃闃咃級浣跨敤鐖跺瓙鍏崇郴$parent,$children鑾峰彇鐖跺瓙缁勪欢瀹炰緥銆傜埗缁勪欢鎻愪緵鏁版嵁锛屽瓙缁勪欢娉ㄥ叆銆俻rovide銆乮nject銆乸lug-ins鐢ㄧ殑姣旇緝澶氥€俽ef鑾峰彇缁勪欢瀹炰緥锛岃皟鐢ㄧ粍浠剁殑灞炴€у拰鏂规硶璺ㄧ粍浠堕€氫俊EventBus(Vue.prototype.
