{"id":365088,"date":"2024-05-21T02:30:44","date_gmt":"2024-05-21T02:30:44","guid":{"rendered":"http:\/\/savepearlharbor.com\/?p=365088"},"modified":"-0001-11-30T00:00:00","modified_gmt":"-0001-11-29T21:00:00","slug":"","status":"publish","type":"post","link":"https:\/\/savepearlharbor.com\/?p=365088","title":{"rendered":"<span>\u0412\u0441\u0435 \u043f\u0440\u043e this \u0432 JavaScript<\/span>"},"content":{"rendered":"<div><!--[--><!--]--><\/div>\n<div id=\"post-content-body\">\n<div>\n<div class=\"article-formatted-body article-formatted-body article-formatted-body_version-2\">\n<div xmlns=\"http:\/\/www.w3.org\/1999\/xhtml\">\n<h2>\u041f\u0440\u0435\u0434\u0438\u0441\u043b\u043e\u0432\u0438\u0435<\/h2>\n<p>\u041c\u043d\u0435 \u0434\u0430\u0432\u043d\u043e \u0445\u043e\u0442\u0435\u043b\u043e\u0441\u044c \u0440\u0430\u0441\u0441\u0442\u0430\u0432\u0438\u0442\u044c \u0432\u0441\u0435 \u0442\u043e\u0447\u043a\u0438 \u043d\u0430\u0434 \u0432\u043e\u043f\u0440\u043e\u0441\u043e\u043c \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u044f <code>this<\/code>.<\/p>\n<p>\u0412 \u044d\u0442\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0435 \u044f \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043b \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044e \u0438\u0437 \u043e\u0442\u043a\u0440\u044b\u0442\u044b\u0445 \u0438\u0441\u0442\u043e\u0447\u043d\u0438\u043a\u043e\u0432.<\/p>\n<p>\u0411\u043e\u043b\u044c\u0448\u0430\u044f \u0447\u0430\u0441\u0442\u044c \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u0438 \u0432\u0437\u044f\u0442\u0430 \u0441 YouTube-\u043a\u0430\u043d\u0430\u043b\u0430 <a href=\"https:\/\/www.youtube.com\/@AsForJS\" rel=\"noopener noreferrer nofollow\"><strong>As For JS<\/strong><\/a>, \u0430 \u0442\u0430\u043a\u0436\u0435 \u0438\u0437 \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u0438 \u043d\u0430 <a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/JavaScript\/Reference\/Operators\/this\" rel=\"noopener noreferrer nofollow\"><strong>mdn<\/strong><\/a> \u0441 \u043c\u043e\u0438\u043c \u043f\u0435\u0440\u0435\u0432\u043e\u0434\u043e\u043c. \u042f \u043f\u043e\u0441\u0442\u0430\u0440\u0430\u043b\u0441\u044f \u043c\u0430\u043a\u0441\u0438\u043c\u0430\u043b\u044c\u043d\u043e \u043f\u0440\u043e\u0432\u0435\u0440\u0438\u0442\u044c \u043c\u0430\u0442\u0435\u0440\u0438\u0430\u043b.<\/p>\n<p>\u0423\u0432\u0430\u0436\u0430\u0435\u043c\u044b\u0435 \u0447\u0438\u0442\u0430\u0442\u0435\u043b\u0438, \u043c\u043e\u0436\u0435\u0442\u0435 \u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0442\u044c \u0441\u0432\u043e\u0438 \u0437\u0430\u043c\u0435\u0447\u0430\u043d\u0438\u044f \u0432 \u043a\u043e\u043c\u043c\u0435\u043d\u0442\u0430\u0440\u0438\u044f\u0445, \u0438 \u044f \u043f\u043e\u0441\u0442\u0430\u0440\u0430\u044e\u0441\u044c \u0438\u0441\u043f\u0440\u0430\u0432\u0438\u0442\u044c \u0438\u0445 \u0432 \u0441\u0442\u0430\u0442\u044c\u0435.<\/p>\n<h2>\u0412\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u0432 \u0442\u0435\u043c\u0443: &#171;\u041a\u0430\u043a \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0438\u0442\u044c this \u0432 JavaScript&#187;<\/h2>\n<p><code>this<\/code> &#8212; \u044d\u0442\u043e \u0432\u044b\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u044f\u0437\u044b\u043a\u0430 JavaScript, \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u043a\u043e\u0442\u043e\u0440\u043e\u0433\u043e \u043e\u0447\u0435\u043d\u044c \u043f\u043e\u0445\u043e\u0436\u0435 \u043d\u0430 \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u0438\u0434\u0435\u043d\u0442\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440\u0430, \u0441 \u0442\u043e\u0439 \u043b\u0438\u0448\u044c \u0440\u0430\u0437\u043d\u0438\u0446\u0435\u0439, \u0447\u0442\u043e \u0441\u0432\u044f\u0437\u0430\u0442\u044c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0441 <code>this<\/code>, \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u0442\u043e\u043b\u044c\u043a\u043e \u043e\u0441\u043e\u0431\u043e\u0439 \u0444\u043e\u0440\u043c\u043e\u0439 \u0432\u044b\u0437\u043e\u0432\u0430 <strong>normal function<\/strong>.<\/p>\n<p>\u0414\u043b\u044f \u043f\u043e\u043d\u0438\u043c\u0430\u043d\u0438\u044f \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0433\u043e<strong> <\/strong><code>this<\/code> \u0432\u0430\u0436\u043d\u043e \u0443\u0447\u0438\u0442\u044b\u0432\u0430\u0442\u044c \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442 \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u2014 \u043a\u043e\u0433\u0434\u0430 \u043e\u043d\u0430 \u0432\u044b\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f, \u043a\u0430\u043a\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c \u0438 \u0433\u0434\u0435! \u042d\u0442\u043e \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0444\u0443\u043d\u0434\u0430\u043c\u0435\u043d\u0442\u0430\u043b\u044c\u043d\u044b\u043c \u043f\u0440\u0430\u0432\u0438\u043b\u043e\u043c.<\/p>\n<p>\u041f\u043e\u0447\u0435\u043c\u0443 \u043c\u044b \u043e\u0442\u043d\u043e\u0441\u0438\u043c\u0441\u044f \u043a <code>this<\/code> \u043a\u0430\u043a \u043a \u0438\u0434\u0435\u043d\u0442\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440\u0443?<\/p>\n<p>\u041f\u043e\u0442\u043e\u043c\u0443 \u0447\u0442\u043e \u043a\u0430\u0436\u0434\u044b\u0439 \u0440\u0430\u0437, \u043a\u043e\u0433\u0434\u0430 \u043c\u044b \u043f\u044b\u0442\u0430\u0435\u043c\u0441\u044f \u0440\u0430\u0437\u043e\u0431\u0440\u0430\u0442\u044c\u0441\u044f, \u0441 \u0447\u0435\u043c \u0441\u0432\u044f\u0437\u0430\u043d <code>this<\/code>, \u044d\u0442\u043e, \u0432 \u0431\u043e\u043b\u044c\u0448\u0438\u043d\u0441\u0442\u0432\u0435 \u0441\u043b\u0443\u0447\u0430\u0435\u0432, \u0430\u043d\u0430\u043b\u043e\u0433\u0438\u0447\u043d\u043e \u043f\u043e\u0438\u0441\u043a\u0443 \u0438\u0434\u0435\u043d\u0442\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440\u0430 \u0432 \u043e\u0431\u043b\u0430\u0441\u0442\u044f\u0445 \u0432\u0438\u0434\u0438\u043c\u043e\u0441\u0442\u0438 (\u043f\u0440\u043e\u0445\u043e\u0434\u044f \u043f\u043e \u0446\u0435\u043f\u043e\u0447\u043a\u0430\u043c \u043e\u043a\u0440\u0443\u0436\u0435\u043d\u0438\u0439).<\/p>\n<p>\u0412 JavaScript \u043f\u0440\u0438\u043d\u0446\u0438\u043f\u044b \u0434\u043e\u0432\u043e\u043b\u044c\u043d\u043e \u043f\u0440\u043e\u0441\u0442\u044b: \u0443 \u043d\u0430\u0441 \u0435\u0441\u0442\u044c \u043a\u043e\u0434, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0432\u044b\u043f\u043e\u043b\u043d\u044f\u0435\u0442\u0441\u044f. \u0421\u0440\u0435\u0434\u0430, \u0433\u0434\u0435 \u044d\u0442\u043e\u0442 \u043a\u043e\u0434 \u0432\u044b\u043f\u043e\u043b\u043d\u044f\u0435\u0442\u0441\u044f, \u0438\u043c\u0435\u0435\u0442 \u0441\u0432\u043e\u0438 \u043f\u0440\u0430\u0432\u0438\u043b\u0430 \u0438 \u043d\u0430\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f <strong>Global Environment (\u0413\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u0430\u044f \u0441\u0440\u0435\u0434\u0430)<\/strong>. \u041a\u0430\u0436\u0434\u044b\u0439 \u0440\u0430\u0437, \u043a\u043e\u0433\u0434\u0430 \u0432\u044b\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u043d\u043e\u0432\u0430\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u044f, \u0441\u043e\u0437\u0434\u0430\u0435\u0442\u0441\u044f \u043d\u043e\u0432\u043e\u0435 \u043e\u043a\u0440\u0443\u0436\u0435\u043d\u0438\u0435. \u041f\u0440\u0438 \u043f\u043e\u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0445 \u0432\u044b\u0437\u043e\u0432\u0430\u0445 \u0441\u043e\u0437\u0434\u0430\u0435\u0442\u0441\u044f \u043d\u043e\u0432\u043e\u0435 \u043e\u043a\u0440\u0443\u0436\u0435\u043d\u0438\u0435. \u041e\u043a\u0440\u0443\u0436\u0435\u043d\u0438\u0435 \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442 \u0442\u043e\u043b\u044c\u043a\u043e \u0432 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u0435 \u043a\u043e\u0434\u0430, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0432 \u0434\u0430\u043d\u043d\u044b\u0439 \u043c\u043e\u043c\u0435\u043d\u0442 \u0432\u044b\u043f\u043e\u043b\u043d\u044f\u0435\u0442\u0441\u044f. \u0415\u0441\u043b\u0438 \u0432 \u043a\u043e\u0434\u0435 \u0432\u0441\u0442\u0440\u0435\u0447\u0430\u0435\u0442\u0441\u044f \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u0435 \u0444\u0443\u043d\u043a\u0446\u0438\u0438, \u0432\u043e\u043a\u0440\u0443\u0433 \u044d\u0442\u043e\u0439 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u0441\u043e\u0437\u0434\u0430\u0435\u0442\u0441\u044f \u0441\u0432\u043e\u0435 \u0441\u043e\u0431\u0441\u0442\u0432\u0435\u043d\u043d\u043e\u0435 \u043e\u043a\u0440\u0443\u0436\u0435\u043d\u0438\u0435. \u0412 \u043e\u043a\u0440\u0443\u0436\u0435\u043d\u0438\u0438 \u0445\u0440\u0430\u043d\u0438\u0442\u0441\u044f \u0432\u0441\u044f \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u0430\u044f \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044f \u0434\u043b\u044f \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f \u0434\u0430\u043d\u043d\u043e\u0433\u043e \u043a\u043e\u0434\u0430.<\/p>\n<p>\u041f\u043e\u044d\u0442\u043e\u043c\u0443 \u0434\u0430\u0432\u0430\u0439\u0442\u0435 \u043d\u0430\u0447\u043d\u0435\u043c \u0441 \u0432\u043e\u043f\u0440\u043e\u0441\u0430: \u0441 \u0447\u0435\u043c \u0441\u0432\u044f\u0437\u0430\u043d <code>this<\/code>, \u043a\u043e\u0433\u0434\u0430 \u043e\u043d \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u0441\u044f \u0432\u043d\u0443\u0442\u0440\u0438 \u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u043e\u0439 \u0441\u0440\u0435\u0434\u044b \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f?<\/p>\n<hr\/>\n<h3>\u0413\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u044b\u0439 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442<\/h3>\n<p>\u0424\u0443\u043d\u043a\u0446\u0438\u044f \u0438\u043c\u0435\u0435\u0442 \u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u044b\u0439 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442, \u043a\u043e\u0433\u0434\u0430 \u043e\u043d\u0430 \u0432\u044b\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u0432\u043d\u0435 \u043a\u0430\u043a\u0438\u0445-\u043b\u0438\u0431\u043e \u0444\u0443\u043d\u043a\u0446\u0438\u0439 \u0438\u043b\u0438 \u043a\u043b\u0430\u0441\u0441\u043e\u0432. \u041f\u0440\u0438 \u044d\u0442\u043e\u043c \u043e\u043d\u0430 \u043c\u043e\u0436\u0435\u0442 \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u044c\u0441\u044f \u0432\u043d\u0443\u0442\u0440\u0438\u00a0<a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/JavaScript\/Reference\/Statements\/block\" rel=\"noopener noreferrer nofollow\"><strong>\u0431\u043b\u043e\u043a\u043e\u0432<\/strong><\/a>\u00a0\u0438\u043b\u0438\u00a0<a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/JavaScript\/Reference\/Operators\/this#arrow_functions\" rel=\"noopener noreferrer nofollow\"><strong>\u0441\u0442\u0440\u0435\u043b\u043e\u0447\u043d\u044b\u0445 \u0444\u0443\u043d\u043a\u0446\u0438\u0439<\/strong><\/a> \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u043d\u044b\u0445 \u0432 \u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u043e\u0439 \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u0432\u0438\u0434\u0438\u043c\u043e\u0441\u0442\u0438).<\/p>\n<p>\u0417\u043d\u0430\u0447\u0435\u043d\u0438\u0435\u00a0<code>this<\/code>\u00a0\u0437\u0430\u0432\u0438\u0441\u0438\u0442 \u043e\u0442 \u0442\u043e\u0433\u043e, \u0432 \u043a\u0430\u043a\u043e\u043c \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u0435 \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f \u0432\u044b\u043f\u043e\u043b\u043d\u044f\u0435\u0442\u0441\u044f \u0441\u043a\u0440\u0438\u043f\u0442.<\/p>\n<p>\u041a\u0430\u043a \u0438\u00a0<strong>callback<\/strong>, \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435\u00a0<code>this<\/code>\u00a0\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442\u0441\u044f \u0441\u0440\u0435\u0434\u043e\u0439 \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f (\u0432\u044b\u0437\u044b\u0432\u0430\u044e\u0449\u0438\u043c \u043e\u0431\u044a\u0435\u043a\u0442\u043e\u043c).<\/p>\n<p>\u041d\u0430 \u0432\u0435\u0440\u0445\u043d\u0435\u043c \u0443\u0440\u043e\u0432\u043d\u0435 \u0441\u043a\u0440\u0438\u043f\u0442\u0430,\u00a0<code>this<\/code>\u00a0\u043e\u0442\u043d\u043e\u0441\u0438\u0442\u0441\u044f \u043a\u00a0<code>globalThis<\/code>\u00a0\u043d\u0435\u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e \u043e\u0442 \u0442\u043e\u0433\u043e, \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u0441\u044f \u043b\u0438 \u043e\u043d \u0432 \u0441\u0442\u0440\u043e\u0433\u043e\u043c \u0440\u0435\u0436\u0438\u043c\u0435 \u0438\u043b\u0438 \u043d\u0435\u0442.<\/p>\n<blockquote>\n<p><code>globalThis<\/code> \u044d\u0442\u043e \u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u043e\u0435 \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u043e \u0441\u043e\u0434\u0435\u0440\u0436\u0430\u0449\u0435\u0435\u00a0\u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u043e\u0435\u00a0<code>this<\/code>\u00a0\u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435, \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u043e\u0431\u044b\u0447\u043d\u043e \u0430\u043d\u0430\u043b\u043e\u0433\u0438\u0447\u043d\u043e\u00a0\u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u043e\u043c\u0443 \u043e\u0431\u044a\u0435\u043a\u0442\u0443.<\/p>\n<\/blockquote>\n<p><strong>\u041f\u0440\u0438\u043c\u0435\u0440:<\/strong><\/p>\n<p>\u0412 \u0441\u043b\u0443\u0447\u0430\u0435 \u0437\u0430\u043f\u0443\u0441\u043a\u0430 \u0432 \u0441\u0440\u0435\u0434\u0435 Node JS \u0432 \u043d\u0435 \u0441\u0442\u0440\u043e\u0433\u043e\u043c \u0440\u0435\u0436\u0438\u043c\u0435 <code>globalThis<\/code> \u0431\u0443\u0434\u0435\u0442 \u043e\u0431\u044a\u0435\u043a\u0442 <code>global<\/code>:<\/p>\n<pre><code class=\"javascript\">\/* &lt;ref *1> Object [global] {   global: [Circular *1],   clearInterval: [Function: clearInterval],   clearTimeout: [Function: clearTimeout],   setInterval: [Function: setInterval],   setTimeout: [Function: setTimeout] {     [Symbol(nodejs.util.promisify.custom)]: [Getter]   },   queueMicrotask: [Function: queueMicrotask],   clearImmediate: [Function: clearImmediate],   setImmediate: [Function: setImmediate] {     [Symbol(nodejs.util.promisify.custom)]: [Getter]   } } *\/<\/code><\/pre>\n<p>\u0412 \u0441\u043b\u0443\u0447\u0430\u0435 \u0437\u0430\u043f\u0443\u0441\u043a\u0430 \u043a\u043e\u0434\u0430 \u0432 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0435  \u0432 \u043d\u0435 \u0441\u0442\u0440\u043e\u0433\u043e\u043c \u0440\u0435\u0436\u0438\u043c\u0435 <code>globalThis<\/code> \u0431\u0443\u0434\u0435\u0442 <code>window<\/code>:<\/p>\n<pre><code class=\"javascript\">\/\/ [object Window]<\/code><\/pre>\n<p>\u0415\u0441\u043b\u0438 \u0438\u0441\u0445\u043e\u0434\u043d\u044b\u0439 \u043a\u043e\u0434 \u0437\u0430\u0433\u0440\u0443\u0436\u0435\u043d \u043a\u0430\u043a\u00a0<a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/JavaScript\/Guide\/Modules\" rel=\"noopener noreferrer nofollow\"><strong>\u043c\u043e\u0434\u0443\u043b\u044c<\/strong><\/a>, \u0442\u043e\u00a0<code>this<\/code>\u00a0\u0432\u0441\u0435\u0433\u0434\u0430 \u0431\u0443\u0434\u0435\u0442\u00a0<code>undefined<\/code> \u043d\u0430 \u0432\u0435\u0440\u0445\u043d\u0435\u043c \u0443\u0440\u043e\u0432\u043d\u0435:<\/p>\n<pre><code class=\"xml\">&lt;script src=\"index3.js\" type=\"module\">&lt;\/script><\/code><\/pre>\n<pre><code class=\"javascript\">console.log(this) \/\/ undefined<\/code><\/pre>\n<hr\/>\n<h3>\u0411\u0430\u0437\u043e\u0432\u044b\u0439 \u043f\u0440\u0438\u043c\u0435\u0440 \u0432\u043d\u0443\u0442\u0440\u0438 \u0444\u0443\u043d\u043a\u0446\u0438\u0438.<\/h3>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w780q1\/getpro\/habr\/upload_files\/e96\/0d7\/578\/e960d7578c1787f6c8aaba73eb6d46ba.jpg\" width=\"1829\" height=\"2186\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/e96\/0d7\/578\/e960d7578c1787f6c8aaba73eb6d46ba.jpg\" data-blurred=\"true\"\/><\/figure>\n<p>\u0420\u0430\u0441\u0441\u043c\u0430\u0442\u0440\u0438\u0432\u0430\u0435\u043c \u0441\u0430\u043c\u044b\u0439 \u043f\u0440\u043e\u0441\u0442\u043e\u0439 \u0438 \u0431\u0430\u0437\u043e\u0432\u044b\u0439 \u043f\u0440\u0438\u043c\u0435\u0440:<\/p>\n<pre><code class=\"javascript\">\"use strict\" console.log(\"this is\", this) \/\/ this is {}<\/code><\/pre>\n<p>\u041c\u044b \u043d\u0430\u0445\u043e\u0434\u0438\u043c\u0441\u044f \u0432 \u0441\u0442\u0440\u043e\u0433\u043e\u043c \u0440\u0435\u0436\u0438\u043c\u0435 (<code>\"use strict\"<\/code>).<\/p>\n<p>\u041c\u044b \u0445\u043e\u0442\u0438\u043c \u043f\u043e\u043d\u044f\u0442\u044c \u0441 \u0447\u0435\u043c \u0441\u0432\u044f\u0437\u0430\u043d <code>this<\/code>. \u0410\u043b\u0433\u043e\u0440\u0438\u0442\u043c \u0441 \u0442\u043e\u0447\u043a\u0438 \u0437\u0440\u0435\u043d\u0438\u044f \u0441\u043f\u0435\u0446\u0438\u0444\u0438\u043a\u0430\u0446\u0438\u0438 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0439:<\/p>\n<p>\u041c\u044b \u043d\u0430\u0445\u043e\u0434\u0438\u043c\u0441\u044f \u0432\u043d\u0443\u0442\u0440\u0438 \u0444\u0443\u043d\u043a\u0446\u0438\u0438?<\/p>\n<p>\u21d2 \u041d\u0435\u0442.<\/p>\n<p>\u21d2 \u041f\u0435\u0440\u0435\u0445\u043e\u0434\u0438\u043c \u043a \u043d\u043e\u0432\u043e\u0439 \u0432\u0435\u0442\u043a\u0435 \u043d\u0430 \u043d\u0430\u0448\u0435\u0439 \u0441\u0445\u0435\u043c\u0435 &#8212; \u201c\u041c\u044b \u0432\u043d\u0443\u0442\u0440\u0438 \u0441\u043a\u0440\u0438\u043f\u0442\u0430 \u0438\u043b\u0438 \u0432\u043d\u0443\u0442\u0440\u0438 \u043c\u043e\u0434\u0443\u043b\u044f?\u201d<\/p>\n<hr\/>\n<h3>Script \u0438\u043b\u0438 Module<\/h3>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w780q1\/getpro\/habr\/upload_files\/514\/d3d\/2d7\/514d3d2d7372d0f52dd58a4bec3d3dfb.jpg\" width=\"2016\" height=\"1984\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/514\/d3d\/2d7\/514d3d2d7372d0f52dd58a4bec3d3dfb.jpg\" data-blurred=\"true\"\/><\/figure>\n<p><strong>\u042f \u0441\u0440\u0430\u0437\u0443 \u043e\u0442\u043c\u0435\u0447\u0443, \u0447\u0442\u043e \u043d\u0430 \u0441\u0445\u0435\u043c\u0430\u0445 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u044f <\/strong><code>this<\/code><strong> \u0443\u043a\u0430\u0437\u0430\u043d\u043e \u043e\u0442\u043d\u043e\u0441\u0438\u0442\u0435\u043b\u044c\u043d\u043e strict mode \u0438 \u043d\u0435 \u0443\u0447\u0438\u0442\u044b\u0432\u0430\u0435\u0442  \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 <\/strong><code>this<\/code><strong> \u0432\u043d\u0435\u0448\u043d\u0438\u043c  API.<\/strong><\/p>\n<p><strong>Script<\/strong> \u0438 <strong>Module<\/strong> \u044d\u0442\u043e \u0434\u0432\u0430 \u0442\u0435\u0440\u043c\u0438\u043d\u0430, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043e\u043f\u0438\u0441\u044b\u0432\u0430\u044e\u0442 \u0440\u0430\u0437\u043d\u044b\u0435 \u0441\u043f\u043e\u0441\u043e\u0431\u044b \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f \u043a\u043e\u0434\u0430.<\/p>\n<p><strong>Script<\/strong> &#8212; \u043a\u043e\u0434, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0437\u0430\u043f\u0443\u0441\u043a\u0430\u0435\u0442\u0441\u044f \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e.<\/p>\n<p><strong>Module<\/strong> &#8212; \u0437\u0430\u043f\u0443\u0441\u043a \u043a\u043e\u0434\u0430 \u0441 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u043e\u043c <code>module<\/code>. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440 \u043a\u043e\u0433\u0434\u0430 \u043c\u044b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c <code>import<\/code>.<\/p>\n<p>\u21d2 \u0417\u0430\u0434\u0430\u0435\u043c \u0441\u0435\u0431\u0435 \u0432\u043e\u043f\u0440\u043e\u0441: \u201c\u042f \u0432\u043d\u0443\u0442\u0440\u0438 \u043c\u043e\u0434\u0443\u043b\u044f\u201d?<\/p>\n<ul>\n<li>\n<p>\u0414\u0430<\/p>\n<p>\u21d2 \u0422\u043e\u0433\u0434\u0430 <code>this<\/code> \u0440\u0430\u0432\u0435\u043d <code>undefined<\/code>. \u0414\u0440\u0443\u0433\u0438\u0445 \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u043e\u0432 \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u043e\u0432\u0430\u0442\u044c \u043d\u0435 \u043c\u043e\u0436\u0435\u0442.<\/p>\n<\/li>\n<li>\n<p>\u041d\u0435\u0442<\/p>\n<p>\u21d2 <code>this<\/code> \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e \u0441\u0432\u044f\u0437\u0430\u043d \u0441 <strong>global object<\/strong>.<\/p>\n<ul>\n<li>\n<p>\u0421\u043e\u0433\u043b\u0430\u0441\u043d\u043e \u0441\u043f\u0435\u0446\u0438\u0444\u0438\u043a\u0430\u0446\u0438\u0438 <strong>Host-\u0441\u0440\u0435\u0434\u0430<\/strong> (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440 \u0431\u0440\u0430\u0443\u0437\u0435\u0440, Node) \u0438\u043c\u0435\u0435\u0442 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e \u0438\u0437\u043c\u0435\u043d\u0438\u0442\u044c \u0442\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 <code>this<\/code>, \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u0431\u044b\u043b\u043e \u0441\u0432\u044f\u0437\u0430\u043d\u043e \u0441 \u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u044b\u043c \u043e\u0431\u044a\u0435\u043a\u0442\u043e\u043c.<\/p>\n<p>\u041f\u043e\u044d\u0442\u043e\u043c\u0443 \u043c\u044b \u0437\u0430\u0434\u0430\u0435\u043c \u0432\u043e\u043f\u0440\u043e\u0441: \u201c<strong>\u041d\u043est<\/strong> \u0438\u0437\u043c\u0435\u043d\u044f\u0435\u0442 <code>this<\/code>?\u201d<\/p>\n<ul>\n<li>\n<p>\u041d\u0435\u0442<\/p>\n<p>\u21d2 \u0422\u043e\u0433\u0434\u0430  <code>this<\/code> \u0440\u0430\u0432\u0435\u043d <code>undefined<\/code><\/p>\n<\/li>\n<li>\n<p>\u0414\u0430<\/p>\n<p>\u21d2 <code>this<\/code> \u0440\u0430\u0432\u0435\u043d \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044e, \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u043b <strong>Host<\/strong><\/p>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<hr\/>\n<h3>Function Environment<\/h3>\n<p>\u041c\u044b \u0438\u0437\u0443\u0447\u0438\u043b\u0438 \u0432\u0435\u0442\u043a\u0443 <strong>Script \u0438\u043b\u0438 Module<\/strong> \u0438 \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u0438\u043c \u0432 \u0432\u0435\u0442\u043a\u0443 <strong>Function Environment.<\/strong><\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w780q1\/getpro\/habr\/upload_files\/ef0\/cd9\/a5e\/ef0cd9a5e29ac0b0bc3ec9d6158de587.jpg\" width=\"2242\" height=\"1783\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/ef0\/cd9\/a5e\/ef0cd9a5e29ac0b0bc3ec9d6158de587.jpg\" data-blurred=\"true\"\/><\/figure>\n<p>\u041f\u043e\u0434 \u0441\u043b\u043e\u0432\u0430\u043c\u0438 \u201c\u043d\u043e\u0440\u043c\u0430\u043b\u044c\u043d\u0430\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u044f\u201d (<strong>normal function<\/strong>) \u043c\u044b \u0431\u0443\u0434\u0435\u0442 \u0438\u043c\u0435\u0442\u044c \u0432\u0432\u0438\u0434\u0443 \u043b\u044e\u0431\u0443\u044e \u0444\u0443\u043d\u043a\u0446\u0438\u044e, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043d\u0435 \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f <a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/JavaScript\/Reference\/Functions\/Arrow_functions\" rel=\"noopener noreferrer nofollow\"><strong>arrow function<\/strong><\/a> (\u0441\u0442\u0440\u0435\u043b\u043e\u0447\u043d\u043e\u0439 \u0444\u0443\u043d\u043a\u0446\u0438\u0435\u0439). \u0422\u043e \u0435\u0441\u0442\u044c \u044d\u0442\u043e \u0432\u0441\u0435 \u0444\u0443\u043d\u043a\u0446\u0438\u0438, \u0443 \u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u043c\u0435\u0436\u0434\u0443 \u0430\u0440\u0433\u0443\u043c\u0435\u043d\u0442\u0430\u043c\u0438 \u0438 \u0438\u0445 \u0442\u0435\u043b\u043e\u043c \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u043e\u0442\u0441\u0443\u0442\u0441\u0442\u0432\u0443\u0435\u0442 \u0441\u0438\u043c\u0432\u043e\u043b\u044c\u043d\u0430\u044f \u043f\u0430\u0440\u0430 <code>=><\/code>.<\/p>\n<p>\u041c\u044b \u043f\u043e\u043c\u043d\u0438\u043c, \u0447\u0442\u043e \u043d\u0430\u0448 \u043e\u0441\u043d\u043e\u0432\u043d\u043e\u0439 \u0432\u043e\u043f\u0440\u043e\u0441 \u044d\u0442\u043e: \u201c\u042f \u0432 \u043a\u043e\u0434\u0435 \u0444\u0443\u043d\u043a\u0446\u0438\u0438?\u201d.<\/p>\n<p>\u041d\u0430\u043f\u0438\u0448\u0435\u043c \u043f\u0440\u0438\u043c\u0435\u0440 \u0432 \u043a\u043e\u0442\u043e\u0440\u043e\u043c <code>this<\/code> \u0431\u0443\u0434\u0435\u0442 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0442\u044c\u0441\u044f \u0432\u043d\u0443\u0442\u0440\u0438 \u0444\u0443\u043d\u043a\u0446\u0438\u0438.<\/p>\n<pre><code class=\"javascript\">\"use strict\"  function doLogThis() {   let doArrowThing = () => console.log(\"this is\", this)   doArrowThing() }  doLogThis() \/\/ this is undefined<\/code><\/pre>\n<p>\u0412 \u044d\u0442\u043e\u043c \u043a\u043e\u0434\u0435 \u0432\u044b\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f <code>doLogThis<\/code>. \u0412\u043d\u0443\u0442\u0440\u0438 <code>doLogThis<\/code> \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0438\u043b\u0430\u0441\u044c \u0441\u0442\u0440\u0435\u043b\u043e\u0447\u043d\u0430\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u044f <code>doArrowThing<\/code> \u0438 \u043f\u043e\u0442\u043e\u043c \u043e\u043d\u0430 \u0431\u044b\u043b\u0430 \u0432\u044b\u0437\u0432\u0430\u043d\u0430.<\/p>\n<p>\u0410\u043b\u0433\u043e\u0440\u0438\u0442\u043c \u0431\u0443\u0434\u0435\u0442 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0439:<\/p>\n<ul>\n<li>\n<p>\u041c\u044b \u043d\u0430\u0445\u043e\u0434\u0438\u043c\u0441\u044f \u0432\u043d\u0443\u0442\u0440\u0438 \u043d\u043e\u0440\u043c\u0430\u043b\u044c\u043d\u043e\u0439 \u0444\u0443\u043d\u043a\u0446\u0438\u0438? <\/p>\n<ul>\n<li>\n<p>\u041d\u0435\u0442!<\/p>\n<p>\u041c\u044b \u043d\u0430\u0445\u043e\u0434\u0438\u043c\u0441\u044f \u0432\u043d\u0443\u0442\u0440\u0438 \u0441\u0442\u0440\u0435\u043b\u043e\u0447\u043d\u043e\u0439 \u0444\u0443\u043d\u043a\u0446\u0438\u0438.<\/p>\n<p>\u21d2 \u041f\u0435\u0440\u0435\u0445\u043e\u0434\u0438\u043c \u043a \u0432\u0435\u0442\u043a\u0435 \u0434\u043b\u044f \u0441\u0442\u0440\u0435\u043b\u043e\u0447\u043d\u043e\u0439 \u0444\u0443\u043d\u043a\u0446\u0438\u0438<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<hr\/>\n<h3>Arrow function<\/h3>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w780q1\/getpro\/habr\/upload_files\/830\/7f5\/49b\/8307f549bc4a41a8406509c7ecdce43c.jpg\" width=\"2242\" height=\"1783\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/830\/7f5\/49b\/8307f549bc4a41a8406509c7ecdce43c.jpg\" data-blurred=\"true\"\/><\/figure>\n<p>\u0412 \u0441\u0442\u0440\u0435\u043b\u043e\u0447\u043d\u044b\u0445 \u0444\u0443\u043d\u043a\u0446\u0438\u044f\u0445 <code>this<\/code> \u043f\u0440\u0438\u0432\u044f\u0437\u0430\u043d \u043a \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u0443, \u0432 \u043a\u043e\u0442\u043e\u0440\u043e\u043c \u043e\u043d\u0438 \u0431\u044b\u043b\u0438 \u0441\u043e\u0437\u0434\u0430\u043d\u044b, \u0438 \u043d\u0435 \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u0438\u0437\u043c\u0435\u043d\u0435\u043d. \u041e\u043d\u0438 \u043d\u0435 \u0438\u043c\u0435\u044e\u0442 \u0441\u0432\u043e\u0435\u0433\u043e \u0441\u043e\u0431\u0441\u0442\u0432\u0435\u043d\u043d\u043e\u0433\u043e <code>this<\/code>, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u043e\u043d\u0438 \u0431\u0435\u0440\u0443\u0442 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 <code>this<\/code> \u0438\u0437 \u043e\u043a\u0440\u0443\u0436\u0430\u044e\u0449\u0435\u0433\u043e \u043a\u043e\u0434\u0430.<\/p>\n<p>\u0414\u0440\u0443\u0433\u0438\u043c\u0438 \u0441\u043b\u043e\u0432\u0430\u043c\u0438, \u043f\u0440\u0438 \u043e\u0446\u0435\u043d\u043a\u0435 \u0442\u0435\u043b\u0430 \u0441\u0442\u0440\u0435\u043b\u043e\u0447\u043d\u043e\u0439 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u044f\u0437\u044b\u043a \u043d\u0435 \u0441\u043e\u0437\u0434\u0430\u0435\u0442 \u043d\u043e\u0432\u0443\u044e\u00a0<code>this<\/code>\u00a0\u043f\u0440\u0438\u0432\u044f\u0437\u043a\u0443.<\/p>\n<p>\u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0432 \u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u043e\u043c \u043a\u043e\u0434\u0435 (\u043d\u0435 \u0432 \u0441\u0442\u0440\u043e\u0433\u043e\u043c \u0440\u0435\u0436\u0438\u043c\u0435),\u00a0<code>this<\/code>\u00a0\u0432\u0441\u0435\u0433\u0434\u0430\u00a0<code>globalThis<\/code>\u00a0\u043d\u0435\u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e \u043e\u0442 \u0441\u0442\u0440\u043e\u0433\u043e\u0441\u0442\u0438, \u0438\u0437-\u0437\u0430 \u043f\u0440\u0438\u0432\u044f\u0437\u043a\u0438 \u043a\u00a0\u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u043e\u043c\u0443 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u0443:<\/p>\n<pre><code class=\"javascript\">const globalObject = this; const foo = () => this;  console.log(foo() === globalObject); \/\/ true<\/code><\/pre>\n<p>\u0421\u0442\u0440\u0435\u043b\u043e\u0447\u043d\u044b\u0435 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u0441\u043e\u0437\u0434\u0430\u044e\u0442\u00a0\u0437\u0430\u043c\u044b\u043a\u0430\u043d\u0438\u0435\u00a0\u043d\u0430\u00a0<code>this<\/code> \u043e\u043a\u0440\u0443\u0436\u0430\u044e\u0449\u0435\u0439 \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u0432\u0438\u0434\u0438\u043c\u043e\u0441\u0442\u0438, \u0447\u0442\u043e \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442, \u0447\u0442\u043e \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u0441\u043e \u0441\u0442\u0440\u0435\u043b\u043a\u0430\u043c\u0438 \u0432\u0435\u0434\u0443\u0442 \u0441\u0435\u0431\u044f \u0442\u0430\u043a, \u043a\u0430\u043a \u0431\u0443\u0434\u0442\u043e \u043e\u043d\u0438 &#171;\u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u043f\u0440\u0438\u0432\u044f\u0437\u0430\u043d\u044b&#187; &#8212; \u043d\u0435\u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e \u043e\u0442 \u0442\u043e\u0433\u043e, \u043a\u0430\u043a \u043e\u043d\u0438 \u0432\u044b\u0437\u044b\u0432\u0430\u044e\u0442\u0441\u044f,\u00a0<code>this<\/code>\u00a0\u043f\u0440\u0438\u0432\u044f\u0437\u0430\u043d\u044b \u043a \u0442\u043e\u043c\u0443, \u0447\u0442\u043e \u0431\u044b\u043b\u043e \u043f\u0440\u0438 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u0438 \u0444\u0443\u043d\u043a\u0446\u0438\u0438.\u00a0\u0422\u043e \u0436\u0435 \u0441\u0430\u043c\u043e\u0435 \u043e\u0442\u043d\u043e\u0441\u0438\u0442\u0441\u044f \u0438 \u043a \u0441\u0442\u0440\u0435\u043b\u043e\u0447\u043d\u044b\u043c \u0444\u0443\u043d\u043a\u0446\u0438\u044f\u043c, \u0441\u043e\u0437\u0434\u0430\u043d\u043d\u044b\u043c \u0432\u043d\u0443\u0442\u0440\u0438 \u0434\u0440\u0443\u0433\u0438\u0445 \u0444\u0443\u043d\u043a\u0446\u0438\u0439.<\/p>\n<p>\u0411\u043e\u043b\u0435\u0435 \u0442\u043e\u0433\u043e, \u043f\u0440\u0438 \u0432\u044b\u0437\u043e\u0432\u0435 \u0441\u0442\u0440\u0435\u043b\u043e\u0447\u043d\u044b\u0445 \u0444\u0443\u043d\u043a\u0446\u0438\u0439 \u0441 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435\u043c\u00a0<code>call()<\/code>,\u00a0<code>bind()<\/code>\u00a0\u0438\u043b\u0438\u00a0<code>apply()<\/code>, \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u00a0<code>thisArg<\/code>\u00a0\u0438\u0433\u043d\u043e\u0440\u0438\u0440\u0443\u0435\u0442\u0441\u044f.\u00a0\u041e\u0434\u043d\u0430\u043a\u043e \u0432\u044b \u0432\u0441\u0435 \u0440\u0430\u0432\u043d\u043e \u043c\u043e\u0436\u0435\u0442\u0435 \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0442\u044c \u0434\u0440\u0443\u0433\u0438\u0435 \u0430\u0440\u0433\u0443\u043c\u0435\u043d\u0442\u044b, \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044f \u044d\u0442\u0438 \u043c\u0435\u0442\u043e\u0434\u044b.<\/p>\n<pre><code class=\"javascript\">const globalObject = this; const foo = () => this; const obj = { name: \"obj\" };  console.log(foo.call(obj) === globalObject); \/\/ true  const boundFoo = foo.bind(obj); console.log(boundFoo() === globalObject); \/\/ true<\/code><\/pre>\n<p>\u041f\u0440\u0438 \u043f\u043e\u0438\u0441\u043a\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f <code>this<\/code> \u043c\u044b \u0432\u0441\u0435\u0433\u0434\u0430 \u0438\u0433\u043d\u043e\u0440\u0438\u0440\u0443\u0435\u043c \u0441\u0442\u0440\u0435\u043b\u043e\u0447\u043d\u0443\u044e \u0444\u0443\u043d\u043a\u0446\u0438\u044e \u0438 \u0441\u0440\u0430\u0437\u0443 \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u0438\u043c \u043a \u0435\u0451 \u0440\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u043c\u0443 \u043e\u043a\u0440\u0443\u0436\u0435\u043d\u0438\u044e.<\/p>\n<hr\/>\n<h3>\u0412\u044b\u0437\u043e\u0432 \u043d\u043e\u0440\u043c\u0430\u043b\u044c\u043d\u043e\u0439 \u0444\u0443\u043d\u043a\u0446\u0438\u0438<\/h3>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w780q1\/getpro\/habr\/upload_files\/ba7\/143\/5bd\/ba71435bd0a450d2744e53545e5443b5.jpg\" width=\"2242\" height=\"1783\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/ba7\/143\/5bd\/ba71435bd0a450d2744e53545e5443b5.jpg\" data-blurred=\"true\"\/><\/figure>\n<p>\u041f\u0440\u0430\u0432\u0438\u043b\u043e, \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u043d\u0443\u0436\u043d\u043e \u0437\u0430\u043f\u043e\u043c\u043d\u0438\u0442\u044c. \u0412 \u043c\u043e\u043c\u0435\u043d\u0442 \u0432\u044b\u0437\u043e\u0432\u0430 \u043b\u044e\u0431\u043e\u0439 \u043d\u043e\u0440\u043c\u0430\u043b\u044c\u043d\u043e\u0439 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 (\u043d\u0435 \u0441\u0442\u0440\u0435\u043b\u043e\u0447\u043d\u043e\u0439) \u0443 \u043d\u0435\u0435 \u0432\u0441\u0435\u0433\u0434\u0430 \u0435\u0441\u0442\u044c \u0430\u0440\u0433\u0443\u043c\u0435\u043d\u0442 <code>this<\/code> \u0431\u0435\u0437 \u0438\u0441\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u044f. \u0415\u0441\u043b\u0438 \u0430\u0440\u0433\u0443\u043c\u0435\u043d\u0442 <code>this<\/code> \u043d\u0438 \u043a\u0430\u043a\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c \u043d\u0435 \u0437\u0430\u0434\u0430\u043d, \u0442\u043e\u0433\u0434\u0430 \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e \u043e\u043d \u0432\u0441\u0435\u0433\u0434\u0430 \u0441\u0432\u044f\u0437\u0430\u043d \u0441 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435\u043c <code>undefined<\/code>.<\/p>\n<p>\u041f\u0440\u0438\u043c\u0435\u0440:<\/p>\n<pre><code class=\"javascript\">\"use strict\"  function doLogThis() { console.log('this is', this) \/\/ undefined }  doLogThis()<\/code><\/pre>\n<hr\/>\n<h3>this \u0438 call, apply, bind<\/h3>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w780q1\/getpro\/habr\/upload_files\/8da\/ebd\/c22\/8daebdc221b9879383789fbd3308cee8.jpg\" width=\"1902\" height=\"2102\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/8da\/ebd\/c22\/8daebdc221b9879383789fbd3308cee8.jpg\" data-blurred=\"true\"\/><\/figure>\n<p>\u0415\u0441\u043b\u0438 \u043c\u044b \u043d\u0430\u0445\u043e\u0434\u0438\u043c\u0441\u044f \u0432\u043d\u0443\u0442\u0440\u0438 \u043d\u043e\u0440\u043c\u0430\u043b\u044c\u043d\u043e\u0439 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u0432 \u043f\u0435\u0440\u0432\u0443\u044e \u043e\u0447\u0435\u0440\u0435\u0434\u044c \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0435\u0442\u044c \u043a\u0430\u043a \u044d\u0442\u0430 \u0444\u0443\u043d\u043a\u0446\u0438\u044f \u0432\u044b\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f.<\/p>\n<p>\u041f\u0440\u0438\u043c\u0435\u0440:<\/p>\n<pre><code class=\"javascript\">function SomeObject() {}  SomeObject.prototype.someMethod = function() {   console.log('Hello!'); };  const newObj = new SomeObject();  newObj.someMethod(); \/\/ \u0412\u044b\u0432\u0435\u0434\u0435\u0442: Hello!<\/code><\/pre>\n<p>\u041c\u0435\u0442\u043e\u0434\u044b <code>call<\/code>, <code>apply<\/code>, <code>bind<\/code> \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u044e\u0442 \u0437\u0430\u0434\u0430\u0442\u044c <code>this<\/code> \u044f\u0432\u043d\u044b\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c.<\/p>\n<pre><code class=\"javascript\">\"use strict\"  function doLogThis() { console.log(\"this is\", this) }  let thisArg = 1  doLogThis.call(thisArg) \/\/ 1 doLogThis.apply(thisArg) \/\/ 1 doLogThis.bind(thisArg)() \/\/ 1<\/code><\/pre>\n<p>\u0412 \u043d\u0430\u0448\u0435\u043c \u043f\u0440\u0438\u043c\u0435\u0440\u0435 \u0444\u0443\u043d\u043a\u0446\u0438\u044f <code>doLogThis<\/code> \u0432\u044b\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u0441 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435\u043c \u043c\u0435\u0442\u043e\u0434\u043e\u0432 <code>call<\/code>, <code>apply<\/code>, <code>bind<\/code> \u0441 \u043f\u0435\u0440\u0435\u0434\u0430\u043d\u043d\u044b\u043c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435\u043c <code>thisArg<\/code> (\u0432\u0441\u0435 \u0441\u0440\u0430\u0437\u0443 \u0443\u043a\u0430\u0437\u0430\u043d\u044b \u0434\u043b\u044f \u043f\u0440\u0438\u043c\u0435\u0440\u0430), \u0430 \u044d\u0442\u043e \u0437\u043d\u0430\u0447\u0438\u0442 <code>this<\/code> \u0440\u0430\u0432\u0435\u043d <code>thisArg<\/code> (\u0442\u043e\u043c\u0443, \u0447\u0442\u043e \u043c\u044b \u043f\u0435\u0440\u0435\u0434\u0430\u043b\u0438 \u0432 \u043c\u0435\u0442\u043e\u0434\u044b).<\/p>\n<p>\u041c\u043d\u043e\u0433\u0438\u0435 \u043c\u043e\u0433\u0443\u0442 \u043f\u043e\u0434\u0443\u043c\u0430\u0442\u044c, \u0447\u0442\u043e <code>this<\/code> \u0441\u0432\u044f\u0437\u0430\u043d \u0441 \u043a\u0430\u043a\u043e\u0439-\u0442\u043e \u0441\u043b\u043e\u0436\u043d\u043e\u0439 \u043e\u0431\u044a\u0435\u043a\u0442\u043d\u043e\u0439 \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u043e\u0439, \u043d\u043e \u044d\u0442\u043e \u043d\u0435 \u0442\u0430\u043a. \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044f <code>call<\/code>, <code>apply<\/code>, <code>bind<\/code> \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u0441\u0432\u044f\u0437\u0430\u0442\u044c <code>this<\/code> \u0438 \u0441 \u043b\u044e\u0431\u044b\u043c \u043f\u0440\u0438\u043c\u0438\u0442\u0438\u0432\u043d\u044b\u043c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435\u043c.<\/p>\n<p>\u0420\u0430\u0437\u0431\u0435\u0440\u0435\u043c \u043c\u0435\u0442\u043e\u0434\u044b <code>call<\/code>, <code>bind<\/code> \u0438 <code>apply<\/code> \u0431\u043e\u043b\u0435\u0435 \u043f\u043e\u0434\u0440\u043e\u0431\u043d\u043e.<\/p>\n<h4>call()<\/h4>\n<p><code>call()<\/code> &#8212; \u044d\u0442\u043e \u043c\u0435\u0442\u043e\u0434, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0432\u044b\u0437\u0432\u0430\u0442\u044c \u0444\u0443\u043d\u043a\u0446\u0438\u044e, \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u044f \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442 (<code>this<\/code>) \u0438 \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u044f \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u044b \u0432 \u0432\u0438\u0434\u0435 \u0441\u043f\u0438\u0441\u043a\u0430.<\/p>\n<pre><code class=\"javascript\">const person1 = {   name: 'Alice',   greet: function(place) {     console.log(`Hello, ${this.name}! Welcome to ${place}.`);   } };  const person2 = {   name: 'Bob' };  person1.greet.call(person2, 'the park');  \/\/ \u0412\u044b\u0432\u043e\u0434: Hello, Bob! Welcome to the park.<\/code><\/pre>\n<p>\u0412 \u044d\u0442\u043e\u043c \u043f\u0440\u0438\u043c\u0435\u0440\u0435 \u043c\u044b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043b\u0438 <code>call()<\/code> \u0434\u043b\u044f \u0432\u044b\u0437\u043e\u0432\u0430 \u043c\u0435\u0442\u043e\u0434\u0430 <code>greet<\/code> \u043e\u0431\u044a\u0435\u043a\u0442\u0430 <code>person1<\/code>, \u043d\u043e \u0441 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u043e\u043c \u043e\u0431\u044a\u0435\u043a\u0442\u0430 <code>person2<\/code>. \u042d\u0442\u043e \u043f\u043e\u0437\u0432\u043e\u043b\u0438\u043b\u043e \u043d\u0430\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043c\u0435\u0442\u043e\u0434 <code>greet<\/code> \u043e\u0431\u044a\u0435\u043a\u0442\u0430 <code>person1<\/code>, \u043d\u043e \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u0442\u0430\u043a, \u0447\u0442\u043e\u0431\u044b <code>this<\/code> \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u043b\u043e \u043d\u0430 <code>person2<\/code>.<\/p>\n<h4>apply()<\/h4>\n<p><code>apply()<\/code> \u043f\u043e\u0445\u043e\u0436 \u043d\u0430 <code>call()<\/code>, \u043d\u043e \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u0435\u0442 \u0430\u0440\u0433\u0443\u043c\u0435\u043d\u0442\u044b \u0432 \u0432\u0438\u0434\u0435 \u043c\u0430\u0441\u0441\u0438\u0432\u0430<\/p>\n<pre><code class=\"javascript\">const numbers = [2, 4, 6, 8, 10]; const maxNumber = Math.max.apply(null, numbers);  console.log(maxNumber); \/\/ \u0412\u044b\u0432\u043e\u0434: 10<\/code><\/pre>\n<p>\u0417\u0434\u0435\u0441\u044c \u043c\u044b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043b\u0438 <code>apply()<\/code> \u0434\u043b\u044f \u0432\u044b\u0437\u043e\u0432\u0430 \u043c\u0435\u0442\u043e\u0434\u0430 <code>Math.max<\/code>, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043e\u0431\u044b\u0447\u043d\u043e \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u0435\u0442 \u0441\u043f\u0438\u0441\u043e\u043a \u0447\u0438\u0441\u0435\u043b \u043a\u0430\u043a \u0430\u0440\u0433\u0443\u043c\u0435\u043d\u0442\u044b, \u043d\u043e \u0432 \u0434\u0430\u043d\u043d\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u043c\u044b \u043f\u0435\u0440\u0435\u0434\u0430\u043b\u0438 \u043c\u0430\u0441\u0441\u0438\u0432 <code>numbers<\/code>. <code>apply()<\/code> \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043c\u0430\u0441\u0441\u0438\u0432 \u0432 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u0430\u0440\u0433\u0443\u043c\u0435\u043d\u0442\u043e\u0432 \u0444\u0443\u043d\u043a\u0446\u0438\u0438.<\/p>\n<h4>bind()<\/h4>\n<p><code>bind()<\/code> \u0441\u043e\u0437\u0434\u0430\u0435\u0442 \u043d\u043e\u0432\u0443\u044e \u0444\u0443\u043d\u043a\u0446\u0438\u044e \u0441 \u043f\u0440\u0438\u0432\u044f\u0437\u0430\u043d\u043d\u044b\u043c \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u043e\u043c (<code>this<\/code>), \u043a\u043e\u0442\u043e\u0440\u0443\u044e \u043c\u043e\u0436\u043d\u043e \u0432\u044b\u0437\u0432\u0430\u0442\u044c \u043f\u043e\u0437\u0436\u0435.<\/p>\n<pre><code class=\"javascript\">const obj = {   value: 30,   getValue: function() {     return this.value;   } };  const getValue = obj.getValue; const boundGetValue = obj.getValue.bind(obj);  console.log(getValue()); \/\/ \u0412\u044b\u0432\u043e\u0434: undefined (\u0442\u0430\u043a \u043a\u0430\u043a \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442 \u043d\u0435 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d) console.log(boundGetValue()); \/\/ \u0412\u044b\u0432\u043e\u0434: 30<\/code><\/pre>\n<p><code>getValue<\/code> \u0431\u0435\u0437 \u043f\u0440\u0438\u0432\u044f\u0437\u043a\u0438 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u0430 \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u0442 <code>undefined<\/code>, \u0442\u0430\u043a \u043a\u0430\u043a \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442 \u0442\u0435\u0440\u044f\u0435\u0442\u0441\u044f \u043f\u0440\u0438 \u0441\u043e\u0445\u0440\u0430\u043d\u0435\u043d\u0438\u0438 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u0432 \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u0439. \u041d\u043e <code>boundGetValue<\/code>, \u0441\u043e\u0437\u0434\u0430\u043d\u043d\u0430\u044f \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e <code>bind()<\/code>, \u0441\u043e\u0445\u0440\u0430\u043d\u044f\u0435\u0442 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442 \u043e\u0431\u044a\u0435\u043a\u0442\u0430 <code>obj<\/code> \u0438 \u0443\u0441\u043f\u0435\u0448\u043d\u043e \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u0442 <code>30<\/code>.<\/p>\n<hr\/>\n<h3>this \u0438 new<\/h3>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w780q1\/getpro\/habr\/upload_files\/cf2\/6fa\/792\/cf26fa792636369454ea2c6a33a07d35.jpg\" width=\"1773\" height=\"2255\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/cf2\/6fa\/792\/cf26fa792636369454ea2c6a33a07d35.jpg\" data-blurred=\"true\"\/><\/figure>\n<p>\u041f\u0440\u0438\u043c\u0435\u0440:<\/p>\n<pre><code class=\"javascript\">\"use strict\"  function doLogThis() { console.log(\"this is\", this) }  new doLogThis(); \/\/ {} new doLogThis; \/\/ {}<\/code><\/pre>\n<p>\u0412 \u0434\u0430\u043d\u043d\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u0432\u044b\u0437\u043e\u0432 <code>doLogThis<\/code> \u043f\u0440\u043e\u0438\u0437\u043e\u0448\u0435\u043b \u043f\u0440\u0438 \u043f\u043e\u043c\u043e\u0449\u0438 \u043a\u043b\u044e\u0447\u0435\u0432\u043e\u0433\u043e \u0441\u043b\u043e\u0432\u0430 <code>new<\/code>.<\/p>\n<p>\u041a\u043b\u044e\u0447\u0435\u0432\u043e\u0435 \u0441\u043b\u043e\u0432\u043e <code>new<\/code> \u0432\u044b\u0437\u044b\u0432\u0430\u0435\u0442 \u0444\u0443\u043d\u043a\u0446\u0438\u044e, \u043a\u0440\u043e\u043c\u0435 \u0441\u0442\u0440\u0435\u043b\u043e\u0447\u043d\u043e\u0439 \u0444\u0443\u043d\u043a\u0446\u0438\u0438.<\/p>\n<p>\u041a\u043b\u044e\u0447\u0435\u0432\u043e\u0435 \u0441\u043b\u043e\u0432\u043e <code>new<\/code> \u0432\u044b\u0437\u044b\u0432\u0430\u0435\u0442 \u0444\u0443\u043d\u043a\u0446\u0438\u044e \u0438 <code>this<\/code> \u0441\u0432\u044f\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u0441 \u043f\u0443\u0441\u0442\u044b\u043c \u043e\u0431\u044a\u0435\u043a\u0442\u043e\u043c <code>{}<\/code>.<\/p>\n<p>\u0418\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c <code>()<\/code> \u0434\u043b\u044f \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f <strong>call expression<\/strong> \u043d\u0435 \u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u043e.<\/p>\n<hr\/>\n<h3>Call API<\/h3>\n<p>\u0422\u0435\u043f\u0435\u0440\u044c \u043f\u043e\u0433\u043e\u0432\u043e\u0440\u0438\u043c \u043e \u0442\u043e\u043c, \u0447\u0442\u043e \u0432 \u0432\u043f\u043e\u043b\u043d\u0435 \u043f\u043e\u043d\u044f\u0442\u043d\u043e\u043c JavaScript \u043c\u043e\u0436\u0435\u0442 \u0432\u043e\u0437\u043d\u0438\u043a\u043d\u0443\u0442\u044c &#171;\u043d\u0435\u043e\u0436\u0438\u0434\u0430\u043d\u043d\u043e\u0435&#187; \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435.<\/p>\n<p>JavaScript \u043d\u0435 \u043c\u043e\u0436\u0435\u0442 \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u043e\u0432\u0430\u0442\u044c \u0441\u0430\u043c \u043f\u043e \u0441\u0435\u0431\u0435. \u041e\u043d \u0434\u043e\u043b\u0436\u0435\u043d \u0431\u044b\u0442\u044c \u0432\u0441\u0442\u0440\u043e\u0435\u043d \u0432 \u043a\u0430\u043a\u043e\u0435-\u0442\u043e \u043e\u043a\u0440\u0443\u0436\u0435\u043d\u0438\u0435 (\u0431\u0440\u0430\u0443\u0437\u0435\u0440, Node, d8 \u0438 \u0442. \u0434.). \u0412 \u0441\u0432\u044f\u0437\u0438 \u0441 \u044d\u0442\u0438\u043c \u0443 JavaScript \u0435\u0441\u0442\u044c \u0441\u0432\u043e\u0439 \u043d\u0430\u0431\u043e\u0440 \u0444\u0443\u043d\u043a\u0446\u0438\u0439, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d \u0441\u043f\u0435\u0446\u0438\u0444\u0438\u043a\u0430\u0446\u0438\u0435\u0439, \u0438 \u0435\u0441\u0442\u044c \u043d\u0430\u0431\u043e\u0440 \u0441\u0442\u043e\u0440\u043e\u043d\u043d\u0438\u0445 API, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u044e\u0442 \u044f\u0437\u044b\u043a\u0443 JavaScript \u0432\u044b\u0437\u044b\u0432\u0430\u0442\u044c \u0438\u0445. \u0412\u0441\u0435, \u043e \u0447\u0435\u043c \u043c\u044b \u0433\u043e\u0432\u043e\u0440\u0438\u043b\u0438 \u0432\u044b\u0448\u0435, \u043a\u0430\u0441\u0430\u043b\u043e\u0441\u044c \u0438\u043c\u0435\u043d\u043d\u043e JavaScript \u0438 \u0435\u0433\u043e \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u0435\u0439.<\/p>\n<p>\u0412 \u043d\u0430\u0448\u0435\u0439 \u043b\u043e\u0433\u0438\u043a\u0435 \u043f\u0443\u0442\u0430\u043d\u0438\u0446\u0430 \u043c\u043e\u0436\u0435\u0442 \u043d\u0430\u0447\u0438\u043d\u0430\u0442\u044c\u0441\u044f \u0442\u043e\u0433\u0434\u0430, \u043a\u043e\u0433\u0434\u0430 \u043c\u044b \u0441\u0442\u0430\u043b\u043a\u0438\u0432\u0430\u0435\u043c\u0441\u044f \u0441 \u0432\u043d\u0435\u0448\u043d\u0438\u043c API.<\/p>\n<p>\u0412\u044b\u0437\u043e\u0432 \u043b\u044e\u0431\u043e\u0433\u043e \u0432\u043d\u0435\u0448\u043d\u0435\u0433\u043e API \u043c\u043e\u0436\u0435\u0442 \u0441\u0432\u044f\u0437\u044b\u0432\u0430\u0442\u044c <code>this<\/code> \u0441\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435\u043c, \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u043f\u0440\u0438\u0448\u043b\u043e \u043d\u0430 \u0443\u043c \u0441\u043e\u0437\u0434\u0430\u0442\u0435\u043b\u044f\u043c API. \u0412 \u043b\u044e\u0431\u043e\u0439 \u043d\u043e\u0442\u0430\u0446\u0438\u0438 \u0438 \u0444\u043e\u0440\u043c\u0430\u0445.<\/p>\n<p>\u041a\u0430\u043a \u0440\u0435\u0430\u043b\u0438\u0437\u043e\u0432\u0430\u043d\u043e \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u043d\u043e\u0435 API, \u043c\u043e\u0436\u043d\u043e \u0443\u0437\u043d\u0430\u0442\u044c \u0442\u043e\u043b\u044c\u043a\u043e \u0438\u0437 \u0435\u0433\u043e \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u0438.<\/p>\n<p>\u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440 \u0432 <strong>HTML5<\/strong> \u0435\u0441\u0442\u044c API <code>addEventListener<\/code>, \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043f\u0440\u0438\u0432\u044f\u0437\u044b\u0432\u0430\u0442\u044c \u043a \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u043d\u044b\u043c \u0441\u043e\u0431\u044b\u0442\u0438\u044f\u043c \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u0430 <strong>HTML5<\/strong> \u0444\u0443\u043d\u043a\u0446\u0438\u044e &#8212; \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a.<\/p>\n<p>\u0412 \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u0438 \u043f\u0440\u044f\u043c\u043e \u0437\u0430\u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043e \u0442\u043e\u043c, \u0447\u0442\u043e \u0432\u044b\u0437\u043e\u0432 \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430, \u0431\u0443\u0434\u0435\u0442 \u043e\u0441\u0443\u0449\u0435\u0441\u0442\u0432\u043b\u0435\u043d \u0441 \u043f\u0440\u0438\u0432\u044f\u0437\u043a\u043e\u0439 <code>this<\/code> \u043a \u043e\u0431\u044a\u0435\u043a\u0442\u0443 \u0441\u043e\u0431\u044b\u0442\u0438\u0435 \u043a\u043e\u0442\u043e\u0440\u043e\u0433\u043e \u043e\u043d \u043e\u0431\u0441\u043b\u0443\u0436\u0438\u0432\u0430\u0435\u0442.<\/p>\n<p>\u0421\u0430\u043c\u044b\u0439 \u043f\u0440\u043e\u0441\u0442\u043e\u0439 \u0441\u043f\u043e\u0441\u043e\u0431 \u0443\u0432\u0438\u0434\u0435\u0442\u044c \u044d\u0442\u043e:<\/p>\n<pre><code class=\"javascript\">\"use strict\"  function doHandleClick() {   console.log(\"this is\", this) }  document.body.addEventListener(\"click\", doHandleClick)<\/code><\/pre>\n<p>\u0415\u0441\u043b\u0438 \u043c\u044b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c \u043a\u043e\u0434 \u0432 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0435, \u0442\u043e \u0443\u0432\u0438\u0434\u0438\u043c, \u0447\u0442\u043e <code>this<\/code> \u0440\u0430\u0432\u0435\u043d \u043d\u0435 <code>undefined<\/code>, \u0430 <strong>body<\/strong>.<\/p>\n<p>\u041f\u043e\u0447\u0435\u043c\u0443 \u0442\u0430\u043a \u043f\u0440\u043e\u0438\u0437\u043e\u0448\u043b\u043e? \u0421\u043e\u0433\u043b\u0430\u0441\u043d\u043e \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u0443 <strong>HTML5<\/strong> <code>addEventListener<\/code> \u043e\u0431\u0441\u043b\u0443\u0436\u0438\u0432\u0430\u0435\u0442 \u043b\u044e\u0431\u043e\u0439 \u0432\u044b\u0437\u043e\u0432 \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430 \u0441\u043e\u0431\u044b\u0442\u0438\u044f \u0442\u0430\u043a\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c, \u043f\u0440\u0438 \u0432\u044b\u0437\u043e\u0432\u0435 \u044d\u0442\u043e\u0439 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u0432 <strong>callback<\/strong> \u043f\u0435\u0440\u0435\u0434\u0430\u0435\u0442\u0441\u044f <strong>event currentTarget<\/strong>. \u041d\u0430 \u044d\u0442\u043e\u043c \u043c\u043e\u043c\u0435\u043d\u0442\u0435 \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u0434\u043e\u0437\u0432\u043e\u043b\u0435\u043d\u043d\u043e\u0435 \u043d\u0430\u0440\u0443\u0448\u0435\u043d\u0438\u0435 \u0441\u043f\u0435\u0446\u0438\u0444\u0438\u043a\u0430\u0446\u0438\u0438 \u044f\u0437\u044b\u043a\u0430 JavaScript. \u041f\u043e \u044d\u0442\u043e\u0439 \u043f\u0440\u0438\u0447\u0438\u043d\u0435 \u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 <code>this<\/code> \u0432\u043d\u0443\u0442\u0440\u0438 <code>doHandleClick<\/code>.<\/p>\n<p>\u041f\u0435\u0440\u0435\u043f\u0440\u043e\u0432\u0435\u0440\u0438\u0442\u044c \u044d\u0442\u043e \u043c\u043e\u0436\u043d\u043e \u0442\u0430\u043a:<\/p>\n<pre><code class=\"javascript\">\"use strict\"  function doHandleClick() {   console.log(\"this is\", this) }  document.body.addEventListener(\"click\", doHandleClick.bind({ name: \"Pavel\" }))<\/code><\/pre>\n<p>\u0422\u0435\u043f\u0435\u0440\u044c \u0431\u043b\u0430\u0433\u043e\u0434\u0430\u0440\u044f \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044e <code>bind<\/code> \u043d\u0430\u0448\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 <code>this<\/code> \u0431\u0443\u0434\u0435\u0442 \u0440\u0430\u0432\u043d\u043e \u043e\u0431\u044a\u0435\u043a\u0442\u0443 <code>{ name: \"Pavel\" }<\/code>.<\/p>\n<hr\/>\n<h3>this \u0438 dot \u043d\u043e\u0442\u0430\u0446\u0438\u044f<\/h3>\n<p><strong>\u0414\u043e\u0442 \u043d\u043e\u0442\u0430\u0446\u0438\u0435\u0439 (dot notation)<\/strong> \u0432 JavaScript, \u043d\u0430\u0437\u044b\u0432\u0430\u044e\u0442 \u0441\u0438\u043d\u0442\u0430\u043a\u0441\u0438\u0441, \u043a\u043e\u0433\u0434\u0430 \u0434\u0432\u0430 \u0438\u0434\u0435\u043d\u0442\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440\u0430 \u0440\u0430\u0437\u0434\u0435\u043b\u0435\u043d\u044b \u043c\u0435\u0436\u0434\u0443 \u0441\u043e\u0431\u043e\u0439 \u0442\u043e\u0447\u043a\u043e\u0439 (dot). \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440 <code>theObj.theProperty<\/code>.<\/p>\n<p>\u0415\u0433\u043e \u043f\u043e\u043b\u043d\u044b\u043c \u0430\u043d\u0430\u043b\u043e\u0433\u043e\u043c \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0441\u0438\u043d\u0442\u0430\u043a\u0441\u0438\u0441 <code>theObj[\"theProperty\"]<\/code>.<\/p>\n<p>\u0412\u044b\u0437\u043e\u0432 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u0432 dot \u043d\u043e\u0442\u0430\u0446\u0438\u0438 \u0432\u044b\u0433\u043b\u044f\u0434\u0438\u0442 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c:<\/p>\n<pre><code class=\"javascript\">theObj.doTheing(); \/\/ \u0438\u043b\u0438 theObj[\"doTheing\"]();<\/code><\/pre>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w780q1\/getpro\/habr\/upload_files\/6ba\/a52\/e10\/6baa52e1025222c654a7e61a4666d77b.jpg\" width=\"1710\" height=\"2338\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/6ba\/a52\/e10\/6baa52e1025222c654a7e61a4666d77b.jpg\" data-blurred=\"true\"\/><\/figure>\n<p>\u0411\u043e\u043b\u044c\u0448\u0430\u044f \u0447\u0430\u0441\u0442\u044c \u0437\u0430\u0434\u0430\u0447 \u043d\u0430 \u0441\u043e\u0431\u0435\u0441\u0435\u0434\u043e\u0432\u0430\u043d\u0438\u044f\u0445 \u043e\u0442\u043d\u043e\u0441\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u0447\u0435\u043c\u0443 \u0440\u0430\u0432\u0435\u043d <code>this<\/code> \u043f\u043e \u0441\u0443\u0442\u0438 \u043a\u0440\u0443\u0442\u0438\u0442\u0441\u044f \u0432\u043e\u043a\u0440\u0443\u0433 <strong>dot \u043d\u043e\u0442\u0430\u0446\u0438\u0438<\/strong>. \u041f\u043e \u044d\u0442\u043e\u0439 \u043f\u0440\u0438\u0447\u0438\u043d\u0435 \u043c\u043d\u043e\u0433\u0438\u0435 \u043e\u0448\u0438\u0431\u043e\u0447\u043d\u043e \u0434\u0443\u043c\u0430\u044e\u0442, \u0447\u0442\u043e <code>this<\/code> \u044d\u0442\u043e \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442.<\/p>\n<pre><code class=\"javascript\">\"use strict\"  function doLogThis() { console.log(\"this is\", this) }  const theObj = { name: \"Pavel\" }  theObj.doLogThis = doLogThis theObj.doLogThis() \/\/ { name: 'Pavel', doLogThis: [Function: doLogThis] }<\/code><\/pre>\n<p>\u0415\u0441\u043b\u0438 \u0444\u0443\u043d\u043a\u0446\u0438\u044f \u0431\u044b\u043b\u0430 \u0432\u044b\u0437\u0432\u0430\u043d\u0430 \u0432 <strong>dot notation<\/strong>, \u0442\u043e\u0433\u0434\u0430 <code>this<\/code> \u0440\u0430\u0432\u043d\u043e \u0442\u043e\u043c\u0443 \u0438\u0434\u0435\u043d\u0442\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440\u0443, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0441\u0442\u043e\u0438\u0442 \u043f\u0435\u0440\u0435\u0434 \u0442\u043e\u0447\u043a\u043e\u0439.<\/p>\n<p>\u041f\u0440\u0438\u043c\u0435\u0440 \u043d\u0430\u043e\u0431\u043e\u0440\u043e\u0442:<\/p>\n<pre><code class=\"javascript\">\"use strict\"  const theObj = {   name: \"Pavel\",   doLogThis: function () {     console.log(\"this is\", this)   } }  const doLogThisGlobal = theObj.doLogThis doLogThisGlobal() \/\/ this is undefined<\/code><\/pre>\n<p>\u0412\u043d\u0443\u0442\u0440\u0438 <code>theObj<\/code> \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0430 \u0444\u0443\u043d\u043a\u0446\u0438\u044f <code>doLogThis<\/code> \u043a\u0430\u043a \u043d\u043e\u0440\u043c\u0430\u043b\u044c\u043d\u0430\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u044f. <code>doLogThisGlobal<\/code> \u0441\u0432\u044f\u0437\u0430\u043d \u0441 \u0444\u0443\u043d\u043a\u0446\u0438\u0435\u0439 <code>theObj.doLogThis<\/code>. \u041f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u0432\u044b\u0437\u043e\u0432 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 <code>doLogThisGlobal<\/code>.<\/p>\n<p>\u0421\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0439 \u043f\u0440\u0438\u043c\u0435\u0440:<\/p>\n<pre><code class=\"javascript\">\"use strict\"  const theObj = {   name: \"Pavel\",   doLogThis: function () {     console.log(\"this is\", this)   } }  setTimeout(theObj.doLogThis, 1)<\/code><\/pre>\n<p>\u042d\u0442\u043e\u0442 \u043f\u0440\u0438\u043c\u0435\u0440 \u043e\u0447\u0435\u043d\u044c \u0447\u0430\u0441\u0442\u043e \u0432\u0441\u0442\u0440\u0435\u0447\u0430\u0435\u0442\u0441\u044f \u043d\u0430 \u0441\u043e\u0431\u0435\u0441\u0435\u0434\u043e\u0432\u0430\u043d\u0438\u044f\u0445.<\/p>\n<p><code>theObj<\/code> \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d \u0442\u0430\u043a \u0436\u0435 \u043a\u0430\u043a \u0438 \u0432 \u043f\u0440\u0435\u0434\u044b\u0434\u0443\u0449\u0435\u043c \u043f\u0440\u0438\u043c\u0435\u0440\u0435. <code>theObj.doLogThis<\/code> \u0434\u043e\u043b\u0436\u0435\u043d \u0432\u044b\u0437\u0432\u0430\u0442\u044c\u0441\u044f \u0447\u0435\u0440\u0435\u0437 1\u043c\u0441 \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e <code>setTimeout<\/code>.<\/p>\n<p>\u0418\u0434\u0435\u043c \u043f\u043e \u043d\u0430\u0448\u0435\u043c\u0443 \u0430\u043b\u0433\u043e\u0440\u0438\u0442\u043c\u0443:<\/p>\n<ul>\n<li>\n<p>\u0412\u0438\u0434\u0438\u043c <code>call<\/code>, <code>apply<\/code>, <code>bind<\/code>? <\/p>\n<ul>\n<li>\n<p>\u041d\u0435\u0442 <\/p>\n<ul>\n<li>\n<p>\u0412\u0438\u0434\u0438\u043c <code>new<\/code>? <\/p>\n<ul>\n<li>\n<p>\u041d\u0435\u0442 <\/p>\n<ul>\n<li>\n<p>\u0424\u0443\u043d\u043a\u0446\u0438\u044f \u0432\u044b\u0437\u0432\u0430\u043d\u0430 \u0432 <strong>dot \u043d\u043e\u0442\u0430\u0446\u0438\u0438<\/strong>? <\/p>\n<ul>\n<li>\n<p>\u0414\u0430 (\u0432\u043d\u0443\u0442\u0440\u0438 <code>setTimeout<\/code>)<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<p>\u0422\u043e\u0436\u0435 \u0441\u0430\u043c\u043e\u0435 \u043f\u0440\u043e\u0438\u0437\u043e\u0439\u0434\u0435\u0442 \u0435\u0441\u043b\u0438 \u043a\u043e\u0434 \u0431\u0443\u0434\u0435\u0442 \u0442\u0430\u043a\u0438\u043c:<\/p>\n<pre><code class=\"javascript\">\"use strict\"  const theObj = {   name: \"Pavel\",   doLogThis: function () {     console.log(\"this is\", this)   } } const doLogThis = theObj.doLogThis  setTimeout(doLogThis, 1)<\/code><\/pre>\n<p>\u041f\u043e\u0447\u0435\u043c\u0443 <code>this<\/code> \u0441\u0442\u0430\u043b\u043e \u0440\u0430\u0432\u043d\u044b\u043c \u043e\u0431\u044a\u0435\u043a\u0442\u0443 <code>window<\/code> \u043f\u0440\u0438 \u0437\u0430\u043f\u0443\u0441\u043a\u0435 \u0432 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0435?<\/p>\n<p>\u0414\u0435\u043b\u043e \u0432 \u0442\u043e\u043c, \u0447\u0442\u043e <code>setTimeout<\/code> \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f <strong>\u0432\u043d\u0435\u0448\u043d\u0438\u043c API<\/strong>. Host \u043c\u043e\u0436\u0435\u0442 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0438\u0442\u044c <code>this<\/code> \u0442\u0430\u043a, \u043a\u0430\u043a \u0435\u043c\u0443 \u043d\u0443\u0436\u043d\u043e.<\/p>\n<p>\u0412 \u043e\u043f\u0438\u0441\u0430\u043d\u0438\u0438 \u0442\u0430\u0439\u043c\u0435\u0440\u043e\u0432 \u0432 \u0441\u043f\u0435\u0446\u0438\u0444\u0438\u043a\u0430\u0446\u0438\u0438 <strong>HTML5<\/strong> \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u043d\u0430\u0439\u0442\u0438 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0443\u044e \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044e. \u0412 \u0442\u043e\u0442 \u043c\u043e\u043c\u0435\u043d\u0442, \u043a\u043e\u0433\u0434\u0430 \u043d\u0430\u0448 \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a (<strong>handler<\/strong>), \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0434\u043e\u043b\u0436\u0435\u043d \u0431\u044b\u0442\u044c \u0432\u044b\u0437\u0432\u0430\u043d \u043f\u043e \u043f\u0440\u043e\u0448\u0435\u0441\u0442\u0432\u0438\u0438 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u043d\u043e\u0433\u043e \u0432\u0440\u0435\u043c\u0435\u043d\u0438, \u0431\u0443\u0434\u0435\u0442 \u0432\u044b\u0437\u044b\u0432\u0430\u0442\u044c\u0441\u044f, <code>this<\/code> \u0434\u043e\u043b\u0436\u043d\u043e \u0431\u044b\u0442\u044c \u0441\u0432\u044f\u0437\u0430\u043d\u043e \u0441 \u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u044b\u043c \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u043e\u043c (<strong>global<\/strong>). \u0412 \u0441\u043b\u0443\u0447\u0430\u0435, \u0435\u0441\u043b\u0438 \u043d\u0430\u0448\u0435 \u043e\u043a\u0440\u0443\u0436\u0435\u043d\u0438\u0435 &#8212; \u044d\u0442\u043e <code>script<\/code>, \u0442\u043e\u0433\u0434\u0430 \u044d\u0442\u043e \u0431\u0443\u0434\u0435\u0442 <code>window<\/code>, \u0430 \u0432 \u0441\u043b\u0443\u0447\u0430\u0435 \u0441 <code>module<\/code> &#8212; <code>undefined<\/code>.<\/p>\n<p>\u041f\u0440\u0438 \u0437\u0430\u043f\u0443\u0441\u043a\u0435 \u0432 \u0441\u0440\u0435\u0434\u0435 Node.js \u043c\u044b \u043d\u0430\u0431\u043b\u044e\u0434\u0430\u0435\u043c \u0442\u043e\u0442 \u0436\u0435 \u044d\u0444\u0444\u0435\u043a\u0442, \u043d\u043e \u0442\u0435\u043f\u0435\u0440\u044c <strong>Host<\/strong> \u043d\u0430\u0437\u043d\u0430\u0447\u0438\u043b <code>this<\/code> \u043a\u0430\u043a \u043e\u0431\u044a\u0435\u043a\u0442 <code>Timeout<\/code>. \u0415\u0441\u043b\u0438 \u043c\u044b \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0438\u043c \u0441\u043f\u0435\u0446\u0438\u0444\u0438\u043a\u0430\u0446\u0438\u044e Node.js, \u0442\u043e \u0443\u0432\u0438\u0434\u0438\u043c, \u0447\u0442\u043e \u0442\u0430\u0439\u043c\u0435\u0440 &#8212; \u044d\u0442\u043e, \u043d\u0430 \u0441\u0430\u043c\u043e\u043c \u0434\u0435\u043b\u0435, \u043a\u043b\u0430\u0441\u0441 <code>Timeout<\/code>.<\/p>\n<p>\u041d\u0430\u043f\u043e\u043c\u0438\u043d\u0430\u044e, \u0447\u0442\u043e \u043f\u043e\u0434\u043e\u0431\u043d\u044b\u0435 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u043d\u0435 \u043a\u0430\u0441\u0430\u044e\u0442\u0441\u044f \u0441\u043b\u0443\u0447\u0430\u0435\u0432, \u043a\u043e\u0433\u0434\u0430 \u043c\u044b \u043d\u0430\u0437\u043d\u0430\u0447\u0430\u0435\u043c <code>this<\/code> \u044f\u0432\u043d\u044b\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c, \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044f <code>call<\/code>, <code>bind<\/code>, <code>apply<\/code>.<\/p>\n<hr\/>\n<h3>\u041e\u0441\u043e\u0431\u0435\u043d\u043d\u043e\u0441\u0442\u0438 this \u0432 non strict mode<\/h3>\n<p>\u041f\u0440\u0438 \u0432\u044b\u0437\u043e\u0432\u0435 <strong>normal function<\/strong>, <code>this<\/code> \u0441\u0432\u044f\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u043d\u0435 \u0441 <code>undefined<\/code>, \u0430 \u0441 <strong>global object<\/strong>.<\/p>\n<p>\u0412 \u0441\u043b\u0443\u0447\u0430\u0435 \u0432\u044b\u0437\u043e\u0432\u0430 \u0441 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435\u043c dot \u043d\u043e\u0442\u0430\u0446\u0438\u0438: <code>theObj.doThing() this<\/code> \u0431\u0443\u0434\u0435\u0442 \u0441\u0432\u044f\u0437\u0430\u043d \u0441\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435\u043c <code>ToObject(theObj)<\/code><\/p>\n<p>\u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440:<\/p>\n<pre><code class=\"javascript\">String.prototype.doThingStrict = function () { \"use strict\" console.log(\"this is\", this) }  String.prototype.doThing = function () {   console.log(\"this is\", this) }  \"Yo\".doThingStrict() \/\/ this \u0431\u0443\u0434\u0435\u0442 \u0441\u0432\u044f\u0437\u0430\u043d \u0441\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435\u043c \"Yo\" \"Yo\".doThing() \/\/ this \u0431\u0443\u0434\u0435\u0442 \u0441\u0432\u044f\u0437\u0430\u043d \u0441\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435\u043c new String(\"Yo\")<\/code><\/pre>\n<p><strong>\u0415\u0441\u043b\u0438 \u043d\u0430\u0448 \u043a\u043e\u0434 \u0432\u044b\u043f\u043e\u043b\u043d\u044f\u0435\u0442\u0441\u044f \u0432 <\/strong><code>\"use strict\"<\/code>, \u0442\u043e \u0442\u043e\u0433\u0434\u0430 <code>this<\/code> \u0432\u0441\u0435\u0433\u0434\u0430 \u0441\u0432\u044f\u0437\u0430\u043d \u0441 \u0442\u0435\u043c \u0441 \u0447\u0435\u043c \u043e\u043d \u0438 \u0431\u044b\u043b \u0441\u0432\u044f\u0437\u0430\u043d \u0431\u0435\u0437 \u043d\u0435 \u044f\u0432\u043d\u044b\u0445 \u043f\u0440\u0435\u043e\u0431\u0440\u0430\u0437\u043e\u0432\u0430\u043d\u0438\u0439.<\/p>\n<p><strong>\u0412 \u043d\u0435 <\/strong><code>strict<\/code> \u0440\u0435\u0436\u0438\u043c\u0435 <code>this<\/code> \u0432\u0441\u0435\u0433\u0434\u0430 \u043f\u0440\u043e\u0445\u043e\u0434\u0438\u0442 \u0447\u0435\u0440\u0435\u0437 \u043e\u0431\u044a\u0435\u043a\u0442-\u043e\u0431\u0435\u0440\u0442\u043a\u0443.<\/p>\n<hr\/>\n<h2>\u041a\u043b\u0430\u0441\u0441\u044b, \u043e\u0431\u044a\u0435\u043a\u0442\u044b \u0438 this<\/h2>\n<h3>this \u0432\u043d\u0443\u0442\u0440\u0438 \u043e\u0431\u044a\u0435\u043a\u0442\u0430:<\/h3>\n<p>\u041a\u043e\u0433\u0434\u0430 \u043c\u0435\u0442\u043e\u0434 \u0432\u044b\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u0438\u0437 \u043e\u0431\u044a\u0435\u043a\u0442\u0430, <code>this<\/code> \u0441\u0441\u044b\u043b\u0430\u0435\u0442\u0441\u044f \u043d\u0430 \u0441\u0430\u043c \u043e\u0431\u044a\u0435\u043a\u0442, \u043a \u043a\u043e\u0442\u043e\u0440\u043e\u043c\u0443 \u044d\u0442\u043e\u0442 \u043c\u0435\u0442\u043e\u0434 \u043f\u0440\u0438\u043d\u0430\u0434\u043b\u0435\u0436\u0438\u0442. \u042d\u0442\u043e \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043e\u0431\u0440\u0430\u0449\u0430\u0442\u044c\u0441\u044f \u043a \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430\u043c \u043e\u0431\u044a\u0435\u043a\u0442\u0430 \u0432\u043d\u0443\u0442\u0440\u0438 \u0435\u0433\u043e \u043c\u0435\u0442\u043e\u0434\u043e\u0432.<\/p>\n<pre><code class=\"javascript\">\/\/ \u041f\u0440\u0438\u043c\u0435\u0440 \u043e\u0431\u044a\u0435\u043a\u0442\u0430 \u0441 \u043c\u0435\u0442\u043e\u0434\u0430\u043c\u0438 const user = {   name: \"John\",   greet: function() {     console.log(`Hello, ${this.name}!`);   },   updateName: function(newName) {     this.name = newName;     console.log(`Name updated to ${this.name}`);   } };  user.greet(); \/\/ \u0412\u044b\u0432\u043e\u0434: Hello, John! user.updateName(\"Alice\"); \/\/ \u0412\u044b\u0432\u043e\u0434: Name updated to Alice user.greet(); \/\/ \u0412\u044b\u0432\u043e\u0434: Hello, Alice!<\/code><\/pre>\n<p>\u0417\u0434\u0435\u0441\u044c \u043c\u0435\u0442\u043e\u0434\u044b <code>greet<\/code> \u0438 <code>updateName<\/code> \u043e\u0431\u044a\u0435\u043a\u0442\u0430 <code>user<\/code> \u043c\u043e\u0433\u0443\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c <code>this<\/code>, \u0447\u0442\u043e\u0431\u044b \u043f\u043e\u043b\u0443\u0447\u0438\u0442\u044c \u0434\u043e\u0441\u0442\u0443\u043f \u043a \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0443 <code>name<\/code> \u043e\u0431\u044a\u0435\u043a\u0442\u0430 \u0438 \u0438\u0437\u043c\u0435\u043d\u0438\u0442\u044c \u0435\u0433\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435.<\/p>\n<hr\/>\n<h3>\u0418\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 this \u0432\u043e \u0432\u043b\u043e\u0436\u0435\u043d\u043d\u044b\u0445 \u043e\u0431\u044a\u0435\u043a\u0442\u0430\u0445:<\/h3>\n<p>\u041a\u043e\u0433\u0434\u0430 \u043e\u0431\u044a\u0435\u043a\u0442 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u0432\u043b\u043e\u0436\u0435\u043d\u043d\u044b\u0435 \u043e\u0431\u044a\u0435\u043a\u0442\u044b \u0438 \u043c\u0435\u0442\u043e\u0434\u044b, <code>this<\/code> \u0432\u0441\u0435 \u0435\u0449\u0435 \u0441\u0441\u044b\u043b\u0430\u0435\u0442\u0441\u044f \u043d\u0430 \u043e\u0431\u044a\u0435\u043a\u0442, \u0438\u0437 \u043a\u043e\u0442\u043e\u0440\u043e\u0433\u043e \u0431\u044b\u043b \u0432\u044b\u0437\u0432\u0430\u043d \u043c\u0435\u0442\u043e\u0434, \u0430 \u043d\u0435 \u043d\u0430 \u043e\u0431\u044a\u0435\u043a\u0442, \u0441\u043e\u0434\u0435\u0440\u0436\u0430\u0449\u0438\u0439 \u0432\u043b\u043e\u0436\u0435\u043d\u043d\u044b\u0439 \u043c\u0435\u0442\u043e\u0434.<\/p>\n<pre><code class=\"javascript\">\/\/ \u041f\u0440\u0438\u043c\u0435\u0440 \u043e\u0431\u044a\u0435\u043a\u0442\u0430 \u0441 \u0432\u043b\u043e\u0436\u0435\u043d\u043d\u044b\u043c \u043c\u0435\u0442\u043e\u0434\u043e\u043c const school = {   name: \"ABC School\",   classroom: {     number: 101,     displayInfo: function() {       console.log(`Classroom ${this.number} at ${school.name}`);     }   } };  school.classroom.displayInfo(); \/\/ \u0412\u044b\u0432\u043e\u0434: Classroom 101 at ABC School<\/code><\/pre>\n<p>\u0417\u0434\u0435\u0441\u044c \u043c\u0435\u0442\u043e\u0434 <code>displayInfo<\/code>, \u043d\u0430\u0445\u043e\u0434\u044f\u0441\u044c \u0432\u043d\u0443\u0442\u0440\u0438 \u043e\u0431\u044a\u0435\u043a\u0442\u0430 <code>classroom<\/code>, \u0432\u0441\u0435 \u0440\u0430\u0432\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442 <code>this<\/code> \u0434\u043b\u044f \u0434\u043e\u0441\u0442\u0443\u043f\u0430 \u043a \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0443 <code>number<\/code> \u043e\u0431\u044a\u0435\u043a\u0442\u0430 <code>classroom<\/code> \u0438 \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0443 <code>name<\/code> \u043e\u0431\u044a\u0435\u043a\u0442\u0430 <code>school<\/code>.<\/p>\n<hr\/>\n<h3>\u041a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0442\u043e\u0440\u044b<\/h3>\n<p>\u041a\u043e\u0433\u0434\u0430 \u0444\u0443\u043d\u043a\u0446\u0438\u044f \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0432 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u043a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0442\u043e\u0440\u0430 (\u0441\u00a0<code>new<\/code>), \u0442\u043e\u00a0<code>this<\/code>\u00a0\u043f\u0440\u0438\u0432\u044f\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u043a \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u0435\u043c\u043e\u043c\u0443 \u043d\u043e\u0432\u043e\u043c\u0443 \u043e\u0431\u044a\u0435\u043a\u0442\u0443, \u043d\u0435\u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e \u043e\u0442 \u0442\u043e\u0433\u043e, \u043a \u043a\u0430\u043a\u043e\u043c\u0443 \u043e\u0431\u044a\u0435\u043a\u0442\u0443 \u043e\u0441\u0443\u0449\u0435\u0441\u0442\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0434\u043e\u0441\u0442\u0443\u043f \u043a \u0444\u0443\u043d\u043a\u0446\u0438\u0438-\u043a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0442\u043e\u0440\u0443.<\/p>\n<p>\u0417\u043d\u0430\u0447\u0435\u043d\u0438\u0435\u00a0<code>this<\/code>\u00a0\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u0441\u044f \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435\u043c\u00a0<code>new<\/code>\u00a0\u0432\u044b\u0440\u0430\u0436\u0435\u043d\u0438\u044f, \u0435\u0441\u043b\u0438 \u0442\u043e\u043b\u044c\u043a\u043e \u043a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0442\u043e\u0440 \u043d\u0435 \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u0442 \u0434\u0440\u0443\u0433\u043e\u0435 \u043d\u0435 \u043f\u0440\u0438\u043c\u0438\u0442\u0438\u0432\u043d\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435.<\/p>\n<pre><code class=\"javascript\">function C() {   this.a = 37; }  let o = new C(); console.log(o.a); \/\/ 37   function C2() {   this.a = 37;   return { a: 38 }; }  o = new C2();  console.log(o.a); \/\/ 38<\/code><\/pre>\n<p>\u0412\u043e \u0432\u0442\u043e\u0440\u043e\u043c \u043f\u0440\u0438\u043c\u0435\u0440\u0435 (<code>C2<\/code>), \u043f\u043e\u0441\u043a\u043e\u043b\u044c\u043a\u0443 \u043e\u0431\u044a\u0435\u043a\u0442 \u0431\u044b\u043b \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0435\u043d \u0432\u043e \u0432\u0440\u0435\u043c\u044f \u043a\u043e\u043d\u0441\u0442\u0440\u0443\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f, \u043d\u043e\u0432\u044b\u0439 \u043e\u0431\u044a\u0435\u043a\u0442, \u043a \u043a\u043e\u0442\u043e\u0440\u043e\u043c\u0443\u00a0<code>this<\/code>\u00a0\u0431\u044b\u043b \u043f\u0440\u0438\u0432\u044f\u0437\u0430\u043d, \u043e\u0442\u0431\u0440\u0430\u0441\u044b\u0432\u0430\u0435\u0442\u0441\u044f.<\/p>\n<p>\u041f\u043e \u0441\u0443\u0442\u0438, \u044d\u0442\u043e \u0434\u0435\u043b\u0430\u0435\u0442 \u043e\u043f\u0435\u0440\u0430\u0442\u043e\u0440\u00a0<code>this.a = 37;<\/code>\u00a0\u043c\u0435\u0440\u0442\u0432\u044b\u043c \u043a\u043e\u0434\u043e\u043c.\u00a0\u041e\u043d \u043d\u0435 \u0441\u043e\u0432\u0441\u0435\u043c \u043c\u0435\u0440\u0442\u0432, \u043f\u043e\u0442\u043e\u043c\u0443 \u0447\u0442\u043e \u0432\u044b\u043f\u043e\u043b\u043d\u044f\u0435\u0442\u0441\u044f, \u043d\u043e \u0435\u0433\u043e \u043c\u043e\u0436\u043d\u043e \u0443\u0441\u0442\u0440\u0430\u043d\u0438\u0442\u044c \u0431\u0435\u0437 \u043a\u0430\u043a\u0438\u0445-\u043b\u0438\u0431\u043e \u0432\u043d\u0435\u0448\u043d\u0438\u0445 \u044d\u0444\u0444\u0435\u043a\u0442\u043e\u0432.<\/p>\n<hr\/>\n<h3>super()<\/h3>\n<p>\u041a\u043e\u0433\u0434\u0430 \u0444\u0443\u043d\u043a\u0446\u0438\u044f \u0432\u044b\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u0432 \u0444\u043e\u0440\u043c\u0435 <code>super.method()<\/code> \u0432 JavaScript, \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 <code>this<\/code> \u0432\u043d\u0443\u0442\u0440\u0438 \u044d\u0442\u043e\u0439 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u0431\u0443\u0434\u0435\u0442 \u0442\u0430\u043a\u0438\u043c \u0436\u0435, \u043a\u0430\u043a \u0438 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 <code>this<\/code> \u0432\u043e\u043a\u0440\u0443\u0433 \u0432\u044b\u0437\u043e\u0432\u0430 <code>super.method()<\/code>, \u0438 \u043e\u0431\u044b\u0447\u043d\u043e \u043d\u0435 \u0431\u0443\u0434\u0435\u0442 \u0440\u0430\u0432\u043d\u043e \u043e\u0431\u044a\u0435\u043a\u0442\u0443, \u043d\u0430 \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0441\u0441\u044b\u043b\u0430\u0435\u0442\u0441\u044f <code>super<\/code>. \u042d\u0442\u043e \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u043f\u043e\u0442\u043e\u043c\u0443, \u0447\u0442\u043e <code>super.method<\/code> \u043d\u0435 \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0434\u043e\u0441\u0442\u0443\u043f\u043e\u043c \u043a \u0447\u043b\u0435\u043d\u0443 \u043e\u0431\u044a\u0435\u043a\u0442\u0430, \u043a\u0430\u043a \u0432 \u043f\u0440\u0438\u043c\u0435\u0440\u0430\u0445 \u0432\u044b\u0448\u0435 &#8212; \u044d\u0442\u043e \u0441\u043f\u0435\u0446\u0438\u0430\u043b\u044c\u043d\u044b\u0439 \u0441\u0438\u043d\u0442\u0430\u043a\u0441\u0438\u0441 \u0441 \u0434\u0440\u0443\u0433\u0438\u043c\u0438 \u043f\u0440\u0430\u0432\u0438\u043b\u0430\u043c\u0438 \u043f\u0440\u0438\u0432\u044f\u0437\u043a\u0438.<\/p>\n<pre><code class=\"javascript\">class Parent {   showThis() {     console.log(this);   } }  class Child extends Parent {   showParentThis() {     super.showThis();   } }  const instance = new Child();  instance.showParentThis(); \/\/ Child {}<\/code><\/pre>\n<p>\u0412 \u044d\u0442\u043e\u043c \u043f\u0440\u0438\u043c\u0435\u0440\u0435 \u043f\u0440\u0438 \u0432\u044b\u0437\u043e\u0432\u0435 <code>instance.showParentThis()<\/code>, <code>super.showThis()<\/code> \u0432\u044b\u0437\u044b\u0432\u0430\u0435\u0442 \u043c\u0435\u0442\u043e\u0434 <code>showThis()<\/code> \u0438\u0437 \u0440\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u0433\u043e \u043a\u043b\u0430\u0441\u0441\u0430, \u043d\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 <code>this<\/code> \u0432\u043d\u0443\u0442\u0440\u0438 <code>showThis()<\/code> \u0431\u0443\u0434\u0435\u0442 \u0442\u0430\u043a\u0438\u043c \u0436\u0435, \u043a\u0430\u043a \u0438 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 <code>this<\/code> \u0432\u043d\u0443\u0442\u0440\u0438 <code>instance.showParentThis()<\/code>. \u0422\u043e \u0435\u0441\u0442\u044c, \u043e\u043d\u043e \u0431\u0443\u0434\u0435\u0442 \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u0442\u044c \u043d\u0430 \u044d\u043a\u0437\u0435\u043c\u043f\u043b\u044f\u0440 \u043a\u043b\u0430\u0441\u0441\u0430 <code>Child<\/code>, \u0430 \u043d\u0435 \u043d\u0430 \u0441\u0430\u043c \u043e\u0431\u044a\u0435\u043a\u0442, \u043d\u0430 \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0441\u0441\u044b\u043b\u0430\u0435\u0442\u0441\u044f <code>super<\/code>.<\/p>\n<hr\/>\n<h3>\u041a\u043e\u043d\u0442\u0435\u043a\u0441\u0442 \u043a\u043b\u0430\u0441\u0441\u0430<\/h3>\n<p>\u041a\u043e\u0433\u0434\u0430 \u043c\u044b \u0433\u043e\u0432\u043e\u0440\u0438\u043c \u043e <code>this<\/code> \u0432 JavaScript \u0432 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u0435 \u043a\u043b\u0430\u0441\u0441\u043e\u0432, \u0435\u0441\u0442\u044c \u0434\u0432\u0430 \u0432\u0430\u0436\u043d\u044b\u0445 \u043c\u043e\u043c\u0435\u043d\u0442\u0430: <strong>\u0441\u0442\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u0439<\/strong> \u0438 <strong>\u044d\u043a\u0437\u0435\u043c\u043f\u043b\u044f\u0440\u043d\u044b\u0439 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u044b<\/strong>.<\/p>\n<p>\u041a\u043b\u044e\u0447\u0435\u0432\u043e\u0435 \u0441\u043b\u043e\u0432\u043e <code>this<\/code> \u0432 JavaScript \u0438\u043c\u0435\u0435\u0442 \u0440\u0430\u0437\u043d\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0432 \u043a\u0430\u0436\u0434\u043e\u043c \u0438\u0437 \u044d\u0442\u0438\u0445 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u043e\u0432.<\/p>\n<p><strong>\u042d\u043a\u0437\u0435\u043c\u043f\u043b\u044f\u0440\u043d\u044b\u0439 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442<\/strong> \u043e\u0442\u043d\u043e\u0441\u0438\u0442\u0441\u044f \u043a \u043a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0442\u043e\u0440\u0430\u043c, \u043c\u0435\u0442\u043e\u0434\u0430\u043c \u0438 \u043d\u0430\u0447\u0430\u043b\u044c\u043d\u044b\u043c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f\u043c \u0434\u043b\u044f \u043e\u0431\u044a\u0435\u043a\u0442\u043e\u0432 (<strong>public<\/strong>\u00a0\u0438\u043b\u0438\u00a0<strong>private<\/strong>). \u0412 \u044d\u0442\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435 <code>this<\/code> \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u0442 \u043d\u0430 \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u0435\u043c\u044b\u0439 \u044d\u043a\u0437\u0435\u043c\u043f\u043b\u044f\u0440 \u043a\u043b\u0430\u0441\u0441\u0430.<\/p>\n<pre><code class=\"javascript\">class Example {   constructor(value) {     this.instanceValue = value; \/\/ this \u0441\u0441\u044b\u043b\u0430\u0435\u0442\u0441\u044f \u043d\u0430 \u0441\u043e\u0437\u0434\u0430\u043d\u043d\u044b\u0439 \u044d\u043a\u0437\u0435\u043c\u043f\u043b\u044f\u0440 \u043a\u043b\u0430\u0441\u0441\u0430   }      instanceMethod() {     console.log(this === exampleInstance); \/\/ this \u0441\u0441\u044b\u043b\u0430\u0435\u0442\u0441\u044f \u043d\u0430 \u044d\u043a\u0437\u0435\u043c\u043f\u043b\u044f\u0440 \u043a\u043b\u0430\u0441\u0441\u0430 Example   } }  const exampleInstance = new Example(10);  exampleInstance.instanceMethod(); \/\/ true<\/code><\/pre>\n<p>\u0412 \u0434\u0430\u043d\u043d\u043e\u043c \u043f\u0440\u0438\u043c\u0435\u0440\u0435 \u043c\u044b \u0432\u0438\u0434\u0438\u043c, \u0447\u0442\u043e <code>this<\/code> \u0440\u0430\u0432\u0435\u043d \u0438\u043d\u0441\u0442\u0430\u043d\u0441\u0443 <code>exampleInstance<\/code><\/p>\n<p><strong>\u0421\u0442\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u0439 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442<\/strong> \u043a\u0430\u0441\u0430\u0435\u0442\u0441\u044f \u0441\u0442\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u0445 \u043c\u0435\u0442\u043e\u0434\u043e\u0432, \u043d\u0430\u0447\u0430\u043b\u044c\u043d\u044b\u0445 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0439 \u0441\u0442\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u0445 \u043f\u043e\u043b\u0435\u0439 \u0438 \u0431\u043b\u043e\u043a\u043e\u0432 \u0441\u0442\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u043e\u0439 \u0438\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438. \u0417\u0434\u0435\u0441\u044c <code>this<\/code> \u043e\u0442\u043b\u0438\u0447\u0430\u0435\u0442\u0441\u044f, \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u044f \u043d\u0430 \u0441\u0430\u043c \u043a\u043b\u0430\u0441\u0441 (\u0438\u043b\u0438 \u043f\u043e\u0434\u043a\u043b\u0430\u0441\u0441), \u0430 \u043d\u0435 \u043d\u0430 \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u043d\u044b\u0439 \u044d\u043a\u0437\u0435\u043c\u043f\u043b\u044f\u0440.<\/p>\n<pre><code class=\"javascript\">class Example {   constructor(value) {     this.instanceValue = value; \/\/ this \u0441\u0441\u044b\u043b\u0430\u0435\u0442\u0441\u044f \u043d\u0430 \u0441\u043e\u0437\u0434\u0430\u043d\u043d\u044b\u0439 \u044d\u043a\u0437\u0435\u043c\u043f\u043b\u044f\u0440 \u043a\u043b\u0430\u0441\u0441\u0430   }      static staticMethod() {     console.log(this === Example); \/\/ this \u0441\u0441\u044b\u043b\u0430\u0435\u0442\u0441\u044f \u043d\u0430 \u0441\u0430\u043c \u043a\u043b\u0430\u0441\u0441 Example   } }  const exampleInstance = new Example(10);  Example.staticMethod(); \/\/ true<\/code><\/pre>\n<p>\u0412 \u0434\u0430\u043d\u043d\u043e\u043c \u043f\u0440\u0438\u043c\u0435\u0440\u0435 \u043c\u044b \u0432\u0438\u0434\u0438\u043c, \u0447\u0442\u043e <code>this<\/code> \u0440\u0430\u0432\u0435\u043d \u043a\u043b\u0430\u0441\u0441\u0443 <code>Example<\/code><\/p>\n<p><strong>\u041a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0442\u043e\u0440\u044b \u043a\u043b\u0430\u0441\u0441\u043e\u0432<\/strong> \u0432 JavaScript \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0442\u0441\u044f \u0434\u043b\u044f \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u043d\u043e\u0432\u044b\u0445 \u043e\u0431\u044a\u0435\u043a\u0442\u043e\u0432. \u041a\u043e\u0433\u0434\u0430 \u043c\u044b \u0441\u043e\u0437\u0434\u0430\u0435\u043c \u043d\u043e\u0432\u044b\u0439 \u043e\u0431\u044a\u0435\u043a\u0442 \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u043a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0442\u043e\u0440\u0430 \u043a\u043b\u0430\u0441\u0441\u0430 (\u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u043a\u043b\u044e\u0447\u0435\u0432\u043e\u0433\u043e \u0441\u043b\u043e\u0432\u0430 <code>new<\/code>), \u043a\u043b\u044e\u0447\u0435\u0432\u043e\u0435 \u0441\u043b\u043e\u0432\u043e <code>this<\/code> \u0432\u043d\u0443\u0442\u0440\u0438 \u044d\u0442\u043e\u0433\u043e \u043a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0442\u043e\u0440\u0430 \u043e\u0442\u043d\u043e\u0441\u0438\u0442\u0441\u044f \u043a \u043d\u043e\u0432\u043e\u043c\u0443 \u043e\u0431\u044a\u0435\u043a\u0442\u0443, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043c\u044b \u0441\u043e\u0437\u0434\u0430\u0435\u043c.<\/p>\n<pre><code class=\"javascript\">class Animal {   constructor(name) {     this.name = name;   } }  const myAnimal = new Animal('Leo');  console.log(myAnimal.name); \/\/ \u0412\u044b\u0432\u043e\u0434: 'Leo'<\/code><\/pre>\n<p><strong>\u041c\u0435\u0442\u043e\u0434\u044b \u043a\u043b\u0430\u0441\u0441\u0430<\/strong> \u0440\u0430\u0431\u043e\u0442\u0430\u044e\u0442 \u043a\u0430\u043a \u0444\u0443\u043d\u043a\u0446\u0438\u0438, \u043f\u0440\u0438\u0432\u044f\u0437\u0430\u043d\u043d\u044b\u0435 \u043a \u043e\u0431\u044a\u0435\u043a\u0442\u0430\u043c. \u041a\u043e\u0433\u0434\u0430 \u043c\u044b \u0432\u044b\u0437\u044b\u0432\u0430\u0435\u043c \u043c\u0435\u0442\u043e\u0434 \u043e\u0431\u044a\u0435\u043a\u0442\u0430, \u043a\u043b\u044e\u0447\u0435\u0432\u043e\u0435 \u0441\u043b\u043e\u0432\u043e <code>this<\/code> \u043e\u0442\u043d\u043e\u0441\u0438\u0442\u0441\u044f \u043a \u0441\u0430\u043c\u043e\u043c\u0443 \u043e\u0431\u044a\u0435\u043a\u0442\u0443, \u043a \u043a\u043e\u0442\u043e\u0440\u043e\u043c\u0443 \u043c\u044b \u043e\u0431\u0440\u0430\u0449\u0430\u0435\u043c\u0441\u044f \u0447\u0435\u0440\u0435\u0437 \u0442\u043e\u0447\u043a\u0443.<\/p>\n<pre><code class=\"javascript\">class Counter {   constructor() {     this.count = 0;   }    increase() {     this.count++;   } }  const myCounter = new Counter();  myCounter.increase();  console.log(myCounter.count); \/\/ \u0412\u044b\u0432\u043e\u0434: 1<\/code><\/pre>\n<p><strong>\u0421\u0442\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u043c\u0435\u0442\u043e\u0434\u044b<\/strong> \u043f\u0440\u0438\u043d\u0430\u0434\u043b\u0435\u0436\u0430\u0442 \u0441\u0430\u043c\u043e\u043c\u0443 \u043a\u043b\u0430\u0441\u0441\u0443, \u0430 \u043d\u0435 \u0435\u0433\u043e \u044d\u043a\u0437\u0435\u043c\u043f\u043b\u044f\u0440\u0430\u043c. \u041a\u043e\u0433\u0434\u0430 \u043c\u044b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c \u0441\u0442\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u0439 \u043c\u0435\u0442\u043e\u0434, \u043a\u043b\u044e\u0447\u0435\u0432\u043e\u0435 \u0441\u043b\u043e\u0432\u043e <code>this<\/code> \u043e\u0442\u043d\u043e\u0441\u0438\u0442\u0441\u044f \u043a \u0441\u0430\u043c\u043e\u043c\u0443 \u043a\u043b\u0430\u0441\u0441\u0443, \u0430 \u043d\u0435 \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u043d\u043e\u043c\u0443 \u044d\u043a\u0437\u0435\u043c\u043f\u043b\u044f\u0440\u0443.<\/p>\n<pre><code class=\"javascript\">class Calculator {   static add(a, b) {     return a + b;   } }  console.log(Calculator.add(2, 3)); \/\/ \u0412\u044b\u0432\u043e\u0434: 5<\/code><\/pre>\n<p>\u0418\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0442\u043e\u0440\u044b \u043f\u043e\u043b\u0435\u0439 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0442\u0441\u044f \u0434\u043b\u044f \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0438 \u043d\u0430\u0447\u0430\u043b\u044c\u043d\u044b\u0445 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0439 \u0441\u0432\u043e\u0439\u0441\u0442\u0432 \u043e\u0431\u044a\u0435\u043a\u0442\u0430 \u043f\u0440\u0438 \u0435\u0433\u043e \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u0438. \u041a\u043e\u0433\u0434\u0430 \u043c\u044b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c \u0438\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0442\u043e\u0440\u044b \u043f\u043e\u043b\u0435\u0439, \u043a\u043b\u044e\u0447\u0435\u0432\u043e\u0435 \u0441\u043b\u043e\u0432\u043e <code>this<\/code> \u043e\u0442\u043d\u043e\u0441\u0438\u0442\u0441\u044f \u043a \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u0435\u043c\u043e\u043c\u0443 \u043e\u0431\u044a\u0435\u043a\u0442\u0443 \u0438\u043b\u0438 \u043a\u043b\u0430\u0441\u0441\u0443 \u0434\u043b\u044f \u0441\u0442\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u0445 \u043f\u043e\u043b\u0435\u0439.<\/p>\n<pre><code class=\"javascript\">class Rectangle {   static defaultWidth = 100;   height;      constructor(height) {     this.height = height;   }      getArea() {     return Rectangle.defaultWidth * this.height;   } }  const myRect = new Rectangle(20);  console.log(myRect.getArea()); \/\/ \u0412\u044b\u0432\u043e\u0434: 2000<\/code><\/pre>\n<p>\u0424\u0443\u043d\u043a\u0446\u0438\u0438 \u0441\u043e \u0441\u0442\u0440\u0435\u043b\u043a\u0430\u043c\u0438 \u0432 \u0438\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0442\u043e\u0440\u0430\u0445 \u043f\u043e\u043b\u0435\u0439 \u0441\u0432\u044f\u0437\u0430\u043d\u044b \u0441 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u043e\u043c \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u043e\u0431\u044a\u0435\u043a\u0442\u0430 \u0434\u043b\u044f \u043f\u043e\u043b\u0435\u0439 \u044d\u043a\u0437\u0435\u043c\u043f\u043b\u044f\u0440\u0430 \u0438 \u0441 \u043a\u043b\u0430\u0441\u0441\u043e\u043c \u0434\u043b\u044f \u0441\u0442\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u0445 \u043f\u043e\u043b\u0435\u0439.<\/p>\n<pre><code class=\"javascript\">class Person {   #age;    constructor(name, age) {     this.name = name;     this.#age = age;     this.greet = () =&amp;gt; {       return `Hello, my name is ${this.name} and I am ${this.#age} years old.`;     };   }      static introduce() {     return \"I am a person!\";   } }  const john = new Person(\"John\", 30);  console.log(john.greet()); \/\/ \u0412\u044b\u0432\u043e\u0434: \"Hello, my name is John and I am 30 years old.\" console.log(Person.introduce()); \/\/ \u0412\u044b\u0432\u043e\u0434: \"I am a person!\"<\/code><\/pre>\n<p>\u0417\u0434\u0435\u0441\u044c \u0443 \u043a\u043b\u0430\u0441\u0441\u0430 <code>Person<\/code> \u0435\u0441\u0442\u044c \u043f\u043e\u043b\u0435 <code>name<\/code>, \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u0443\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u0435\u0442\u0441\u044f \u0432 \u043a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0442\u043e\u0440\u0435. \u041c\u044b \u0442\u0430\u043a\u0436\u0435 \u0441\u043e\u0437\u0434\u0430\u0435\u043c \u043c\u0435\u0442\u043e\u0434 <code>greet<\/code>, \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044f \u0441\u0442\u0440\u0435\u043b\u043e\u0447\u043d\u0443\u044e \u0444\u0443\u043d\u043a\u0446\u0438\u044e \u0432\u043d\u0443\u0442\u0440\u0438 \u0438\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0442\u043e\u0440\u0430 \u043f\u043e\u043b\u044f. \u042d\u0442\u043e\u0442 \u043c\u0435\u0442\u043e\u0434 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f <code>name<\/code> \u0438 <code>#age<\/code>, \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043b\u0435\u043d\u043d\u044b\u0435 \u043f\u0440\u0438 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u0438 \u044d\u043a\u0437\u0435\u043c\u043f\u043b\u044f\u0440\u0430, \u0447\u0442\u043e\u0431\u044b \u0441\u0444\u043e\u0440\u043c\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043f\u0440\u0438\u0432\u0435\u0442\u0441\u0442\u0432\u0438\u0435 \u0441 \u0438\u043c\u0435\u043d\u0435\u043c \u0438 \u0432\u043e\u0437\u0440\u0430\u0441\u0442\u043e\u043c \u043e\u0431\u044a\u0435\u043a\u0442\u0430 <code>Person<\/code>.<\/p>\n<p>\u0422\u0430\u043a\u0436\u0435 \u0435\u0441\u0442\u044c \u0441\u0442\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u0439 \u043c\u0435\u0442\u043e\u0434 <code>introduce<\/code>, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043f\u0440\u043e\u0441\u0442\u043e \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u0442 \u0441\u0442\u0440\u043e\u043a\u0443, \u0438 \u0432 \u0434\u0430\u043d\u043d\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u043e\u043d \u043f\u0440\u0438\u043d\u0430\u0434\u043b\u0435\u0436\u0438\u0442 \u0441\u0430\u043c\u043e\u043c\u0443 \u043a\u043b\u0430\u0441\u0441\u0443, \u0430 \u043d\u0435 \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u043d\u043e\u043c\u0443 \u044d\u043a\u0437\u0435\u043c\u043f\u043b\u044f\u0440\u0443.<\/p>\n<hr\/>\n<h3>\u041a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0442\u043e\u0440\u044b \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u043d\u044b\u0445 \u043a\u043b\u0430\u0441\u0441\u043e\u0432<\/h3>\n<p><strong>\u041f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u043d\u044b\u0439 \u043a\u043b\u0430\u0441\u0441<\/strong> &#8212; \u044d\u0442\u043e \u043a\u043b\u0430\u0441\u0441, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043d\u0430\u0441\u043b\u0435\u0434\u0443\u0435\u0442 \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430 \u0438 \u043c\u0435\u0442\u043e\u0434\u044b \u043e\u0442 \u0434\u0440\u0443\u0433\u043e\u0433\u043e \u043a\u043b\u0430\u0441\u0441\u0430, \u043d\u0430\u0437\u044b\u0432\u0430\u0435\u043c\u043e\u0433\u043e \u0431\u0430\u0437\u043e\u0432\u044b\u043c \u043a\u043b\u0430\u0441\u0441\u043e\u043c \u0438\u043b\u0438 \u0440\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u043c \u043a\u043b\u0430\u0441\u0441\u043e\u043c.<\/p>\n<p>\u041a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0442\u043e\u0440\u044b \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u043d\u044b\u0445 \u043a\u043b\u0430\u0441\u0441\u043e\u0432 \u0432 JavaScript \u043e\u0442\u043b\u0438\u0447\u0430\u044e\u0442\u0441\u044f \u043e\u0442 \u043a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0442\u043e\u0440\u043e\u0432 \u0431\u0430\u0437\u043e\u0432\u043e\u0433\u043e \u043a\u043b\u0430\u0441\u0441\u0430 \u0442\u0435\u043c, \u0447\u0442\u043e \u043e\u043d\u0438 \u043d\u0435 \u0438\u043c\u0435\u044e\u0442 \u043d\u0430\u0447\u0430\u043b\u044c\u043d\u043e\u0439 \u0441\u0432\u044f\u0437\u0438 \u0441 <code>this<\/code>. \u041f\u0440\u0438 \u0432\u044b\u0437\u043e\u0432\u0435 <code>super()<\/code> \u0441\u043e\u0437\u0434\u0430\u0435\u0442\u0441\u044f \u0441\u0432\u044f\u0437\u044c \u0441 <code>this<\/code> \u0432\u043d\u0443\u0442\u0440\u0438 \u043a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0442\u043e\u0440\u0430, \u0447\u0442\u043e \u043f\u043e \u0441\u0443\u0442\u0438 \u044d\u043a\u0432\u0438\u0432\u0430\u043b\u0435\u043d\u0442\u043d\u043e \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044e \u044d\u0442\u043e\u0439 \u0441\u0442\u0440\u043e\u043a\u0438 \u043a\u043e\u0434\u0430, \u0433\u0434\u0435 <code>Base<\/code> &#8212; \u0431\u0430\u0437\u043e\u0432\u044b\u0439 \u043a\u043b\u0430\u0441\u0441:<\/p>\n<pre><code class=\"javascript\">this = new Base();<\/code><\/pre>\n<p>\u0415\u0441\u043b\u0438 \u043e\u0431\u0440\u0430\u0442\u0438\u0442\u044c\u0441\u044f \u043a <code>this<\/code> \u043f\u0435\u0440\u0435\u0434 \u0432\u044b\u0437\u043e\u0432\u043e\u043c <code>super()<\/code>, \u044d\u0442\u043e \u0432\u044b\u0437\u043e\u0432\u0435\u0442 \u043e\u0448\u0438\u0431\u043a\u0443. \u041f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u043d\u044b\u0435 \u043a\u043b\u0430\u0441\u0441\u044b \u043d\u0435 \u0434\u043e\u043b\u0436\u043d\u044b \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0442\u044c \u0434\u0430\u043d\u043d\u044b\u0435 \u043f\u0435\u0440\u0435\u0434 \u0432\u044b\u0437\u043e\u0432\u043e\u043c <code>super()<\/code>, \u0437\u0430 \u0438\u0441\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435\u043c \u0441\u043b\u0443\u0447\u0430\u0435\u0432, \u043a\u043e\u0433\u0434\u0430 \u043a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0442\u043e\u0440 \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u0442 \u043e\u0431\u044a\u0435\u043a\u0442 (\u0438 \u043f\u0435\u0440\u0435\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 <code>this<\/code>) \u0438\u043b\u0438 \u0435\u0441\u043b\u0438 \u0443 \u043a\u043b\u0430\u0441\u0441\u0430 \u0432\u043e\u043e\u0431\u0449\u0435 \u043d\u0435\u0442 \u043a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0442\u043e\u0440\u0430.<\/p>\n<pre><code class=\"javascript\">class Base {}  class Good extends Base {} \/\/ \u041a\u043e\u0440\u0440\u0435\u043a\u0442\u043d\u044b\u0439 \u043f\u0440\u0438\u043c\u0435\u0440, \u043d\u0435\u0442 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e\u0441\u0442\u0438 \u0432 \u044f\u0432\u043d\u043e\u043c \u043a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0442\u043e\u0440\u0435  class AlsoGood extends Base {   constructor() {     return { a: 5 }; \/\/ \u0420\u0430\u0431\u043e\u0442\u0430\u0435\u0442, \u0442\u0430\u043a \u043a\u0430\u043a \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u0442\u0441\u044f \u043e\u0431\u044a\u0435\u043a\u0442, \u043f\u0435\u0440\u0435\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u044f \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 this   } }  class Bad extends Base {   constructor() {} \/\/ \u041d\u0435\u043a\u043e\u0440\u0440\u0435\u043a\u0442\u043d\u043e, \u0432\u044b\u0437\u043e\u0432\u0435\u0442 \u043e\u0448\u0438\u0431\u043a\u0443 \u0438\u0437-\u0437\u0430 \u043e\u0442\u0441\u0443\u0442\u0441\u0442\u0432\u0438\u044f \u0432\u044b\u0437\u043e\u0432\u0430 super() }  new Good(); \/\/ \u041e\u041a new AlsoGood(); \/\/ \u041e\u041a new Bad(); \/\/ \u041e\u0448\u0438\u0431\u043a\u0430: \u041d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0432\u044b\u0437\u0432\u0430\u0442\u044c \u043a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0442\u043e\u0440 \u0440\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u0433\u043e \u043a\u043b\u0430\u0441\u0441\u0430 \u043f\u0435\u0440\u0435\u0434 \u0434\u043e\u0441\u0442\u0443\u043f\u043e\u043c \u043a 'this' \u0438\u043b\u0438 \u0432\u043e\u0437\u0432\u0440\u0430\u0442\u043e\u043c \u0438\u0437 \u043a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0442\u043e\u0440\u0430 \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u043d\u043e\u0433\u043e \u043a\u043b\u0430\u0441\u0441\u0430<\/code><\/pre>\n<hr\/>\n<h2>\u041f\u0440\u0438\u043c\u0435\u0440\u044b \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u044f this<\/h2>\n<h3>\u0417\u0430\u0434\u0430\u0447\u0430 1: \u041d\u043e\u0440\u043c\u0430\u043b\u044c\u043d\u0430\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u044f \u0438 \u0441\u0442\u0440\u0435\u043b\u043e\u0447\u043d\u0430\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u044f \u0432 \u043e\u0431\u044a\u0435\u043a\u0442\u0435<\/h3>\n<pre><code class=\"javascript\">const obj = {   regularFunc: function() {     console.log(this);   },      arrowFunc: () => {     console.log(this);   } };  obj.regularFunc(); \/\/ \u041e\u0442\u0432\u0435\u0442: obj (\u0442\u0435\u043a\u0443\u0449\u0438\u0439 \u043e\u0431\u044a\u0435\u043a\u0442) obj.arrowFunc(); \/\/ \u041e\u0442\u0432\u0435\u0442: \u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u044b\u0439 \u043e\u0431\u044a\u0435\u043a\u0442 \u0438\u043b\u0438 undefined (\u0441\u0442\u0440\u0435\u043b\u043e\u0447\u043d\u0430\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u044f \u043d\u0435 \u0438\u043c\u0435\u0435\u0442 \u0441\u043e\u0431\u0441\u0442\u0432\u0435\u043d\u043d\u043e\u0433\u043e this, \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0432\u043d\u0435\u0448\u043d\u0438\u0439 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442)<\/code><\/pre>\n<h3>\u0417\u0430\u0434\u0430\u0447\u0430 2: \u0412\u043d\u0435\u0448\u043d\u0435\u0435 API \u0432 \u043c\u0435\u0442\u043e\u0434\u0435 \u043e\u0431\u044a\u0435\u043a\u0442\u0430<\/h3>\n<pre><code class=\"javascript\">const obj = {   name: 'Alice',      greet: function() {     console.log(`Hello, ${this.name}!`);   },    delayedGreet: function() {     setTimeout(this.greet, 1000);   } };  obj.greet(); \/\/ \u041e\u0442\u0432\u0435\u0442: Hello, Alice! obj.delayedGreet(); \/\/ \u041e\u0442\u0432\u0435\u0442: \"Hello, undefined!\" \u0438\u043b\u0438 \u043e\u0448\u0438\u0431\u043a\u0430 (this \u043f\u043e\u0442\u0435\u0440\u044f\u043d\u043e \u0438\u0437-\u0437\u0430 \u0432\u044b\u0437\u043e\u0432\u0430 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 setTimeout \u0432 \u0434\u0440\u0443\u0433\u043e\u043c \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u0435)<\/code><\/pre>\n<p>\u0412 \u044d\u0442\u043e\u043c \u043f\u0440\u0438\u043c\u0435\u0440\u0435 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442 <code>this<\/code> \u0438\u0437\u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f \u0438\u0437-\u0437\u0430 \u0441\u043f\u0435\u0446\u0438\u0444\u0438\u043a\u0438 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 <code>setTimeout<\/code>.<\/p>\n<p>\u041a\u043e\u0433\u0434\u0430 \u0444\u0443\u043d\u043a\u0446\u0438\u044f <code>this.greet<\/code> \u043f\u0435\u0440\u0435\u0434\u0430\u0435\u0442\u0441\u044f \u0432 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u043a\u043e\u043b\u043b\u0431\u0435\u043a\u0430 \u0434\u043b\u044f <code>setTimeout<\/code>, \u043e\u043d\u0430 \u0442\u0435\u0440\u044f\u0435\u0442 \u0441\u0432\u044f\u0437\u044c \u0441 \u043e\u0431\u044a\u0435\u043a\u0442\u043e\u043c <code>obj<\/code>. \u042d\u0442\u043e \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u043f\u043e\u0442\u043e\u043c\u0443, \u0447\u0442\u043e \u0444\u0443\u043d\u043a\u0446\u0438\u044f <code>setTimeout<\/code> \u0437\u0430\u043f\u0443\u0441\u043a\u0430\u0435\u0442 \u043f\u0435\u0440\u0435\u0434\u0430\u043d\u043d\u0443\u044e \u0444\u0443\u043d\u043a\u0446\u0438\u044e \u0432 \u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u043e\u043c \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u0435 (\u0432 \u043d\u0435\u0441\u0442\u0440\u043e\u0433\u043e\u043c \u0440\u0435\u0436\u0438\u043c\u0435) \u0438\u043b\u0438 \u0432 <code>undefined<\/code> (\u0432 \u0441\u0442\u0440\u043e\u0433\u043e\u043c \u0440\u0435\u0436\u0438\u043c\u0435).<\/p>\n<p>\u0412 \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442\u0435 <code>this<\/code> \u0432\u043d\u0443\u0442\u0440\u0438 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 <code>greet<\/code> \u0431\u043e\u043b\u044c\u0448\u0435 \u043d\u0435 \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u0442 \u043d\u0430 \u043e\u0431\u044a\u0435\u043a\u0442 <code>obj<\/code>.<\/p>\n<p>\u0414\u043b\u044f \u0441\u043e\u0445\u0440\u0430\u043d\u0435\u043d\u0438\u044f \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u0430 \u043c\u043e\u0436\u043d\u043e \u0432\u043e\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c\u0441\u044f \u043c\u0435\u0442\u043e\u0434\u043e\u043c <code>bind()<\/code> \u0438\u043b\u0438 \u0441\u0442\u0440\u0435\u043b\u043e\u0447\u043d\u043e\u0439 \u0444\u0443\u043d\u043a\u0446\u0438\u0435\u0439 \u0434\u043b\u044f \u044f\u0432\u043d\u043e\u0433\u043e \u043f\u0440\u0438\u0432\u044f\u0437\u044b\u0432\u0430\u043d\u0438\u044f \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u0430:<\/p>\n<pre><code class=\"javascript\">const obj = {   name: 'Alice',      greet: function() {     console.log(`Hello, ${this.name}!`);   },      delayedGreet: function() {     setTimeout(this.greet.bind(this), 1000); \/\/ \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 bind() \u0434\u043b\u044f \u0441\u043e\u0445\u0440\u0430\u043d\u0435\u043d\u0438\u044f \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u0430     \/\/ \u0438\u043b\u0438 setTimeout(() => this.greet(), 1000); \/\/ \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 \u0441\u0442\u0440\u0435\u043b\u043e\u0447\u043d\u043e\u0439 \u0444\u0443\u043d\u043a\u0446\u0438\u0438   } };  obj.greet(); \/\/ \u041e\u0442\u0432\u0435\u0442: Hello, Alice! obj.delayedGreet(); \/\/ \u041e\u0442\u0432\u0435\u0442: \"Hello, Alice!\" (\u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442 this \u0441\u043e\u0445\u0440\u0430\u043d\u0435\u043d)<\/code><\/pre>\n<h3>\u0417\u0430\u0434\u0430\u0447\u0430 3: \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 this \u0432 \u043a\u043b\u0430\u0441\u0441\u0435<\/h3>\n<pre><code class=\"javascript\">class Counter {   constructor() {     this.count = 0;   }    increment() {     this.count++;     console.log(this);   } }  const myCounter = new Counter(); myCounter.increment(); \/\/ \u041e\u0442\u0432\u0435\u0442: myCounter (\u044d\u043a\u0437\u0435\u043c\u043f\u043b\u044f\u0440 \u043a\u043b\u0430\u0441\u0441\u0430 Counter)<\/code><\/pre>\n<h3>\u0417\u0430\u0434\u0430\u0447\u0430 4: \u041f\u0440\u0438\u0432\u044f\u0437\u043a\u0430 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u0430 \u0447\u0435\u0440\u0435\u0437 bind()<\/h3>\n<pre><code class=\"javascript\">function greet() {   console.log(`Hello, ${this.name}!`); }  const person = { name: 'John' }; const boundFunc = greet.bind(person);  boundFunc(); \/\/ \u041e\u0442\u0432\u0435\u0442: \"Hello, John!\" (this \u043f\u0440\u0438\u0432\u044f\u0437\u0430\u043d \u043a \u043e\u0431\u044a\u0435\u043a\u0442\u0443 person)<\/code><\/pre>\n<h3>\u0417\u0430\u0434\u0430\u0447\u0430 5: \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 this \u0432 \u0441\u0442\u0440\u0435\u043b\u043e\u0447\u043d\u043e\u0439 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u0432\u043d\u0443\u0442\u0440\u0438 \u043c\u0435\u0442\u043e\u0434\u0430<\/h3>\n<pre><code class=\"javascript\">const obj = {   name: 'Sarah',   sayHi: function() {     const greet = () => {       console.log(Hi, ${this.name}!);     };      greet();   } };  obj.sayHi(); \/\/ \u041e\u0442\u0432\u0435\u0442: \"Hi, Sarah!\" (\u0441\u0442\u0440\u0435\u043b\u043e\u0447\u043d\u0430\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u044f \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442 this \u0440\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u0433\u043e \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u0430)<\/code><\/pre>\n<h3>\u0417\u0430\u0434\u0430\u0447\u0430 6: \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 this \u0432\u043d\u0443\u0442\u0440\u0438 \u043a\u043e\u043b\u043b\u0431\u0435\u043a\u0430 \u0441\u043e\u0431\u044b\u0442\u0438\u044f<\/h3>\n<pre><code class=\"javascript\">const button = document.getElementById('myButton');  button.addEventListener('click', function() {   console.log(this); });  \/\/ \u041e\u0442\u0432\u0435\u0442: DOM \u044d\u043b\u0435\u043c\u0435\u043d\u0442 \u043a\u043d\u043e\u043f\u043a\u0438 (this \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u0442 \u043d\u0430 \u044d\u043b\u0435\u043c\u0435\u043d\u0442, \u043d\u0430 \u043a\u043e\u0442\u043e\u0440\u043e\u043c \u043f\u0440\u043e\u0438\u0437\u043e\u0448\u043b\u043e \u0441\u043e\u0431\u044b\u0442\u0438\u0435)<\/code><\/pre>\n<h3>\u0417\u0430\u0434\u0430\u0447\u0430 7: \u041c\u0435\u0442\u043e\u0434 \u043e\u0431\u044a\u0435\u043a\u0442\u0430, \u0432\u044b\u0437\u0432\u0430\u043d\u043d\u044b\u0439 \u0438\u0437 \u0434\u0440\u0443\u0433\u043e\u0433\u043e \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u0430<\/h3>\n<pre><code class=\"javascript\">const obj = {   name: 'Emma',      greet: function() {     console.log(`Hello, ${this.name}!`);   } };  const anotherObj = { name: 'Jack' };  anotherObj.sayHello = obj.greet; anotherObj.sayHello(); \/\/ \u041e\u0442\u0432\u0435\u0442: \"Hello, Jack!\" (\u043c\u0435\u0442\u043e\u0434 \u0432\u044b\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u0432 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u0435 anotherObj)<\/code><\/pre>\n<h3>\u0417\u0430\u0434\u0430\u0447\u0430 8: \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 this \u0432 \u043a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0442\u043e\u0440\u0435 \u043a\u043b\u0430\u0441\u0441\u0430<\/h3>\n<pre><code class=\"javascript\">class Car {   constructor(make) {     this.make = make;     console.log(this);   } }  const myCar = new Car('Toyota'); \/\/ \u041e\u0442\u0432\u0435\u0442: myCar (\u044d\u043a\u0437\u0435\u043c\u043f\u043b\u044f\u0440 \u043a\u043b\u0430\u0441\u0441\u0430 Car)<\/code><\/pre>\n<h3>\u0417\u0430\u0434\u0430\u0447\u0430 9: \u0412\u044b\u0437\u043e\u0432 \u043c\u0435\u0442\u043e\u0434\u0430 \u0438\u0437 \u043c\u0435\u0442\u043e\u0434\u0430 \u0441 \u0434\u0440\u0443\u0433\u0438\u043c this<\/h3>\n<pre><code class=\"javascript\">const obj = {   name: 'Michael',      greet: function() {     console.log(`Hello, ${this.name}!`);   },      callGreet: function() {     this.greet(); \/\/ \u0432\u044b\u0437\u043e\u0432 \u043c\u0435\u0442\u043e\u0434\u0430 \u0438\u0437 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u0430 \u043e\u0431\u044a\u0435\u043a\u0442\u0430   } };  obj.callGreet(); \/\/ \u041e\u0442\u0432\u0435\u0442: \"Hello, Michael!\" (\u043c\u0435\u0442\u043e\u0434 \u0432\u044b\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u0432 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u0435 \u043e\u0431\u044a\u0435\u043a\u0442\u0430 obj)<\/code><\/pre>\n<h3>\u0417\u0430\u0434\u0430\u0447\u0430 10: \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 this \u0432 \u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u043e\u0439 \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u0432\u0438\u0434\u0438\u043c\u043e\u0441\u0442\u0438<\/h3>\n<pre><code class=\"javascript\">function logThis() {   console.log(this); }  logThis(); \/\/ \u041e\u0442\u0432\u0435\u0442: \u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u044b\u0439 \u043e\u0431\u044a\u0435\u043a\u0442 \u0438\u043b\u0438 undefined (\u0432 \u0441\u0442\u0440\u043e\u0433\u043e\u043c \u0440\u0435\u0436\u0438\u043c\u0435)<\/code><\/pre>\n<hr\/>\n<h2>\u0418\u0442\u043e\u0433\u043e<\/h2>\n<ul>\n<li>\n<p><code>this<\/code> \u0432 JavaScript \u044d\u0442\u043e \u043d\u0435 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442. \u041d\u0438\u043a\u043e\u0433\u0434\u0430 \u0438\u043c \u043d\u0435 \u0431\u044b\u043b \u0438 \u043d\u0435 \u0431\u0443\u0434\u0435\u0442.<\/p>\n<\/li>\n<li>\n<p><code>this<\/code> \u0432 JavaScript \u044d\u0442\u043e \u043e\u0441\u043e\u0431\u044b\u0439 \u0438\u0434\u0435\u043d\u0442\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d \u043b\u043e\u043a\u0430\u043b\u044c\u043d\u043e \u0434\u043b\u044f \u0432\u0441\u0435\u0445 <strong>normal function<\/strong> \u0438 \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e \u0437\u0430\u0434\u0430\u043d \u043a\u0430\u043a <code>undefined<\/code> \u0434\u043b\u044f <code>\u201cstrict mode\u201d<\/code> \u0438\u043b\u0438 \u043a\u0430\u043a <strong>global object<\/strong> \u0434\u043b\u044f <strong>non strict mode<\/strong>.<\/p>\n<\/li>\n<li>\n<p>\u0417\u043d\u0430\u0447\u0435\u043d\u0438\u0435<strong> <\/strong><code>this<\/code> \u0434\u043b\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u0438, \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u043e \u0442\u043e\u043b\u044c\u043a\u043e \u0432 \u043c\u043e\u043c\u0435\u043d\u0442 \u0432\u044b\u0437\u043e\u0432\u0430 \u044d\u0442\u043e\u0439 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u0438 \u0437\u0430\u0432\u0438\u0441\u0438\u0442 \u043e\u0442 \u0444\u043e\u0440\u043c\u044b\/\u0441\u043f\u043e\u0441\u043e\u0431\u0430 \u0435\u0435 \u0432\u044b\u0437\u043e\u0432\u0430.<\/p>\n<\/li>\n<li>\n<p>\u0412\u043d\u0435\u0448\u043d\u0435\u0435 API \u043c\u043e\u0436\u0435\u0442 \u0441\u0432\u044f\u0437\u0430\u0442\u044c <code>this<\/code> \u0441 \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u043b\u044c\u043d\u044b\u043c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435\u043c \u0432 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438 \u043c\u043d\u0435\u043d\u0438\u044f \u0441\u043e\u0437\u0434\u0430\u0442\u0435\u043b\u044f API, \u043d\u043e \u0442\u043e\u043b\u044c\u043a\u043e \u0432 \u0441\u043b\u0443\u0447\u0430\u0435, \u0435\u0441\u043b\u0438 \u044d\u0442\u043e \u0431\u0443\u0434\u0435\u0442 <strong>normal function<\/strong> \u0434\u043b\u044f \u043a\u043e\u0442\u043e\u0440\u043e\u0433\u043e \u043c\u044b \u043d\u0435 \u0437\u0430\u0434\u0430\u043b\u0438 <code>this<\/code> \u043c\u0435\u0442\u043e\u0434\u043e\u0432 <code>call<\/code>, <code>bind<\/code>, <code>apply<\/code>.<\/p>\n<\/li>\n<li>\n<p>\u0427\u0442\u043e\u0431\u044b \u043f\u043e\u043d\u044f\u0442\u044c, \u0447\u0435\u043c\u0443 \u0440\u0430\u0432\u0435\u043d <code>this<\/code>, \u043d\u0443\u0436\u043d\u043e \u0432\u0441\u0435\u0433\u0434\u0430 \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0435\u0442\u044c, \u0433\u0434\u0435 \u0432\u044b\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u044f, \u0432\u043d\u0443\u0442\u0440\u0438 \u043a\u043e\u0442\u043e\u0440\u043e\u0439 \u043c\u044b \u0445\u043e\u0442\u0438\u043c \u0443\u0437\u043d\u0430\u0442\u044c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 <code>this<\/code>.<\/p>\n<p>\u0415\u0441\u043b\u0438 \u043c\u044b \u043d\u0435 \u043d\u0430\u0445\u043e\u0434\u0438\u043c\u0441\u044f \u0432\u043d\u0443\u0442\u0440\u0438 \u0444\u0443\u043d\u043a\u0446\u0438\u0438, \u0442\u043e \u043c\u044b \u043b\u0438\u0431\u043e \u0432 \u0441\u043a\u0440\u0438\u043f\u0442\u0435, \u043b\u0438\u0431\u043e \u0432 \u043c\u043e\u0434\u0443\u043b\u0435.<\/p>\n<p>\u0415\u0441\u043b\u0438 \u043c\u044b \u0432 \u043c\u043e\u0434\u0443\u043b\u0435, \u0442\u043e \u044d\u0442\u043e <code>undefined<\/code><\/p>\n<p>\u0415\u0441\u043b\u0438 \u0432 \u0441\u043a\u0440\u0438\u043f\u0442\u0435, \u0447\u0438\u0442\u0430\u0435\u043c \u0441\u043f\u0435\u0446\u0438\u0444\u0438\u043a\u0430\u0446\u0438\u044e \u043f\u043e <strong>Host<\/strong> \u0441\u0438\u0441\u0442\u0435\u043c\u0435, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043c\u043e\u0436\u0435\u0442 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u044c <code>this<\/code> \u0442\u0430\u043a, \u043a\u0430\u043a \u0435\u0439 \u043d\u0443\u0436\u043d\u043e.<\/p>\n<p>\u0415\u0441\u043b\u0438 \u043c\u044b \u043e\u043a\u0430\u0437\u0430\u043b\u0438\u0441\u044c \u0432\u043d\u0443\u0442\u0440\u0438 \u0444\u0443\u043d\u043a\u0446\u0438\u0438, \u0442\u043e \u043f\u0435\u0440\u0432\u043e\u0435 \u0438 \u0435\u0434\u0438\u043d\u0441\u0442\u0432\u0435\u043d\u043d\u043e\u0435 \u0432\u0430\u0436\u043d\u043e\u0435 \u043f\u0440\u0430\u0432\u0438\u043b\u043e &#8212; \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0435\u0442\u044c, \u043a\u0430\u043a \u044d\u0442\u0430 \u0444\u0443\u043d\u043a\u0446\u0438\u044f \u0431\u044b\u043b\u0430 \u0432\u044b\u0437\u0432\u0430\u043d\u0430 (\u043f\u0435\u0440\u0435\u0434 \u044d\u0442\u0438\u043c \u043d\u0435 \u0437\u0430\u0431\u044b\u0432 \u043f\u0440\u043e\u0432\u0435\u0440\u0438\u0442\u044c, \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043b\u0438 \u0444\u0443\u043d\u043a\u0446\u0438\u044f \u0441\u0442\u0440\u0435\u043b\u043e\u0447\u043d\u043e\u0439).<\/p>\n<p>\u0415\u0441\u043b\u0438 \u044d\u0442\u0430 \u0444\u0443\u043d\u043a\u0446\u0438\u044f \u043d\u0435 \u0441\u0442\u0440\u0435\u043b\u043e\u0447\u043d\u0430\u044f, \u0442\u043e \u043c\u044b \u0441\u043c\u043e\u0442\u0440\u0438\u043c, \u043a\u0430\u043a \u043e\u043d\u0430 \u0432\u044b\u0437\u044b\u0432\u0430\u043b\u0430\u0441\u044c.<\/p>\n<p>\u0415\u0441\u043b\u0438 \u044d\u0442\u0430 \u0444\u0443\u043d\u043a\u0446\u0438\u044f \u0441\u0442\u0440\u0435\u043b\u043e\u0447\u043d\u0430\u044f, \u0442\u043e \u043c\u044b \u043e\u0431\u0440\u0430\u0449\u0430\u0435\u043c \u0432\u043d\u0438\u043c\u0430\u043d\u0438\u0435 \u043d\u0430 \u0440\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u0435 \u043e\u043a\u0440\u0443\u0436\u0435\u043d\u0438\u0435.<\/p>\n<p>\u0422\u0430\u043a\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c, \u0435\u0441\u043b\u0438 \u0443 \u043d\u0430\u0441 \u0444\u0443\u043d\u043a\u0446\u0438\u044f \u043d\u0435 \u0441\u0442\u0440\u0435\u043b\u043e\u0447\u043d\u0430\u044f, \u0438 \u043c\u044b \u0441\u043c\u043e\u0442\u0440\u0438\u043c, \u043a\u0430\u043a \u043e\u043d\u0430 \u0432\u044b\u0437\u044b\u0432\u0430\u043b\u0430\u0441\u044c. \u0414\u0430\u043b\u044c\u0448\u0435 \u0432\u0441\u0435 \u043f\u0440\u043e\u0441\u0442\u043e: <code>this<\/code> \u0437\u0430\u0434\u0430\u0435\u0442\u0441\u044f \u044f\u0432\u043d\u044b\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c \u043f\u0440\u0438 \u043f\u043e\u043c\u043e\u0449\u0438 \u0442\u0440\u0435\u0445 \u043c\u0435\u0442\u043e\u0434\u043e\u0432 &#8212; <code>call<\/code>, <code>bind<\/code>, <code>apply<\/code>.<\/p>\n<p>\u0415\u0441\u043b\u0438 \u043c\u044b \u0432\u0438\u0434\u0438\u043c, \u0447\u0442\u043e \u0431\u044b\u043b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d \u043e\u0434\u0438\u043d \u0438\u0437 \u044d\u0442\u0438\u0445 \u0442\u0440\u0435\u0445 \u043c\u0435\u0442\u043e\u0434\u043e\u0432, \u0442\u043e \u043c\u044b \u0437\u043d\u0430\u0435\u043c, \u0447\u0442\u043e <code>this<\/code> \u0432\u0441\u0435\u0433\u0434\u0430 \u0431\u0443\u0434\u0435\u0442 \u0440\u0430\u0432\u0435\u043d \u0442\u043e\u043c\u0443, \u043a\u0430\u043a \u043e\u043d \u0431\u044b\u043b \u043d\u0430\u0437\u043d\u0430\u0447\u0435\u043d \u0432\u043d\u0443\u0442\u0440\u0438 \u044d\u0442\u0438\u0445 \u0442\u0440\u0435\u0445 \u043c\u0435\u0442\u043e\u0434\u043e\u0432.<\/p>\n<p>\u0421\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0439 \u0432\u0430\u0440\u0438\u0430\u043d\u0442 \u0438\u0437\u043c\u0435\u043d\u0438\u0442\u044c <code>this<\/code> &#8212; \u044d\u0442\u043e \u043a\u043b\u044e\u0447\u0435\u0432\u043e\u0435 \u0441\u043b\u043e\u0432\u043e <code>new<\/code>, \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u0432\u0441\u0435 \u043f\u0440\u0438\u0432\u044b\u043a\u043b\u0438 \u0432\u0438\u0434\u0435\u0442\u044c \u043a\u0430\u043a \u0441\u043b\u043e\u0432\u043e, \u043a\u043e\u0442\u043e\u0440\u043e\u0435, \u043a\u0430\u0437\u0430\u043b\u043e\u0441\u044c \u0431\u044b, \u0432\u044b\u0437\u044b\u0432\u0430\u0435\u0442 \u043a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0442\u043e\u0440. \u041c\u044b \u0441\u043e\u0437\u0434\u0430\u0435\u043c \u0432 \u043d\u0435\u043c \u043d\u043e\u0432\u044b\u0435 \u043e\u0431\u044a\u0435\u043a\u0442\u044b, \u043d\u043e \u0441 \u0442\u043e\u0447\u043a\u0438 \u0437\u0440\u0435\u043d\u0438\u044f \u0441\u043f\u0435\u0446\u0438\u0444\u0438\u043a\u0430\u0446\u0438\u0438 \u043a\u043b\u044e\u0447\u0435\u0432\u043e\u0435 \u0441\u043b\u043e\u0432\u043e <code>new<\/code> \u0432\u0441\u0435\u0433\u043e \u043b\u0438\u0448\u044c \u0432\u044b\u0437\u044b\u0432\u0430\u0435\u0442 \u0444\u0443\u043d\u043a\u0446\u0438\u044e, \u0432\u043d\u0443\u0442\u0440\u0438 \u043a\u043e\u0442\u043e\u0440\u043e\u0439 \u043e\u043d\u043e \u0441\u0432\u044f\u0437\u044b\u0432\u0430\u0435\u0442 <code>this<\/code> \u0441 \u043f\u0443\u0441\u0442\u044b\u043c \u043e\u0431\u044a\u0435\u043a\u0442\u043e\u043c.<\/p>\n<p>\u0415\u0441\u043b\u0438 \u043c\u044b \u043d\u0435 \u0432\u0438\u0434\u0438\u043c \u043a\u043b\u044e\u0447\u0435\u0432\u043e\u0433\u043e \u0441\u043b\u043e\u0432\u0430 <code>new<\/code>, \u043c\u044b \u0434\u0430\u043b\u044c\u0448\u0435 \u0441\u043c\u043e\u0442\u0440\u0438\u043c, \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u043b\u0438 \u0432\u044b\u0437\u043e\u0432 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u0432 \u0434\u043e\u0442-\u043d\u043e\u0442\u0430\u0446\u0438\u0438.<\/p>\n<p>\u0415\u0441\u043b\u0438 \u0432\u044b\u0437\u043e\u0432 \u0432 \u0434\u043e\u0442-\u043d\u043e\u0442\u0430\u0446\u0438\u0438, \u0442\u043e <code>this<\/code> \u0432\u0441\u0435\u0433\u0434\u0430 \u0431\u0443\u0434\u0435\u0442 \u0440\u0430\u0432\u0435\u043d \u0442\u043e\u043c\u0443, \u0447\u0442\u043e \u0441\u0442\u043e\u0438\u0442 \u043f\u0435\u0440\u0435\u0434 \u0442\u043e\u0447\u043a\u043e\u0439.<\/p>\n<p>\u0415\u0441\u043b\u0438 \u0432\u0441\u0435 \u044d\u0442\u0438 \u043f\u0443\u043d\u043a\u0442\u044b \u043c\u044b \u043f\u0440\u043e\u0448\u043b\u0438, \u0442\u043e <code>this<\/code> \u0440\u0430\u0432\u0435\u043d <code>undefined<\/code> \u0438\u043b\u0438 <strong>global object<\/strong> (<strong>strict mode<\/strong> \/ <strong>non strict mode<\/strong>).<\/p>\n<\/li>\n<li>\n<p>\u0424\u0438\u043d\u0430\u043b\u044c\u043d\u044b\u0439 \u0430\u043b\u0433\u043e\u0440\u0438\u0442\u043c \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u044f <code>this<\/code> \u0432 JavaScript \u0432\u044b\u0433\u043b\u044f\u0434\u0438\u0442 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c:<\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w780q1\/getpro\/habr\/upload_files\/ca9\/bfe\/f51\/ca9bfef5104e236934278bf09c57e406.jpg\" width=\"1710\" height=\"2338\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/ca9\/bfe\/f51\/ca9bfef5104e236934278bf09c57e406.jpg\" data-blurred=\"true\"\/><\/figure>\n<p>\u041f\u043e\u043b\u044c\u0437\u0443\u044f\u0441\u044c \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c\u044e \u044f \u0445\u043e\u0447\u0443 \u0440\u0430\u0441\u0441\u043a\u0430\u0437\u0430\u0442\u044c \u043e \u0441\u0432\u043e\u0435\u043c YouTube \u043a\u0430\u043d\u0430\u043b\u0435 <a href=\"https:\/\/www.youtube.com\/channel\/UCKcpogNYnCtUNNf-_q1ubTw\" rel=\"noopener noreferrer nofollow\">Open JS<\/a>. \u041d\u0430 \u044d\u0442\u043e\u043c \u043a\u0430\u043d\u0430\u043b\u0435 \u044f \u043f\u0443\u0431\u043b\u0438\u043a\u0443\u044e \u043e\u0431\u0443\u0447\u0430\u044e\u0449\u0438\u0435 \u0440\u043e\u043b\u0438\u043a\u0438 \u043f\u043e JavaScript.<\/p>\n<\/p>\n<\/div>\n<\/div>\n<\/div>\n<p><!----><!----><\/div>\n<p><!----><\/p>\n<div class=\"tm-article-poll-container\"><!--[--><\/p>\n<div class=\"tm-article-poll tm-article-poll_variant-bordered\">\n<div class=\"tm-notice tm-notice_positive tm-article-poll__notice\"><!----><\/p>\n<div class=\"tm-notice__inner\"><!----><\/p>\n<div class=\"tm-notice__content\" data-test-id=\"notice-content\"><!--[--><span>\u0422\u043e\u043b\u044c\u043a\u043e \u0437\u0430\u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u044b\u0435 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u0438 \u043c\u043e\u0433\u0443\u0442 \u0443\u0447\u0430\u0441\u0442\u0432\u043e\u0432\u0430\u0442\u044c \u0432 \u043e\u043f\u0440\u043e\u0441\u0435. <a rel=\"nofollow\" href=\"\/kek\/v1\/auth\/habrahabr\/?back=\/ru\/articles\/785872\/&#038;hl=ru\">\u0412\u043e\u0439\u0434\u0438\u0442\u0435<\/a>, \u043f\u043e\u0436\u0430\u043b\u0443\u0439\u0441\u0442\u0430.<\/span><!--]--><\/div>\n<\/div>\n<\/div>\n<p><!--[--><\/p>\n<div class=\"tm-article-poll__header\">\u0411\u044b\u043b\u0430 \u043b\u0438 \u0441\u0442\u0430\u0442\u044c\u044f \u0434\u043b\u044f \u0432\u0430\u0441 \u043f\u043e\u043b\u0435\u0437\u043d\u0430?<\/div>\n<div class=\"tm-article-poll__answers\"><!--[--><\/p>\n<div class=\"tm-article-poll__answer\">\n<div class=\"tm-article-poll__answer-data\"><span class=\"tm-article-poll__answer-percent tm-article-poll__answer-percent_winning\">81.58% <\/span><span class=\"tm-article-poll__answer-label\">\u0414\u0430<\/span><span class=\"tm-article-poll__answer-votes\">31<\/span><\/div>\n<div class=\"tm-article-poll__answer-bar\">\n<div class=\"tm-article-poll__answer-progress tm-article-poll__answer-progress_winning\" style=\"width: 81.58%\"><\/div>\n<\/div>\n<\/div>\n<div class=\"tm-article-poll__answer\">\n<div class=\"tm-article-poll__answer-data\"><span class=\"tm-article-poll__answer-percent\">18.42% <\/span><span class=\"tm-article-poll__answer-label\">\u041d\u0435\u0442<\/span><span class=\"tm-article-poll__answer-votes\">7<\/span><\/div>\n<div class=\"tm-article-poll__answer-bar\">\n<div class=\"tm-article-poll__answer-progress\" style=\"width: 18.42%\"><\/div>\n<\/div>\n<\/div>\n<p><!--]--><\/div>\n<div class=\"tm-article-poll__stats\"> \u041f\u0440\u043e\u0433\u043e\u043b\u043e\u0441\u043e\u0432\u0430\u043b\u0438 38 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u0435\u0439.   \u0412\u043e\u0437\u0434\u0435\u0440\u0436\u0430\u043b\u0438\u0441\u044c 5 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u0435\u0439. <\/div>\n<p><!--]--><\/div>\n<p><!--]--><\/div>\n<p> \u0441\u0441\u044b\u043b\u043a\u0430 \u043d\u0430 \u043e\u0440\u0438\u0433\u0438\u043d\u0430\u043b \u0441\u0442\u0430\u0442\u044c\u0438 <a href=\"https:\/\/habr.com\/ru\/articles\/785872\/\"> https:\/\/habr.com\/ru\/articles\/785872\/<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<div><!--[--><!--]--><\/div>\n<div id=\"post-content-body\">\n<div>\n<div class=\"article-formatted-body article-formatted-body article-formatted-body_version-2\">\n<div xmlns=\"http:\/\/www.w3.org\/1999\/xhtml\">\n<h2>\u041f\u0440\u0435\u0434\u0438\u0441\u043b\u043e\u0432\u0438\u0435<\/h2>\n<p>\u041c\u043d\u0435 \u0434\u0430\u0432\u043d\u043e \u0445\u043e\u0442\u0435\u043b\u043e\u0441\u044c \u0440\u0430\u0441\u0441\u0442\u0430\u0432\u0438\u0442\u044c \u0432\u0441\u0435 \u0442\u043e\u0447\u043a\u0438 \u043d\u0430\u0434 \u0432\u043e\u043f\u0440\u043e\u0441\u043e\u043c \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u044f <code>this<\/code>.<\/p>\n<p>\u0412 \u044d\u0442\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0435 \u044f \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043b \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044e \u0438\u0437 \u043e\u0442\u043a\u0440\u044b\u0442\u044b\u0445 \u0438\u0441\u0442\u043e\u0447\u043d\u0438\u043a\u043e\u0432.<\/p>\n<p>\u0411\u043e\u043b\u044c\u0448\u0430\u044f \u0447\u0430\u0441\u0442\u044c \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u0438 \u0432\u0437\u044f\u0442\u0430 \u0441 YouTube-\u043a\u0430\u043d\u0430\u043b\u0430 <a href=\"https:\/\/www.youtube.com\/@AsForJS\" rel=\"noopener noreferrer nofollow\"><strong>As For JS<\/strong><\/a>, \u0430 \u0442\u0430\u043a\u0436\u0435 \u0438\u0437 \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u0438 \u043d\u0430 <a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/JavaScript\/Reference\/Operators\/this\" rel=\"noopener noreferrer nofollow\"><strong>mdn<\/strong><\/a> \u0441 \u043c\u043e\u0438\u043c \u043f\u0435\u0440\u0435\u0432\u043e\u0434\u043e\u043c. \u042f \u043f\u043e\u0441\u0442\u0430\u0440\u0430\u043b\u0441\u044f \u043c\u0430\u043a\u0441\u0438\u043c\u0430\u043b\u044c\u043d\u043e \u043f\u0440\u043e\u0432\u0435\u0440\u0438\u0442\u044c \u043c\u0430\u0442\u0435\u0440\u0438\u0430\u043b.<\/p>\n<p>\u0423\u0432\u0430\u0436\u0430\u0435\u043c\u044b\u0435 \u0447\u0438\u0442\u0430\u0442\u0435\u043b\u0438, \u043c\u043e\u0436\u0435\u0442\u0435 \u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0442\u044c \u0441\u0432\u043e\u0438 \u0437\u0430\u043c\u0435\u0447\u0430\u043d\u0438\u044f \u0432 \u043a\u043e\u043c\u043c\u0435\u043d\u0442\u0430\u0440\u0438\u044f\u0445, \u0438 \u044f \u043f\u043e\u0441\u0442\u0430\u0440\u0430\u044e\u0441\u044c \u0438\u0441\u043f\u0440\u0430\u0432\u0438\u0442\u044c \u0438\u0445 \u0432 \u0441\u0442\u0430\u0442\u044c\u0435.<\/p>\n<h2>\u0412\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u0432 \u0442\u0435\u043c\u0443: &#171;\u041a\u0430\u043a \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0438\u0442\u044c this \u0432 JavaScript&#187;<\/h2>\n<p><code>this<\/code> &#8212; \u044d\u0442\u043e \u0432\u044b\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u044f\u0437\u044b\u043a\u0430 JavaScript, \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u043a\u043e\u0442\u043e\u0440\u043e\u0433\u043e \u043e\u0447\u0435\u043d\u044c \u043f\u043e\u0445\u043e\u0436\u0435 \u043d\u0430 \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u0438\u0434\u0435\u043d\u0442\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440\u0430, \u0441 \u0442\u043e\u0439 \u043b\u0438\u0448\u044c \u0440\u0430\u0437\u043d\u0438\u0446\u0435\u0439, \u0447\u0442\u043e \u0441\u0432\u044f\u0437\u0430\u0442\u044c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0441 <code>this<\/code>, \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u0442\u043e\u043b\u044c\u043a\u043e \u043e\u0441\u043e\u0431\u043e\u0439 \u0444\u043e\u0440\u043c\u043e\u0439 \u0432\u044b\u0437\u043e\u0432\u0430 <strong>normal function<\/strong>.<\/p>\n<p>\u0414\u043b\u044f \u043f\u043e\u043d\u0438\u043c\u0430\u043d\u0438\u044f \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0433\u043e<strong> <\/strong><code>this<\/code> \u0432\u0430\u0436\u043d\u043e \u0443\u0447\u0438\u0442\u044b\u0432\u0430\u0442\u044c \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442 \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u2014 \u043a\u043e\u0433\u0434\u0430 \u043e\u043d\u0430 \u0432\u044b\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f, \u043a\u0430\u043a\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c \u0438 \u0433\u0434\u0435! \u042d\u0442\u043e \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0444\u0443\u043d\u0434\u0430\u043c\u0435\u043d\u0442\u0430\u043b\u044c\u043d\u044b\u043c \u043f\u0440\u0430\u0432\u0438\u043b\u043e\u043c.<\/p>\n<p>\u041f\u043e\u0447\u0435\u043c\u0443 \u043c\u044b \u043e\u0442\u043d\u043e\u0441\u0438\u043c\u0441\u044f \u043a <code>this<\/code> \u043a\u0430\u043a \u043a \u0438\u0434\u0435\u043d\u0442\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440\u0443?<\/p>\n<p>\u041f\u043e\u0442\u043e\u043c\u0443 \u0447\u0442\u043e \u043a\u0430\u0436\u0434\u044b\u0439 \u0440\u0430\u0437, \u043a\u043e\u0433\u0434\u0430 \u043c\u044b \u043f\u044b\u0442\u0430\u0435\u043c\u0441\u044f \u0440\u0430\u0437\u043e\u0431\u0440\u0430\u0442\u044c\u0441\u044f, \u0441 \u0447\u0435\u043c \u0441\u0432\u044f\u0437\u0430\u043d <code>this<\/code>, \u044d\u0442\u043e, \u0432 \u0431\u043e\u043b\u044c\u0448\u0438\u043d\u0441\u0442\u0432\u0435 \u0441\u043b\u0443\u0447\u0430\u0435\u0432, \u0430\u043d\u0430\u043b\u043e\u0433\u0438\u0447\u043d\u043e \u043f\u043e\u0438\u0441\u043a\u0443 \u0438\u0434\u0435\u043d\u0442\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440\u0430 \u0432 \u043e\u0431\u043b\u0430\u0441\u0442\u044f\u0445 \u0432\u0438\u0434\u0438\u043c\u043e\u0441\u0442\u0438 (\u043f\u0440\u043e\u0445\u043e\u0434\u044f \u043f\u043e \u0446\u0435\u043f\u043e\u0447\u043a\u0430\u043c \u043e\u043a\u0440\u0443\u0436\u0435\u043d\u0438\u0439).<\/p>\n<p>\u0412 JavaScript \u043f\u0440\u0438\u043d\u0446\u0438\u043f\u044b \u0434\u043e\u0432\u043e\u043b\u044c\u043d\u043e \u043f\u0440\u043e\u0441\u0442\u044b: \u0443 \u043d\u0430\u0441 \u0435\u0441\u0442\u044c \u043a\u043e\u0434, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0432\u044b\u043f\u043e\u043b\u043d\u044f\u0435\u0442\u0441\u044f. \u0421\u0440\u0435\u0434\u0430, \u0433\u0434\u0435 \u044d\u0442\u043e\u0442 \u043a\u043e\u0434 \u0432\u044b\u043f\u043e\u043b\u043d\u044f\u0435\u0442\u0441\u044f, \u0438\u043c\u0435\u0435\u0442 \u0441\u0432\u043e\u0438 \u043f\u0440\u0430\u0432\u0438\u043b\u0430 \u0438 \u043d\u0430\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f <strong>Global Environment (\u0413\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u0430\u044f \u0441\u0440\u0435\u0434\u0430)<\/strong>. \u041a\u0430\u0436\u0434\u044b\u0439 \u0440\u0430\u0437, \u043a\u043e\u0433\u0434\u0430 \u0432\u044b\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u043d\u043e\u0432\u0430\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u044f, \u0441\u043e\u0437\u0434\u0430\u0435\u0442\u0441\u044f \u043d\u043e\u0432\u043e\u0435 \u043e\u043a\u0440\u0443\u0436\u0435\u043d\u0438\u0435. \u041f\u0440\u0438 \u043f\u043e\u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0445 \u0432\u044b\u0437\u043e\u0432\u0430\u0445 \u0441\u043e\u0437\u0434\u0430\u0435\u0442\u0441\u044f \u043d\u043e\u0432\u043e\u0435 \u043e\u043a\u0440\u0443\u0436\u0435\u043d\u0438\u0435. \u041e\u043a\u0440\u0443\u0436\u0435\u043d\u0438\u0435 \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442 \u0442\u043e\u043b\u044c\u043a\u043e \u0432 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u0435 \u043a\u043e\u0434\u0430, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0432 \u0434\u0430\u043d\u043d\u044b\u0439 \u043c\u043e\u043c\u0435\u043d\u0442 \u0432\u044b\u043f\u043e\u043b\u043d\u044f\u0435\u0442\u0441\u044f. \u0415\u0441\u043b\u0438 \u0432 \u043a\u043e\u0434\u0435 \u0432\u0441\u0442\u0440\u0435\u0447\u0430\u0435\u0442\u0441\u044f \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u0435 \u0444\u0443\u043d\u043a\u0446\u0438\u0438, \u0432\u043e\u043a\u0440\u0443\u0433 \u044d\u0442\u043e\u0439 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u0441\u043e\u0437\u0434\u0430\u0435\u0442\u0441\u044f \u0441\u0432\u043e\u0435 \u0441\u043e\u0431\u0441\u0442\u0432\u0435\u043d\u043d\u043e\u0435 \u043e\u043a\u0440\u0443\u0436\u0435\u043d\u0438\u0435. \u0412 \u043e\u043a\u0440\u0443\u0436\u0435\u043d\u0438\u0438 \u0445\u0440\u0430\u043d\u0438\u0442\u0441\u044f \u0432\u0441\u044f \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u0430\u044f \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044f \u0434\u043b\u044f \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f \u0434\u0430\u043d\u043d\u043e\u0433\u043e \u043a\u043e\u0434\u0430.<\/p>\n<p>\u041f\u043e\u044d\u0442\u043e\u043c\u0443 \u0434\u0430\u0432\u0430\u0439\u0442\u0435 \u043d\u0430\u0447\u043d\u0435\u043c \u0441 \u0432\u043e\u043f\u0440\u043e\u0441\u0430: \u0441 \u0447\u0435\u043c \u0441\u0432\u044f\u0437\u0430\u043d <code>this<\/code>, \u043a\u043e\u0433\u0434\u0430 \u043e\u043d \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u0441\u044f \u0432\u043d\u0443\u0442\u0440\u0438 \u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u043e\u0439 \u0441\u0440\u0435\u0434\u044b \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f?<\/p>\n<hr\/>\n<h3>\u0413\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u044b\u0439 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442<\/h3>\n<p>\u0424\u0443\u043d\u043a\u0446\u0438\u044f \u0438\u043c\u0435\u0435\u0442 \u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u044b\u0439 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442, \u043a\u043e\u0433\u0434\u0430 \u043e\u043d\u0430 \u0432\u044b\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u0432\u043d\u0435 \u043a\u0430\u043a\u0438\u0445-\u043b\u0438\u0431\u043e \u0444\u0443\u043d\u043a\u0446\u0438\u0439 \u0438\u043b\u0438 \u043a\u043b\u0430\u0441\u0441\u043e\u0432. \u041f\u0440\u0438 \u044d\u0442\u043e\u043c \u043e\u043d\u0430 \u043c\u043e\u0436\u0435\u0442 \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u044c\u0441\u044f \u0432\u043d\u0443\u0442\u0440\u0438\u00a0<a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/JavaScript\/Reference\/Statements\/block\" rel=\"noopener noreferrer nofollow\"><strong>\u0431\u043b\u043e\u043a\u043e\u0432<\/strong><\/a>\u00a0\u0438\u043b\u0438\u00a0<a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/JavaScript\/Reference\/Operators\/this#arrow_functions\" rel=\"noopener noreferrer nofollow\"><strong>\u0441\u0442\u0440\u0435\u043b\u043e\u0447\u043d\u044b\u0445 \u0444\u0443\u043d\u043a\u0446\u0438\u0439<\/strong><\/a> \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u043d\u044b\u0445 \u0432 \u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u043e\u0439 \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u0432\u0438\u0434\u0438\u043c\u043e\u0441\u0442\u0438).<\/p>\n<p>\u0417\u043d\u0430\u0447\u0435\u043d\u0438\u0435\u00a0<code>this<\/code>\u00a0\u0437\u0430\u0432\u0438\u0441\u0438\u0442 \u043e\u0442 \u0442\u043e\u0433\u043e, \u0432 \u043a\u0430\u043a\u043e\u043c \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u0435 \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f \u0432\u044b\u043f\u043e\u043b\u043d\u044f\u0435\u0442\u0441\u044f \u0441\u043a\u0440\u0438\u043f\u0442.<\/p>\n<p>\u041a\u0430\u043a \u0438\u00a0<strong>callback<\/strong>, \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435\u00a0<code>this<\/code>\u00a0\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442\u0441\u044f \u0441\u0440\u0435\u0434\u043e\u0439 \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f (\u0432\u044b\u0437\u044b\u0432\u0430\u044e\u0449\u0438\u043c \u043e\u0431\u044a\u0435\u043a\u0442\u043e\u043c).<\/p>\n<p>\u041d\u0430 \u0432\u0435\u0440\u0445\u043d\u0435\u043c \u0443\u0440\u043e\u0432\u043d\u0435 \u0441\u043a\u0440\u0438\u043f\u0442\u0430,\u00a0<code>this<\/code>\u00a0\u043e\u0442\u043d\u043e\u0441\u0438\u0442\u0441\u044f \u043a\u00a0<code>globalThis<\/code>\u00a0\u043d\u0435\u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e \u043e\u0442 \u0442\u043e\u0433\u043e, \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u0441\u044f \u043b\u0438 \u043e\u043d \u0432 \u0441\u0442\u0440\u043e\u0433\u043e\u043c \u0440\u0435\u0436\u0438\u043c\u0435 \u0438\u043b\u0438 \u043d\u0435\u0442.<\/p>\n<blockquote>\n<p><code>globalThis<\/code> \u044d\u0442\u043e \u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u043e\u0435 \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u043e \u0441\u043e\u0434\u0435\u0440\u0436\u0430\u0449\u0435\u0435\u00a0\u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u043e\u0435\u00a0<code>this<\/code>\u00a0\u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435, \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u043e\u0431\u044b\u0447\u043d\u043e \u0430\u043d\u0430\u043b\u043e\u0433\u0438\u0447\u043d\u043e\u00a0\u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u043e\u043c\u0443 \u043e\u0431\u044a\u0435\u043a\u0442\u0443.<\/p>\n<\/blockquote>\n<p><strong>\u041f\u0440\u0438\u043c\u0435\u0440:<\/strong><\/p>\n<p>\u0412 \u0441\u043b\u0443\u0447\u0430\u0435 \u0437\u0430\u043f\u0443\u0441\u043a\u0430 \u0432 \u0441\u0440\u0435\u0434\u0435 Node JS \u0432 \u043d\u0435 \u0441\u0442\u0440\u043e\u0433\u043e\u043c \u0440\u0435\u0436\u0438\u043c\u0435 <code>globalThis<\/code> \u0431\u0443\u0434\u0435\u0442 \u043e\u0431\u044a\u0435\u043a\u0442 <code>global<\/code>:<\/p>\n<pre><code class=\"javascript\">\/* &lt;ref *1> Object [global] {   global: [Circular *1],   clearInterval: [Function: clearInterval],   clearTimeout: [Function: clearTimeout],   setInterval: [Function: setInterval],   setTimeout: [Function: setTimeout] {     [Symbol(nodejs.util.promisify.custom)]: [Getter]   },   queueMicrotask: [Function: queueMicrotask],   clearImmediate: [Function: clearImmediate],   setImmediate: [Function: setImmediate] {     [Symbol(nodejs.util.promisify.custom)]: [Getter]   } } *\/<\/code><\/pre>\n<p>\u0412 \u0441\u043b\u0443\u0447\u0430\u0435 \u0437\u0430\u043f\u0443\u0441\u043a\u0430 \u043a\u043e\u0434\u0430 \u0432 \u0431\u0440\u0430\u0443\u0437\u0435\u0440\u0435  \u0432 \u043d\u0435 \u0441\u0442\u0440\u043e\u0433\u043e\u043c \u0440\u0435\u0436\u0438\u043c\u0435 <code>globalThis<\/code> \u0431\u0443\u0434\u0435\u0442 <code>window<\/code>:<\/p>\n<pre><code class=\"javascript\">\/\/ [object Window]<\/code><\/pre>\n<p>\u0415\u0441\u043b\u0438 \u0438\u0441\u0445\u043e\u0434\u043d\u044b\u0439 \u043a\u043e\u0434 \u0437\u0430\u0433\u0440\u0443\u0436\u0435\u043d \u043a\u0430\u043a\u00a0<a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/JavaScript\/Guide\/Modules\" rel=\"noopener noreferrer nofollow\"><strong>\u043c\u043e\u0434\u0443\u043b\u044c<\/strong><\/a>, \u0442\u043e\u00a0<code>this<\/code>\u00a0\u0432\u0441\u0435\u0433\u0434\u0430 \u0431\u0443\u0434\u0435\u0442\u00a0<code>undefined<\/code> \u043d\u0430 \u0432\u0435\u0440\u0445\u043d\u0435\u043c \u0443\u0440\u043e\u0432\u043d\u0435:<\/p>\n<pre><code class=\"xml\">&lt;script src=\"index3.js\" type=\"module\">&lt;\/script><\/code><\/pre>\n<pre><code class=\"javascript\">console.log(this) \/\/ undefined<\/code><\/pre>\n<hr\/>\n<h3>\u0411\u0430\u0437\u043e\u0432\u044b\u0439 \u043f\u0440\u0438\u043c\u0435\u0440 \u0432\u043d\u0443\u0442\u0440\u0438 \u0444\u0443\u043d\u043a\u0446\u0438\u0438.<\/h3>\n<figure class=\"full-width\"><\/figure>\n<p>\u0420\u0430\u0441\u0441\u043c\u0430\u0442\u0440\u0438\u0432\u0430\u0435\u043c \u0441\u0430\u043c\u044b\u0439 \u043f\u0440\u043e\u0441\u0442\u043e\u0439 \u0438 \u0431\u0430\u0437\u043e\u0432\u044b\u0439 \u043f\u0440\u0438\u043c\u0435\u0440:<\/p>\n<pre><code class=\"javascript\">\"use strict\" console.log(\"this is\", this) \/\/ this is {}<\/code><\/pre>\n<p>\u041c\u044b \u043d\u0430\u0445\u043e\u0434\u0438\u043c\u0441\u044f \u0432 \u0441\u0442\u0440\u043e\u0433\u043e\u043c \u0440\u0435\u0436\u0438\u043c\u0435 (<code>\"use strict\"<\/code>).<\/p>\n<p>\u041c\u044b \u0445\u043e\u0442\u0438\u043c \u043f\u043e\u043d\u044f\u0442\u044c \u0441 \u0447\u0435\u043c \u0441\u0432\u044f\u0437\u0430\u043d <code>this<\/code>. \u0410\u043b\u0433\u043e\u0440\u0438\u0442\u043c \u0441 \u0442\u043e\u0447\u043a\u0438 \u0437\u0440\u0435\u043d\u0438\u044f \u0441\u043f\u0435\u0446\u0438\u0444\u0438\u043a\u0430\u0446\u0438\u0438 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0439:<\/p>\n<p>\u041c\u044b \u043d\u0430\u0445\u043e\u0434\u0438\u043c\u0441\u044f \u0432\u043d\u0443\u0442\u0440\u0438 \u0444\u0443\u043d\u043a\u0446\u0438\u0438?<\/p>\n<p>\u21d2 \u041d\u0435\u0442.<\/p>\n<p>\u21d2 \u041f\u0435\u0440\u0435\u0445\u043e\u0434\u0438\u043c \u043a \u043d\u043e\u0432\u043e\u0439 \u0432\u0435\u0442\u043a\u0435 \u043d\u0430 \u043d\u0430\u0448\u0435\u0439 \u0441\u0445\u0435\u043c\u0435 &#8212; \u201c\u041c\u044b \u0432\u043d\u0443\u0442\u0440\u0438 \u0441\u043a\u0440\u0438\u043f\u0442\u0430 \u0438\u043b\u0438 \u0432\u043d\u0443\u0442\u0440\u0438 \u043c\u043e\u0434\u0443\u043b\u044f?\u201d<\/p>\n<hr\/>\n<h3>Script \u0438\u043b\u0438 Module<\/h3>\n<figure class=\"full-width\"><\/figure>\n<p><strong>\u042f \u0441\u0440\u0430\u0437\u0443 \u043e\u0442\u043c\u0435\u0447\u0443, \u0447\u0442\u043e \u043d\u0430 \u0441\u0445\u0435\u043c\u0430\u0445 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u044f <\/strong><code>this<\/code><strong> \u0443\u043a\u0430\u0437\u0430\u043d\u043e \u043e\u0442\u043d\u043e\u0441\u0438\u0442\u0435\u043b\u044c\u043d\u043e strict mode \u0438 \u043d\u0435 \u0443\u0447\u0438\u0442\u044b\u0432\u0430\u0435\u0442  \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 <\/strong><code>this<\/code><strong> \u0432\u043d\u0435\u0448\u043d\u0438\u043c  API.<\/strong><\/p>\n<p><strong>Script<\/strong> \u0438 <strong>Module<\/strong> \u044d\u0442\u043e \u0434\u0432\u0430 \u0442\u0435\u0440\u043c\u0438\u043d\u0430, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043e\u043f\u0438\u0441\u044b\u0432\u0430\u044e\u0442 \u0440\u0430\u0437\u043d\u044b\u0435 \u0441\u043f\u043e\u0441\u043e\u0431\u044b \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f \u043a\u043e\u0434\u0430.<\/p>\n<p><strong>Script<\/strong> &#8212; \u043a\u043e\u0434, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0437\u0430\u043f\u0443\u0441\u043a\u0430\u0435\u0442\u0441\u044f \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e.<\/p>\n<p><strong>Module<\/strong> &#8212; \u0437\u0430\u043f\u0443\u0441\u043a \u043a\u043e\u0434\u0430 \u0441 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u043e\u043c <code>module<\/code>. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440 \u043a\u043e\u0433\u0434\u0430 \u043c\u044b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c <code>import<\/code>.<\/p>\n<p>\u21d2 \u0417\u0430\u0434\u0430\u0435\u043c \u0441\u0435\u0431\u0435 \u0432\u043e\u043f\u0440\u043e\u0441: \u201c\u042f \u0432\u043d\u0443\u0442\u0440\u0438 \u043c\u043e\u0434\u0443\u043b\u044f\u201d?<\/p>\n<ul>\n<li>\n<p>\u0414\u0430<\/p>\n<p>\u21d2 \u0422\u043e\u0433\u0434\u0430 <code>this<\/code> \u0440\u0430\u0432\u0435\u043d <code>undefined<\/code>. \u0414\u0440\u0443\u0433\u0438\u0445 \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u043e\u0432 \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u043e\u0432\u0430\u0442\u044c \u043d\u0435 \u043c\u043e\u0436\u0435\u0442.<\/p>\n<\/li>\n<li>\n<p>\u041d\u0435\u0442<\/p>\n<p>\u21d2 <code>this<\/code> \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e \u0441\u0432\u044f\u0437\u0430\u043d \u0441 <strong>global object<\/strong>.<\/p>\n<ul>\n<li>\n<p>\u0421\u043e\u0433\u043b\u0430\u0441\u043d\u043e \u0441\u043f\u0435\u0446\u0438\u0444\u0438\u043a\u0430\u0446\u0438\u0438 <strong>Host-\u0441\u0440\u0435\u0434\u0430<\/strong> (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440 \u0431\u0440\u0430\u0443\u0437\u0435\u0440, Node) \u0438\u043c\u0435\u0435\u0442 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e \u0438\u0437\u043c\u0435\u043d\u0438\u0442\u044c \u0442\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 <code>this<\/code>, \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u0431\u044b\u043b\u043e \u0441\u0432\u044f\u0437\u0430\u043d\u043e \u0441 \u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u044b\u043c \u043e\u0431\u044a\u0435\u043a\u0442\u043e\u043c.<\/p>\n<p>\u041f\u043e\u044d\u0442\u043e\u043c\u0443 \u043c\u044b \u0437\u0430\u0434\u0430\u0435\u043c \u0432\u043e\u043f\u0440\u043e\u0441: \u201c<strong>\u041d\u043est<\/strong> \u0438\u0437\u043c\u0435\u043d\u044f\u0435\u0442 <code>this<\/code>?\u201d<\/p>\n<ul>\n<li>\n<p>\u041d\u0435\u0442<\/p>\n<p>\u21d2 \u0422\u043e\u0433\u0434\u0430  <code>this<\/code> \u0440\u0430\u0432\u0435\u043d <code>undefined<\/code><\/p>\n<\/li>\n<li>\n<p>\u0414\u0430<\/p>\n<p>\u21d2 <code>this<\/code> \u0440\u0430\u0432\u0435\u043d \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044e, \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u043b <strong>Host<\/strong><\/p>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<hr\/>\n<h3>Function Environment<\/h3>\n<p>\u041c\u044b \u0438\u0437\u0443\u0447\u0438\u043b\u0438 \u0432\u0435\u0442\u043a\u0443 <strong>Script \u0438\u043b\u0438 Module<\/strong> \u0438 \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u0438\u043c \u0432 \u0432\u0435\u0442\u043a\u0443 <strong>Function Environment.<\/strong><\/p>\n<figure class=\"full-width\"><\/figure>\n<p>\u041f\u043e\u0434 \u0441\u043b\u043e\u0432\u0430\u043c\u0438 \u201c\u043d\u043e\u0440\u043c\u0430\u043b\u044c\u043d\u0430\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u044f\u201d (<strong>normal function<\/strong>) \u043c\u044b \u0431\u0443\u0434\u0435\u0442 \u0438\u043c\u0435\u0442\u044c \u0432\u0432\u0438\u0434\u0443 \u043b\u044e\u0431\u0443\u044e \u0444\u0443\u043d\u043a\u0446\u0438\u044e, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043d\u0435 \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f <a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/JavaScript\/Reference\/Functions\/Arrow_functions\" rel=\"noopener noreferrer nofollow\"><strong>arrow function<\/strong><\/a> (\u0441\u0442\u0440\u0435\u043b\u043e\u0447\u043d\u043e\u0439 \u0444\u0443\u043d\u043a\u0446\u0438\u0435\u0439). \u0422\u043e \u0435\u0441\u0442\u044c \u044d\u0442\u043e \u0432\u0441\u0435 \u0444\u0443\u043d\u043a\u0446\u0438\u0438, \u0443 \u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u043c\u0435\u0436\u0434\u0443 \u0430\u0440\u0433\u0443\u043c\u0435\u043d\u0442\u0430\u043c\u0438 \u0438 \u0438\u0445 \u0442\u0435\u043b\u043e\u043c \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u043e\u0442\u0441\u0443\u0442\u0441\u0442\u0432\u0443\u0435\u0442 \u0441\u0438\u043c\u0432\u043e\u043b\u044c\u043d\u0430\u044f \u043f\u0430\u0440\u0430 <code>=><\/code>.<\/p>\n<p>\u041c\u044b \u043f\u043e\u043c\u043d\u0438\u043c, \u0447\u0442\u043e \u043d\u0430\u0448 \u043e\u0441\u043d\u043e\u0432\u043d\u043e\u0439 \u0432\u043e\u043f\u0440\u043e\u0441 \u044d\u0442\u043e: \u201c\u042f \u0432 \u043a\u043e\u0434\u0435 \u0444\u0443\u043d\u043a\u0446\u0438\u0438?\u201d.<\/p>\n<p>\u041d\u0430\u043f\u0438\u0448\u0435\u043c \u043f\u0440\u0438\u043c\u0435\u0440 \u0432 \u043a\u043e\u0442\u043e\u0440\u043e\u043c <code>this<\/code> \u0431\u0443\u0434\u0435\u0442 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0442\u044c\u0441\u044f \u0432\u043d\u0443\u0442\u0440\u0438 \u0444\u0443\u043d\u043a\u0446\u0438\u0438.<\/p>\n<pre><code class=\"javascript\">\"use strict\"  function doLogThis() {   let doArrowThing = () => console.log(\"this is\", this)   doArrowThing() }  doLogThis() \/\/ this is undefined<\/code><\/pre>\n<p>\u0412 \u044d\u0442\u043e\u043c \u043a\u043e\u0434\u0435 \u0432\u044b\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f <code>doLogThis<\/code>. \u0412\u043d\u0443\u0442\u0440\u0438 <code>doLogThis<\/code> \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0438\u043b\u0430\u0441\u044c \u0441\u0442\u0440\u0435\u043b\u043e\u0447\u043d\u0430\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u044f <code>doArrowThing<\/code> \u0438 \u043f\u043e\u0442\u043e\u043c \u043e\u043d\u0430 \u0431\u044b\u043b\u0430 \u0432\u044b\u0437\u0432\u0430\u043d\u0430.<\/p>\n<p>\u0410\u043b\u0433\u043e\u0440\u0438\u0442\u043c \u0431\u0443\u0434\u0435\u0442 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0439:<\/p>\n<ul>\n<li>\n<p>\u041c\u044b \u043d\u0430\u0445\u043e\u0434\u0438\u043c\u0441\u044f \u0432\u043d\u0443\u0442\u0440\u0438 \u043d\u043e\u0440\u043c\u0430\u043b\u044c\u043d\u043e\u0439 \u0444\u0443\u043d\u043a\u0446\u0438\u0438? <\/p>\n<ul>\n<li>\n<p>\u041d\u0435\u0442!<\/p>\n<p>\u041c\u044b \u043d\u0430\u0445\u043e\u0434\u0438\u043c\u0441\u044f \u0432\u043d\u0443\u0442\u0440\u0438 \u0441\u0442\u0440\u0435\u043b\u043e\u0447\u043d\u043e\u0439 \u0444\u0443\u043d\u043a\u0446\u0438\u0438.<\/p>\n<p>\u21d2 \u041f\u0435\u0440\u0435\u0445\u043e\u0434\u0438\u043c \u043a \u0432\u0435\u0442\u043a\u0435 \u0434\u043b\u044f \u0441\u0442\u0440\u0435\u043b\u043e\u0447\u043d\u043e\u0439 \u0444\u0443\u043d\u043a\u0446\u0438\u0438<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<hr\/>\n<h3>Arrow function<\/h3>\n<figure class=\"full-width\"><\/figure>\n<p>\u0412 \u0441\u0442\u0440\u0435\u043b\u043e\u0447\u043d\u044b\u0445 \u0444\u0443\u043d\u043a\u0446\u0438\u044f\u0445 <code>this<\/code> \u043f\u0440\u0438\u0432\u044f\u0437\u0430\u043d \u043a \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u0443, \u0432 \u043a\u043e\u0442\u043e\u0440\u043e\u043c \u043e\u043d\u0438 \u0431\u044b\u043b\u0438 \u0441\u043e\u0437\u0434\u0430\u043d\u044b, \u0438 \u043d\u0435 \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u0438\u0437\u043c\u0435\u043d\u0435\u043d. \u041e\u043d\u0438 \u043d\u0435 \u0438\u043c\u0435\u044e\u0442 \u0441\u0432\u043e\u0435\u0433\u043e \u0441\u043e\u0431\u0441\u0442\u0432\u0435\u043d\u043d\u043e\u0433\u043e <code>this<\/code>, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u043e\u043d\u0438 \u0431\u0435\u0440\u0443\u0442 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 <code>this<\/code> \u0438\u0437 \u043e\u043a\u0440\u0443\u0436\u0430\u044e\u0449\u0435\u0433\u043e \u043a\u043e\u0434\u0430.<\/p>\n<p>\u0414\u0440\u0443\u0433\u0438\u043c\u0438 \u0441\u043b\u043e\u0432\u0430\u043c\u0438, \u043f\u0440\u0438 \u043e\u0446\u0435\u043d\u043a\u0435 \u0442\u0435\u043b\u0430 \u0441\u0442\u0440\u0435\u043b\u043e\u0447\u043d\u043e\u0439 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u044f\u0437\u044b\u043a \u043d\u0435 \u0441\u043e\u0437\u0434\u0430\u0435\u0442 \u043d\u043e\u0432\u0443\u044e\u00a0<code>this<\/code>\u00a0\u043f\u0440\u0438\u0432\u044f\u0437\u043a\u0443.<\/p>\n<p>\u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0432 \u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u043e\u043c \u043a\u043e\u0434\u0435 (\u043d\u0435 \u0432 \u0441\u0442\u0440\u043e\u0433\u043e\u043c \u0440\u0435\u0436\u0438\u043c\u0435),\u00a0<code>this<\/code>\u00a0\u0432\u0441\u0435\u0433\u0434\u0430\u00a0<code>globalThis<\/code>\u00a0\u043d\u0435\u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e \u043e\u0442 \u0441\u0442\u0440\u043e\u0433\u043e\u0441\u0442\u0438, \u0438\u0437-\u0437\u0430 \u043f\u0440\u0438\u0432\u044f\u0437\u043a\u0438 \u043a\u00a0\u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u043e\u043c\u0443 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u0443:<\/p>\n<pre><code class=\"javascript\">const globalObject = this; const foo = () => this;  console.log(foo() === globalObject); \/\/ true<\/code><\/pre>\n<p>\u0421\u0442\u0440\u0435\u043b\u043e\u0447\u043d\u044b\u0435 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u0441\u043e\u0437\u0434\u0430\u044e\u0442\u00a0\u0437\u0430\u043c\u044b\u043a\u0430\u043d\u0438\u0435\u00a0\u043d\u0430\u00a0<code>this<\/code> \u043e\u043a\u0440\u0443\u0436\u0430\u044e\u0449\u0435\u0439 \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u0432\u0438\u0434\u0438\u043c\u043e\u0441\u0442\u0438, \u0447\u0442\u043e \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442, \u0447\u0442\u043e \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u0441\u043e \u0441\u0442\u0440\u0435\u043b\u043a\u0430\u043c\u0438 \u0432\u0435\u0434\u0443\u0442 \u0441\u0435\u0431\u044f \u0442\u0430\u043a, \u043a\u0430\u043a \u0431\u0443\u0434\u0442\u043e \u043e\u043d\u0438 &#171;\u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u043f\u0440\u0438\u0432\u044f\u0437\u0430\u043d\u044b&#187; &#8212; \u043d\u0435\u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e \u043e\u0442 \u0442\u043e\u0433\u043e, \u043a\u0430\u043a \u043e\u043d\u0438 \u0432\u044b\u0437\u044b\u0432\u0430\u044e\u0442\u0441\u044f,\u00a0<code>this<\/code>\u00a0\u043f\u0440\u0438\u0432\u044f\u0437\u0430\u043d\u044b \u043a \u0442\u043e\u043c\u0443, \u0447\u0442\u043e \u0431\u044b\u043b\u043e \u043f\u0440\u0438 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u0438 \u0444\u0443\u043d\u043a\u0446\u0438\u0438.\u00a0\u0422\u043e \u0436\u0435 \u0441\u0430\u043c\u043e\u0435 \u043e\u0442\u043d\u043e\u0441\u0438\u0442\u0441\u044f \u0438 \u043a \u0441\u0442\u0440\u0435\u043b\u043e\u0447\u043d\u044b\u043c \u0444\u0443\u043d\u043a\u0446\u0438\u044f\u043c, \u0441\u043e\u0437\u0434\u0430\u043d\u043d\u044b\u043c \u0432\u043d\u0443\u0442\u0440\u0438 \u0434\u0440\u0443\u0433\u0438\u0445 \u0444\u0443\u043d\u043a\u0446\u0438\u0439.<\/p>\n<p>\u0411\u043e\u043b\u0435\u0435 \u0442\u043e\u0433\u043e, \u043f\u0440\u0438 \u0432\u044b\u0437\u043e\u0432\u0435 \u0441\u0442\u0440\u0435\u043b\u043e\u0447\u043d\u044b\u0445 \u0444\u0443\u043d\u043a\u0446\u0438\u0439 \u0441 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435\u043c\u00a0<code>call()<\/code>,\u00a0<code>bind()<\/code>\u00a0\u0438\u043b\u0438\u00a0<code>apply()<\/code>, \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u00a0<code>thisArg<\/code>\u00a0\u0438\u0433\u043d\u043e\u0440\u0438\u0440\u0443\u0435\u0442\u0441\u044f.\u00a0\u041e\u0434\u043d\u0430\u043a\u043e \u0432\u044b \u0432\u0441\u0435 \u0440\u0430\u0432\u043d\u043e \u043c\u043e\u0436\u0435\u0442\u0435 \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0442\u044c \u0434\u0440\u0443\u0433\u0438\u0435 \u0430\u0440\u0433\u0443\u043c\u0435\u043d\u0442\u044b, \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044f \u044d\u0442\u0438 \u043c\u0435\u0442\u043e\u0434\u044b.<\/p>\n<pre><code class=\"javascript\">const globalObject = this; const foo = () => this; const obj = { name: \"obj\" };  console.log(foo.call(obj) === globalObject); \/\/ true  const boundFoo = foo.bind(obj); console.log(boundFoo() === globalObject); \/\/ true<\/code><\/pre>\n<p>\u041f\u0440\u0438 \u043f\u043e\u0438\u0441\u043a\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f <code>this<\/code> \u043c\u044b \u0432\u0441\u0435\u0433\u0434\u0430 \u0438\u0433\u043d\u043e\u0440\u0438\u0440\u0443\u0435\u043c \u0441\u0442\u0440\u0435\u043b\u043e\u0447\u043d\u0443\u044e \u0444\u0443\u043d\u043a\u0446\u0438\u044e \u0438 \u0441\u0440\u0430\u0437\u0443 \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u0438\u043c \u043a \u0435\u0451 \u0440\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u043c\u0443 \u043e\u043a\u0440\u0443\u0436\u0435\u043d\u0438\u044e.<\/p>\n<hr\/>\n<h3>\u0412\u044b\u0437\u043e\u0432 \u043d\u043e\u0440\u043c\u0430\u043b\u044c\u043d\u043e\u0439 \u0444\u0443\u043d\u043a\u0446\u0438\u0438<\/h3>\n<figure class=\"full-width\"><\/figure>\n<p>\u041f\u0440\u0430\u0432\u0438\u043b\u043e, \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u043d\u0443\u0436\u043d\u043e \u0437\u0430\u043f\u043e\u043c\u043d\u0438\u0442\u044c. \u0412 \u043c\u043e\u043c\u0435\u043d\u0442 \u0432\u044b\u0437\u043e\u0432\u0430 \u043b\u044e\u0431\u043e\u0439 \u043d\u043e\u0440\u043c\u0430\u043b\u044c\u043d\u043e\u0439 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 (\u043d\u0435 \u0441\u0442\u0440\u0435\u043b\u043e\u0447\u043d\u043e\u0439) \u0443 \u043d\u0435\u0435 \u0432\u0441\u0435\u0433\u0434\u0430 \u0435\u0441\u0442\u044c \u0430\u0440\u0433\u0443\u043c\u0435\u043d\u0442 <code>this<\/code> \u0431\u0435\u0437 \u0438\u0441\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u044f. \u0415\u0441\u043b\u0438 \u0430\u0440\u0433\u0443\u043c\u0435\u043d\u0442 <code>this<\/code> \u043d\u0438 \u043a\u0430\u043a\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c \u043d\u0435 \u0437\u0430\u0434\u0430\u043d, \u0442\u043e\u0433\u0434\u0430 \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e \u043e\u043d \u0432\u0441\u0435\u0433\u0434\u0430 \u0441\u0432\u044f\u0437\u0430\u043d \u0441 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435\u043c <code>undefined<\/code>.<\/p>\n<p>\u041f\u0440\u0438\u043c\u0435\u0440:<\/p>\n<pre><code class=\"javascript\">\"use strict\"  function doLogThis() { console.log('this is', this) \/\/ undefined }  doLogThis()<\/code><\/pre>\n<hr\/>\n<h3>this \u0438 call, apply, bind<\/h3>\n<figure class=\"full-width\"><\/figure>\n<p>\u0415\u0441\u043b\u0438 \u043c\u044b \u043d\u0430\u0445\u043e\u0434\u0438\u043c\u0441\u044f \u0432\u043d\u0443\u0442\u0440\u0438 \u043d\u043e\u0440\u043c\u0430\u043b\u044c\u043d\u043e\u0439 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u0432 \u043f\u0435\u0440\u0432\u0443\u044e \u043e\u0447\u0435\u0440\u0435\u0434\u044c \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0435\u0442\u044c \u043a\u0430\u043a \u044d\u0442\u0430 \u0444\u0443\u043d\u043a\u0446\u0438\u044f \u0432\u044b\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f.<\/p>\n<p>\u041f\u0440\u0438\u043c\u0435\u0440:<\/p>\n<pre><code class=\"javascript\">function SomeObject() {}  SomeObject.prototype.someMethod = function() {   console.log('Hello!'); };  const newObj = new SomeObject();  newObj.someMethod(); \/\/ \u0412\u044b\u0432\u0435\u0434\u0435\u0442: Hello!<\/code><\/pre>\n<p>\u041c\u0435\u0442\u043e\u0434\u044b <code>call<\/code>, <code>apply<\/code>, <code>bind<\/code> \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u044e\u0442 \u0437\u0430\u0434\u0430\u0442\u044c <code>this<\/code> \u044f\u0432\u043d\u044b\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c.<\/p>\n<pre><code class=\"javascript\">\"use strict\"  function doLogThis() { console.log(\"this is\", this) }  let thisArg = 1  doLogThis.call(thisArg) \/\/ 1 doLogThis.apply(thisArg) \/\/ 1 doLogThis.bind(thisArg)() \/\/ 1<\/code><\/pre>\n<p>\u0412 \u043d\u0430\u0448\u0435\u043c \u043f\u0440\u0438\u043c\u0435\u0440\u0435 \u0444\u0443\u043d\u043a\u0446\u0438\u044f <code>doLogThis<\/code> \u0432\u044b\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u0441 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435\u043c \u043c\u0435\u0442\u043e\u0434\u043e\u0432 <code>call<\/code>, <code>apply<\/code>, <code>bind<\/code> \u0441 \u043f\u0435\u0440\u0435\u0434\u0430\u043d\u043d\u044b\u043c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435\u043c <code>thisArg<\/code> (\u0432\u0441\u0435 \u0441\u0440\u0430\u0437\u0443 \u0443\u043a\u0430\u0437\u0430\u043d\u044b \u0434\u043b\u044f \u043f\u0440\u0438\u043c\u0435\u0440\u0430), \u0430 \u044d\u0442\u043e \u0437\u043d\u0430\u0447\u0438\u0442 <code>this<\/code> \u0440\u0430\u0432\u0435\u043d <code>thisArg<\/code> (\u0442\u043e\u043c\u0443, \u0447\u0442\u043e \u043c\u044b \u043f\u0435\u0440\u0435\u0434\u0430\u043b\u0438 \u0432 \u043c\u0435\u0442\u043e\u0434\u044b).<\/p>\n<p>\u041c\u043d\u043e\u0433\u0438\u0435 \u043c\u043e\u0433\u0443\u0442 \u043f\u043e\u0434\u0443\u043c\u0430\u0442\u044c, \u0447\u0442\u043e <code>this<\/code> \u0441\u0432\u044f\u0437\u0430\u043d \u0441 \u043a\u0430\u043a\u043e\u0439-\u0442\u043e \u0441\u043b\u043e\u0436\u043d\u043e\u0439 \u043e\u0431\u044a\u0435\u043a\u0442\u043d\u043e\u0439 \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u043e\u0439, \u043d\u043e \u044d\u0442\u043e \u043d\u0435 \u0442\u0430\u043a. \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044f <code>call<\/code>, <code>apply<\/code>, <code>bind<\/code> \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u0441\u0432\u044f\u0437\u0430\u0442\u044c <code>this<\/code> \u0438 \u0441 \u043b\u044e\u0431\u044b\u043c \u043f\u0440\u0438\u043c\u0438\u0442\u0438\u0432\u043d\u044b\u043c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435\u043c.<\/p>\n<p>\u0420\u0430\u0437\u0431\u0435\u0440\u0435\u043c \u043c\u0435\u0442\u043e\u0434\u044b <code>call<\/code>, <code>bind<\/code> \u0438 <code>apply<\/code> \u0431\u043e\u043b\u0435\u0435 \u043f\u043e\u0434\u0440\u043e\u0431\u043d\u043e.<\/p>\n<h4>call()<\/h4>\n<p><code>call()<\/code> &#8212; \u044d\u0442\u043e \u043c\u0435\u0442\u043e\u0434, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0432\u044b\u0437\u0432\u0430\u0442\u044c \u0444\u0443\u043d\u043a\u0446\u0438\u044e, \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u044f \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442 (<code>this<\/code>) \u0438 \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u044f \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u044b \u0432 \u0432\u0438\u0434\u0435 \u0441\u043f\u0438\u0441\u043a\u0430.<\/p>\n<pre><code class=\"javascript\">const person1 = {   name: 'Alice',   greet: function(place) {     console.log(`Hello, ${this.name}! Welcome to ${place}.`);   } };  const person2 = {   name: 'Bob' };  person1.greet.call(person2, 'the park');  \/\/ \u0412\u044b\u0432\u043e\u0434: Hello, Bob! Welcome to the park.<\/code><\/pre>\n<p>\u0412 \u044d\u0442\u043e\u043c \u043f\u0440\u0438\u043c\u0435\u0440\u0435 \u043c\u044b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043b\u0438 <code>call()<\/code> \u0434\u043b\u044f \u0432\u044b\u0437\u043e\u0432\u0430 \u043c\u0435\u0442\u043e\u0434\u0430 <code>greet<\/code> \u043e\u0431\u044a\u0435\u043a\u0442\u0430 <code>person1<\/code>, \u043d\u043e \u0441 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u043e\u043c \u043e\u0431\u044a\u0435\u043a\u0442\u0430 <code>person2<\/code>. \u042d\u0442\u043e \u043f\u043e\u0437\u0432\u043e\u043b\u0438\u043b\u043e \u043d\u0430\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043c\u0435\u0442\u043e\u0434 <code>greet<\/code> \u043e\u0431\u044a\u0435\u043a\u0442\u0430 <code>person1<\/code>, \u043d\u043e \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u0442\u0430\u043a, \u0447\u0442\u043e\u0431\u044b <code>this<\/code> \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u043b\u043e \u043d\u0430 <code>person2<\/code>.<\/p>\n<h4>apply()<\/h4>\n<p><code>apply()<\/code> \u043f\u043e\u0445\u043e\u0436 \u043d\u0430 <code>call()<\/code>, \u043d\u043e \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u0435\u0442 \u0430\u0440\u0433\u0443\u043c\u0435\u043d\u0442\u044b \u0432 \u0432\u0438\u0434\u0435 \u043c\u0430\u0441\u0441\u0438\u0432\u0430<\/p>\n<pre><code class=\"javascript\">const numbers = [2, 4, 6, 8, 10]; const maxNumber = Math.max.apply(null, numbers);  console.log(maxNumber); \/\/ \u0412\u044b\u0432\u043e\u0434: 10<\/code><\/pre>\n<p>\u0417\u0434\u0435\u0441\u044c \u043c\u044b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043b\u0438 <code>apply()<\/code> \u0434\u043b\u044f \u0432\u044b\u0437\u043e\u0432\u0430 \u043c\u0435\u0442\u043e\u0434\u0430 <code>Math.max<\/code>, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043e\u0431\u044b\u0447\u043d\u043e \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u0435\u0442 \u0441\u043f\u0438\u0441\u043e\u043a \u0447\u0438\u0441\u0435\u043b \u043a\u0430\u043a \u0430\u0440\u0433\u0443\u043c\u0435\u043d\u0442\u044b, \u043d\u043e \u0432 \u0434\u0430\u043d\u043d\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u043c\u044b \u043f\u0435\u0440\u0435\u0434\u0430\u043b\u0438 \u043c\u0430\u0441\u0441\u0438\u0432 <code>numbers<\/code>. <code>apply()<\/code> \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043c\u0430\u0441\u0441\u0438\u0432 \u0432 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u0430\u0440\u0433\u0443\u043c\u0435\u043d\u0442\u043e\u0432 \u0444\u0443\u043d\u043a\u0446\u0438\u0438.<\/p>\n<h4>bind()<\/h4>\n<p><code>bind()<\/code> \u0441\u043e\u0437\u0434\u0430\u0435\u0442 \u043d\u043e\u0432\u0443\u044e \u0444\u0443\u043d\u043a\u0446\u0438\u044e \u0441 \u043f\u0440\u0438\u0432\u044f\u0437\u0430\u043d\u043d\u044b\u043c \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u043e\u043c (<code>this<\/code>), \u043a\u043e\u0442\u043e\u0440\u0443\u044e \u043c\u043e\u0436\u043d\u043e \u0432\u044b\u0437\u0432\u0430\u0442\u044c \u043f\u043e\u0437\u0436\u0435.<\/p>\n<pre><code class=\"javascript\">const obj = {   value: 30,   getValue: function() {     return this.value;   } };  const getValue = obj.getValue; const boundGetValue = obj.getValue.bind(obj);  console.log(getValue()); \/\/ \u0412\u044b\u0432\u043e\u0434: undefined (\u0442\u0430\u043a \u043a\u0430\u043a \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442 \u043d\u0435 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d) console.log(boundGetValue()); \/\/ \u0412\u044b\u0432\u043e\u0434: 30<\/code><\/pre>\n<p><code>getValue<\/code> \u0431\u0435\u0437 \u043f\u0440\u0438\u0432\u044f\u0437\u043a\u0438 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u0430 \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u0442 <code>undefined<\/code>, \u0442\u0430\u043a \u043a\u0430\u043a \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442 \u0442\u0435\u0440\u044f\u0435\u0442\u0441\u044f \u043f\u0440\u0438 \u0441\u043e\u0445\u0440\u0430\u043d\u0435\u043d\u0438\u0438 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u0432 \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u0439. \u041d\u043e <code>boundGetValue<\/code>, \u0441\u043e\u0437\u0434\u0430\u043d\u043d\u0430\u044f \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e <code>bind()<\/code>, \u0441\u043e\u0445\u0440\u0430\u043d\u044f\u0435\u0442 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442 \u043e\u0431\u044a\u0435\u043a\u0442\u0430 <code>obj<\/code> \u0438 \u0443\u0441\u043f\u0435\u0448\u043d\u043e \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u0442 <code>30<\/code>.<\/p>\n<hr\/>\n<h3>this \u0438 new<\/h3>\n<figure class=\"full-width\"><\/figure>\n<p>\u041f\u0440\u0438\u043c\u0435\u0440:<\/p>\n<pre><code class=\"javascript\">\"use strict\"  function doLogThis() { console.log(\"this is\", this) }  new doLogThis(); \/\/ {} new doLogThis; \/\/ {}<\/code><\/pre>\n<p>\u0412 \u0434\u0430\u043d\u043d\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u0432\u044b\u0437\u043e\u0432 <code>doLogThis<\/code> \u043f\u0440\u043e\u0438\u0437\u043e\u0448\u0435\u043b \u043f\u0440\u0438 \u043f\u043e\u043c\u043e\u0449\u0438 \u043a\u043b\u044e\u0447\u0435\u0432\u043e\u0433\u043e \u0441\u043b\u043e\u0432\u0430 <code>new<\/code>.<\/p>\n<p>\u041a\u043b\u044e\u0447\u0435\u0432\u043e\u0435 \u0441\u043b\u043e\u0432\u043e <code>new<\/code> \u0432\u044b\u0437\u044b\u0432\u0430\u0435\u0442 \u0444\u0443\u043d\u043a\u0446\u0438\u044e, \u043a\u0440\u043e\u043c\u0435 \u0441\u0442\u0440\u0435\u043b\u043e\u0447\u043d\u043e\u0439 \u0444\u0443\u043d\u043a\u0446\u0438\u0438.<\/p>\n<p>\u041a\u043b\u044e\u0447\u0435\u0432\u043e\u0435 \u0441\u043b\u043e\u0432\u043e <code>new<\/code> \u0432\u044b\u0437\u044b\u0432\u0430\u0435\u0442 \u0444\u0443\u043d\u043a\u0446\u0438\u044e \u0438 <code>this<\/code> \u0441\u0432\u044f\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u0441 \u043f\u0443\u0441\u0442\u044b\u043c \u043e\u0431\u044a\u0435\u043a\u0442\u043e\u043c <code>{}<\/code>.<\/p>\n<p>\u0418\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c <code>()<\/code> \u0434\u043b\u044f \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f <strong>call expression<\/strong> \u043d\u0435 \u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u043e.<\/p>\n<hr\/>\n<h3>Call API<\/h3>\n<p>\u0422<\/p>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[],"tags":[],"class_list":["post-365088","post","type-post","status-publish","format-standard","hentry"],"_links":{"self":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts\/365088","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=365088"}],"version-history":[{"count":0,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts\/365088\/revisions"}],"wp:attachment":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=365088"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=365088"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=365088"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}