{"id":154,"date":"2018-10-28T16:22:35","date_gmt":"2018-10-28T08:22:35","guid":{"rendered":"https:\/\/wp.winter-weng.cc\/work\/?p=154"},"modified":"2018-10-28T16:22:35","modified_gmt":"2018-10-28T08:22:35","slug":"js-%e5%95%8f%e9%a1%8c%e9%9b%86","status":"publish","type":"post","link":"https:\/\/wp.winter-weng.cc\/work\/?p=154","title":{"rendered":"[JS] javaScript \u7684\u91cd\u8981\u6982\u5ff5"},"content":{"rendered":"<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_75 counter-hierarchy ez-toc-counter ez-toc-grey ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">Table of Contents<\/p>\n<span class=\"ez-toc-title-toggle\"><a href=\"#\" class=\"ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle\" aria-label=\"\u986f\u793a\/\u96b1\u85cf\u5167\u5bb9\u76ee\u9304\"><span class=\"ez-toc-js-icon-con\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/wp.winter-weng.cc\/work\/?p=154\/#%E9%96%89%E5%8C%85_Closure_%E6%98%AF%E4%BB%80%E9%BA%BC%EF%BC%9F\" >\u9589\u5305 (Closure) \u662f\u4ec0\u9ebc\uff1f<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/wp.winter-weng.cc\/work\/?p=154\/#%E5%8E%9F%E5%9E%8B%E9%8D%8A_Prototype_chain%E6%98%AF%E4%BB%80%E9%BA%BC%EF%BC%9F\" >\u539f\u578b\u934a\u00a0(Prototype chain)\u662f\u4ec0\u9ebc\uff1f<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/wp.winter-weng.cc\/work\/?p=154\/#this_%E6%98%AF%E4%BB%80%E9%BA%BC%EF%BC%9F\" >this \u662f\u4ec0\u9ebc\uff1f<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/wp.winter-weng.cc\/work\/?p=154\/#bind_call_apply\" >bind(), call(), apply()<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/wp.winter-weng.cc\/work\/?p=154\/#Event_Loop\" >Event Loop<\/a><\/li><\/ul><\/nav><\/div>\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"%E9%96%89%E5%8C%85_Closure_%E6%98%AF%E4%BB%80%E9%BA%BC%EF%BC%9F\"><\/span>\u9589\u5305 (Closure) \u662f\u4ec0\u9ebc\uff1f<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n<p>\u9589\u5305\u662f\u51fd\u5f0f\u7684\u7d44\u5408\uff0c\u4e26\u6703\u5c07\u51fd\u5f0f\u5ba3\u544a\u6642\u53c3\u8003\u5230\u7684\u4f5c\u7528\u57df\u74b0\u5883\u8b8a\u6578\u4fdd\u5b58\u4e0b\u4f86\u3002\u5e38\u88ab\u4f7f\u7528\u5728 event-base \u7684\u60c5\u6cc1 (\u4f8b\u5982\u9ede\u64ca) \u548c\u975e\u540c\u6b65\u51fd\u5f0f\u4e2d\u3002<\/p>\n\n\n<p>\u81ea\u5df1\u9047\u904e\u7684\u60c5\u6cc1\u662f\uff0c\u524d\u516c\u53f8\u8ab2\u7a0b\u4e2d\u6709\u6587\u6cd5\u8aaa\u660e\uff0c\u6703\u4ee5\u97f3\u6a94\u642d\u914d\u52d5\u756b\u5448\u73fe\uff0c\u8cc7\u6599\u578b\u614b\u662f Array\uff0c\u5305\u542b\u6587\u6848\u548c\u986f\u793a\u6642\u9593\uff0c\u4f5c\u6cd5\u4f7f\u7528\u57fa\u672c\u7684 for \u8ff4\u5708\u5de1\u5217\uff0c\u4e26\u7b49\u5f85\u7d66\u5b9a\u7684\u79d2\u6578\u5f8c\u4f9d\u5e8f\u986f\u793a\u3002\u5f62\u6210\u4e86\u4e00\u500b for \u5305\u4f4f setTimeout \u7684\u72c0\u6cc1\uff0c\u5982\u679c\u6c92\u6709\u7528\u9589\u5305\u5c07\u72c0\u614b\u5b58\u8d77\u4f86\uff0c\u5c31\u6c92\u8fa6\u6cd5\u5448\u73fe\u6b63\u78ba\u7684\u7d50\u679c\u3002<\/p>\n\n\n<p>\u5ef6\u4f38\u95b1\u8b80\uff1a<br \/>1. <a href=\"https:\/\/developer.mozilla.org\/zh-TW\/docs\/Web\/JavaScript\/Closures\" target=\"_blank\" rel=\"noopener\">MDN \u9589\u5305<\/a><\/p>\n\n\n<hr class=\"wp-block-separator\" \/>\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"%E5%8E%9F%E5%9E%8B%E9%8D%8A_Prototype_chain%E6%98%AF%E4%BB%80%E9%BA%BC%EF%BC%9F\"><\/span>\u539f\u578b\u934a\u00a0(Prototype chain)\u662f\u4ec0\u9ebc\uff1f<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n<p>\u5728\u5275\u9020\u5be6\u9ad4\u3001\u8b8a\u6578\u6642\uff0cJS \u6703\u900f\u904e __proto__ \u5c07\u5be6\u9ad4\u9023\u7d50\u5230\u5b83\u7684\u539f\u578b (prototype)\uff0c\u7576\u4f7f\u7528\u4e00\u500b\u5be6\u9ad4\u627e\u4e0d\u5230\u7684\u65b9\u6cd5\u6216\u5c6c\u6027\u6642\uff0cJS \u6a5f\u5236\u6703\u900f\u904e __proto__ \u4e00\u5c64\u5c64\u5f80\u4e0a\u627e\uff0c\u9019\u6a23\u4e32\u8d77\u4f86\u7684\u904e\u7a0b\u5c31\u662f\u539f\u578b\u934a (Prototype chain)\uff0c\u4e26\u53ef\u4ee5\u900f\u904e\u6b64\u65b9\u5f0f\u5be6\u73fe\u7e7c\u627f\u7684\u6982\u5ff5\u3002<\/p>\n\n\n<p>\u81ea\u5df1\u7684\u7d93\u9a57\u662f\uff0c\u524d\u516c\u53f8\u7684\u5f71\u7247\u7247\u6e90\u9664\u4e86 Youtube \u4ee5\u5916\uff0c\u9084\u6709\u81ea\u88fd\u7684\u6559\u5b78\u5f71\u7247\uff0c\u5169\u8005\u6703\u63a1\u7528\u4e0d\u540c\u7684 API\uff0c\u4f46\u4ecd\u6709\u8a31\u591a\u5171\u901a\u7684\u65b9\u6cd5\uff0c\u4f8b\u5982\u64ad\u653e\u3001\u505c\u6b62\u3001\u986f\u793a\u4e2d\u82f1\u6587\u5b57\u5e55\u7b49\u3002\u6211\u4fbf\u5c07\u5171\u901a\u7684\u65b9\u6cd5\u5beb\u5728 player.prototype \u88e1\uff0c\u5be6\u4f5c\u6642\u518d\u6839\u64da\u4e0d\u540c\u7684\u7247\u6e90\u5c07\u5be6\u9ad4 new \u51fa\u3002<\/p>\n\n\n<hr class=\"wp-block-separator\" \/>\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"this_%E6%98%AF%E4%BB%80%E9%BA%BC%EF%BC%9F\"><\/span>this \u662f\u4ec0\u9ebc\uff1f<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n<p>\u6307\u5411\u8abf\u7528\u51fd\u5f0f\u7684\u7269\u4ef6\uff0c\u627e\u4e0d\u5230\u6642\u5c31\u6703\u6307\u5411\u5168\u57df\u5982 window\u3002<\/p>\n\n\n<hr class=\"wp-block-separator\" \/>\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"bind_call_apply\"><\/span>bind(), call(), apply()<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n<p>function.bind() \u53ef\u4ee5\u8b93 function \u4e2d\u7684 this \u6307\u5411\u6307\u5b9a\u7684\u7269\u4ef6\uff0c\u5982\u679c\u8981\u4f7f\u7528\u8981\u52a0\u62ec\u865f\u3002<\/p>\n\n\n<p>call \u548c apply \u96f7\u540c\uff0c\u9664\u7d81\u5b9a\u5916\u6703\u76f4\u63a5\u57f7\u884c\uff0c\u4f46 apply \u53c3\u6578\u662f\u5403 array\u3002<\/p>\n\n\n<pre class=\"wp-block-code\"><code>\u51fd\u5f0f.bind(\u7269\u4ef6)();\n\u51fd\u5f0f.call(\u7269\u4ef6, \u53c3\u65781, \u53c3\u65782);\n\u51fd\u5f0f.apply(\u7269\u4ef6, [\u53c3\u65781, \u53c3\u65782]);<\/code><\/pre>\n\n\n<p>\u5ef6\u4f38\u95b1\u8b80\uff1a<br \/>1.\u00a0<a href=\"https:\/\/pjchender.blogspot.com\/2016\/06\/function-borrowingfunction-currying.html\" target=\"_blank\" rel=\"noopener\">[\u7b46\u8a18] \u4e86\u89e3function borrowing\u548cfunction currying \u2500 bind(), call(), apply() \u7684\u61c9\u7528<\/a><\/p>\n\n\n<hr class=\"wp-block-separator\" \/>\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Event_Loop\"><\/span>Event Loop<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n<p>\u76e3\u63a7 Stack \u548c Task Queue\uff0c\u7576 Stack \u7a7a\u4e86\u6703\u628a Task Queue \u88e1\u9762\u7684\u4efb\u52d9\u62c9\u5230 Stack \u57f7\u884c\u3002\u7570\u6b65 (\u5982 setTimeout\u3001AJAX \u8acb\u6c42) \u6216\u6ed1\u9f20\u4e8b\u4ef6\u7684 Click Callback \u90fd\u6703\u653e\u5728 Queue \u4e2d\u3002<\/p>\n\n\n<p>\u5ef6\u4f38\u95b1\u8b80\uff1a<br \/>1.\u00a0<a href=\"https:\/\/pjchender.blogspot.com\/2017\/08\/javascript-learn-event-loop-stack-queue.html\" target=\"_blank\" rel=\"noopener\">[\u7b46\u8a18] \u7406\u89e3 JavaScript \u4e2d\u7684\u4e8b\u4ef6\u5faa\u74b0\u3001\u5806\u758a\u3001\u4f47\u5217\u548c\u4f75\u767c\u6a21\u5f0f<\/a><br \/>2.\u00a0<a href=\"http:\/\/www.ruanyifeng.com\/blog\/2014\/10\/event-loop.html\" target=\"_blank\" rel=\"noopener\">JavaScript \u904b\u884c\u6a5f\u5236\u8a73\u89e3\uff1a\u518d\u8ac7Event Loop<\/a><br \/><\/p>\n\n\n<hr class=\"wp-block-separator\" \/>\n\n\n<p>\u5f85\u7e8c&#8230; fetch(), promise, react, redux<\/p>\n","protected":false},"excerpt":{"rendered":"<p>\u9589\u5305 (Closure) \u662f\u4ec0\u9ebc\uff1f \u9589\u5305\u662f\u51fd\u5f0f\u7684\u7d44&hellip;<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"pgc_sgb_lightbox_settings":"","footnotes":""},"categories":[4],"tags":[21,34],"class_list":["post-154","post","type-post","status-publish","format-standard","hentry","category-javascript","tag-javascript","tag-34"],"_links":{"self":[{"href":"https:\/\/wp.winter-weng.cc\/work\/index.php?rest_route=\/wp\/v2\/posts\/154","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wp.winter-weng.cc\/work\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wp.winter-weng.cc\/work\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wp.winter-weng.cc\/work\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/wp.winter-weng.cc\/work\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=154"}],"version-history":[{"count":0,"href":"https:\/\/wp.winter-weng.cc\/work\/index.php?rest_route=\/wp\/v2\/posts\/154\/revisions"}],"wp:attachment":[{"href":"https:\/\/wp.winter-weng.cc\/work\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=154"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wp.winter-weng.cc\/work\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=154"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wp.winter-weng.cc\/work\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=154"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}