{"id":366067,"date":"2024-05-21T02:51:34","date_gmt":"2024-05-21T02:51:34","guid":{"rendered":"http:\/\/savepearlharbor.com\/?p=366067"},"modified":"-0001-11-30T00:00:00","modified_gmt":"-0001-11-29T21:00:00","slug":"","status":"publish","type":"post","link":"https:\/\/savepearlharbor.com\/?p=366067","title":{"rendered":"<span>ECMAScript 6+ vs TypeScript<\/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<p>\u041c\u0438\u043d\u0443\u043b\u0438 \u0442\u0435 \u0432\u0440\u0435\u043c\u0435\u043d\u0430, \u043a\u043e\u0433\u0434\u0430 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0438 \u043f\u0438\u0441\u0430\u043b\u0438 Frontend \u043d\u0430 \u00ab\u0447\u0438\u0441\u0442\u043e\u043c\u00bb <strong>JavaScript<\/strong> (\u0432\u043f\u043b\u043e\u0442\u044c \u0434\u043e <strong>ECMAScript 5<\/strong>). \u0412\u0441\u0435 \u0438\u0437\u043c\u0435\u043d\u0438\u043b\u043e\u0441\u044c \u0441\u00a0\u0432\u044b\u0445\u043e\u0434\u043e\u043c \u0432\u00a0\u0441\u0432\u0435\u0442 \u0432\u0435\u0440\u0441\u0438\u0438 <strong>ECMAScript 6<\/strong> \u0432 2015-\u043c \u0433\u043e\u0434\u0443. \u042d\u0442\u043e \u0441\u043e\u0431\u044b\u0442\u0438\u0435 \u0441\u0442\u0430\u043b\u043e, \u043f\u043e\u00a0\u0438\u0441\u0442\u0438\u043d\u0435 \u0437\u043d\u0430\u0447\u0438\u043c\u044b\u043c \u0432\u00a0\u043c\u0438\u0440\u043e\u0432\u043e\u0439 Frontend \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0435. \u041f\u0440\u0435\u0434\u044b\u0434\u0443\u0449\u0438\u0435 6\u00a0\u043b\u0435\u0442 \u0434\u043e\u00a0\u044d\u0442\u043e\u0433\u043e, \u044f\u0437\u044b\u043a \u043f\u0440\u0430\u043a\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u043d\u0435\u00a0\u043c\u0435\u043d\u044f\u043b\u0441\u044f. \u0413\u043e\u0434\u043e\u043c \u0440\u0430\u043d\u0435\u0435, \u0432 2014-\u043c, \u043a\u043e\u043c\u043f\u0430\u043d\u0438\u044f Microsoft \u043e\u043f\u0443\u0431\u043b\u0438\u043a\u043e\u0432\u0430\u043b\u0430 <strong>TypeScript 1.0<\/strong> \u0438 \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u0438\u043b\u0430 \u0432\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u0443\u044e \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u043a\u0443 \u044f\u0437\u044b\u043a\u0430 \u0432\u00a0\u0441\u0432\u043e\u0435\u0439 IDE <a href=\"https:\/\/ru.wikipedia.org\/wiki\/Microsoft_Visual_Studio#Visual_Studio_2013\" rel=\"noopener noreferrer nofollow\">VisualStudio 2013<\/a>. \u041d\u0430\u00a0\u0441\u0430\u043c\u043e\u043c \u0434\u0435\u043b\u0435, \u043e\u0444\u0438\u0446\u0438\u0430\u043b\u044c\u043d\u043e, <strong>TypeScript<\/strong>\u00a0\u0431\u044b\u043b \u0432\u044b\u043f\u0443\u0449\u0435\u043d \u0435\u0449\u0435 \u0432 2012\u00a0(\u0432\u0435\u0440\u0441\u0438\u044f 0.8), \u043e\u0434\u043d\u0430\u043a\u043e, \u043f\u043e\u043f\u0443\u043b\u044f\u0440\u043d\u043e\u0441\u0442\u044c\u044e \u043e\u043d \u043d\u0435\u00a0\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043b\u0441\u044f \u0432\u00a0\u0432\u0438\u0434\u0443 \u043f\u0440\u0430\u043a\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u043f\u043e\u043b\u043d\u043e\u0433\u043e \u043e\u0442\u0441\u0443\u0442\u0441\u0442\u0432\u0438\u044f \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u043a\u0438 \u0441\u043e \u0441\u0442\u043e\u0440\u043e\u043d\u044b \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u044e\u0449\u0438\u0445, \u043d\u0430\u00a0\u0442\u043e\u0442 \u043c\u043e\u043c\u0435\u043d\u0442, IDE.<\/p>\n<p>\u0421\u00a0\u0442\u0435\u0445 \u043f\u0440\u043e\u0448\u043b\u043e \u043c\u043d\u043e\u0433\u043e \u0432\u0440\u0435\u043c\u0435\u043d\u0438. \u041e\u0431\u0430 \u044f\u0437\u044b\u043a\u0430 \u0440\u0430\u0437\u0432\u0438\u0432\u0430\u043b\u0438\u0441\u044c \u043f\u0430\u0440\u0430\u043b\u043b\u0435\u043b\u044c\u043d\u043e. \u0412\u00a0\u0447\u0435\u043c\u2011\u0442\u043e \u043e\u043d\u0438 \u0441\u0445\u043e\u0436\u0438, \u0432\u00a0\u0447\u0435\u043c\u2011\u0442\u043e \u043a\u0430\u0440\u0434\u0438\u043d\u0430\u043b\u044c\u043d\u043e \u0440\u0430\u0437\u043b\u0438\u0447\u0430\u044e\u0442\u0441\u044f. \u041a\u0430\u0436\u0434\u044b\u0439 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a \u0438 \u043a\u0430\u0436\u0434\u0430\u044f \u043a\u043e\u043c\u0430\u043d\u0434\u0430 \u0432\u043e\u043b\u044c\u043d\u0430 \u0441\u0430\u043c\u043e\u0441\u0442\u043e\u044f\u0442\u0435\u043b\u044c\u043d\u043e \u0440\u0435\u0448\u0430\u0442\u044c, \u043a\u0430\u043a\u043e\u0439 \u0438\u0437\u00a0\u043d\u0438\u0445 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c. \u0412\u00a0\u044d\u0442\u043e \u0441\u0442\u0430\u0442\u044c\u0435 \u043f\u043e\u043f\u0440\u043e\u0431\u0443\u0435\u043c \u043d\u0430\u0439\u0442\u0438 \u0442\u043e\u0447\u043a\u0438, \u043a\u0430\u043a\u00a0\u043f\u0435\u0440\u0435\u0441\u0435\u0447\u0435\u043d\u0438\u044f, \u0442\u0430\u043a \u0438 \u0440\u0430\u0441\u0445\u043e\u0436\u0434\u0435\u043d\u0438\u044f \u044d\u0442\u0438\u0445 \u0434\u0432\u0443\u0445 \u044f\u0437\u044b\u043a\u043e\u0432 \u0438 \u0441\u0440\u0430\u0432\u043d\u0438\u043c \u0438\u0445 \u043f\u043e\u0434\u0445\u043e\u0434\u044b.<\/p>\n<p>\u0422\u0438\u043f\u0438\u0437\u0430\u0446\u0438\u044e <strong>TypeScript<\/strong> \u0440\u0430\u0441\u0441\u043c\u0430\u0442\u0440\u0438\u0432\u0430\u0442\u044c \u0432\u00a0\u044d\u0442\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0435 \u043d\u0435\u00a0\u0431\u0443\u0434\u0435\u043c, \u0442.\u043a. \u043e\u0447\u0435\u0432\u0438\u0434\u043d\u043e, \u0447\u0442\u043e\u00a0\u0432 <strong>ECMAScript<\/strong> \u0435\u0451 \u043d\u0435\u0442, \u0438 \u0441\u0440\u0430\u0432\u043d\u0438\u0432\u0430\u0442\u044c \u0442\u0443\u0442 \u043d\u0435\u0447\u0435\u0433\u043e.<\/p>\n<p>\u0414\u043b\u044f\u00a0\u0447\u0438\u0441\u0442\u043e\u0442\u044b \u044d\u043a\u0441\u043f\u0435\u0440\u0438\u043c\u0435\u043d\u0442\u0430 \u043a\u043e\u0434 \u0431\u0443\u0434\u0435\u043c \u0442\u0440\u0430\u043d\u0441\u043f\u0438\u043b\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0432\u00a0\u0441\u0442\u0430\u0440\u044b\u0439 \u0434\u043e\u0431\u0440\u044b\u0439 <strong>ECMAScript 5<\/strong>. <strong>TypeScript<\/strong>, \u0434\u043b\u044f\u00a0\u0443\u0434\u043e\u0431\u0441\u0442\u0432\u0430, \u0432\u043e\u0437\u044c\u043c\u0435\u043c \u0432\u0435\u0440\u0441\u0438\u0438 4.8.4\u00a0(\u044d\u0442\u043e\u0439 \u0432\u0435\u0440\u0441\u0438\u0438, \u0434\u043b\u044f\u00a0\u0446\u0435\u043b\u0435\u0439 \u0441\u0442\u0430\u0442\u044c\u0438 \u0434\u043e\u0441\u0442\u0430\u0442\u043e\u0447\u043d\u043e) \u0438 \u0431\u0443\u0434\u0435\u043c \u043a\u043e\u043c\u043f\u0438\u043b\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0435\u0433\u043e \u0440\u043e\u0434\u043d\u044b\u043c <code>tsc<\/code> \u043a\u043e\u043c\u043f\u0438\u043b\u044f\u0442\u043e\u0440\u043e\u043c. \u0414\u043b\u044f <strong>ECMAScript<\/strong> \u0432\u043e\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u0441\u044f \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u0430\u0440\u0438\u0435\u043c <code>Babel<\/code>.<\/p>\n<h3>\u041e\u0431\u044a\u044f\u0432\u043b\u0435\u043d\u0438\u0435 \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0445<\/h3>\n<p>\u041d\u0430\u0447\u043d\u0435\u043c \u0441 \u0441\u0430\u043c\u043e\u0433\u043e \u043f\u0440\u043e\u0441\u0442\u043e\u0433\u043e, \u0441 \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0445. \u0412 \u044d\u0442\u043e\u0439 \u0447\u0430\u0441\u0442\u0438, \u043e\u0431\u0430 \u044f\u0437\u044b\u043a\u0430 \u0438\u043c\u0435\u044e\u0442 \u0438\u0434\u0435\u043d\u0442\u0438\u0447\u043d\u044b\u0439 \u0441\u0438\u043d\u0442\u0430\u043a\u0441\u0438\u0441.<\/p>\n<h4>ECMAScript<\/h4>\n<pre><code class=\"javascript\">let a = \"\"; const b = \"\"; var c = \"\";<\/code><\/pre>\n<pre><code class=\"javascript\">\/\/ == babel == var a = \"\"; var b = \"\"; var c = \"\";<\/code><\/pre>\n<h4>TypeScript<\/h4>\n<pre><code class=\"typescript\">let a = \"\"; const b = \"\"; var c = \"\";<\/code><\/pre>\n<pre><code class=\"javascript\">\/\/ == tsc == var a = \"\"; var b = \"\"; var c = \"\";<\/code><\/pre>\n<p>\u0412\u00a0\u043e\u0431\u043e\u0438\u0445 \u0441\u043b\u0443\u0447\u0430\u044f\u0445, \u043f\u043e\u0441\u043b\u0435 \u0442\u0440\u0430\u043d\u0441\u043f\u0438\u043b\u044f\u0446\u0438\u0438, \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0435 \u043f\u0440\u0438\u0432\u043e\u0434\u044f\u0442\u0441\u044f \u043a\u00a0\u0435\u0434\u0438\u043d\u0441\u0442\u0432\u0435\u043d\u043d\u043e\u043c\u0443 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u043c\u0443 \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u0443 \u0434\u0435\u043a\u043b\u0430\u0440\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0445 \u0432 <strong>ECMAScript 5<\/strong>, \u043f\u043e\u0441\u0440\u0435\u0434\u0441\u0442\u0432\u043e\u043c <strong>var<\/strong>.<\/p>\n<p>\u041e\u0434\u043d\u0430\u043a\u043e, \u043c\u044b \u0437\u043d\u0430\u0435\u043c, \u0447\u0442\u043e <strong>let<\/strong> \u0438 <strong>const<\/strong> \u043e\u0442\u043b\u0438\u0447\u0430\u044e\u0442\u0441\u044f \u043e\u0442 <strong>var<\/strong> \u0442\u0435\u043c, \u0447\u0442\u043e\u00a0\u043e\u0431\u043b\u0430\u0441\u0442\u044c \u0438\u0445 \u0432\u0438\u0434\u0438\u043c\u043e\u0441\u0442\u0438 \u043e\u0433\u0440\u0430\u043d\u0438\u0447\u0435\u043d\u0430 <a href=\"https:\/\/tc39.es\/ecma262\/#sec-execution-contexts\" rel=\"noopener noreferrer nofollow\">LexicalEnvironment<\/a>.<\/p>\n<p>\u041f\u043e\u043f\u0440\u043e\u0431\u0443\u0435\u043c \u043e\u0431\u0435\u0440\u043d\u0443\u0442\u044c \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u0443\u044e <strong>let<\/strong> \u0432\u00a0\u043f\u0440\u043e\u0441\u0442\u0435\u0439\u0448\u0438\u0439 LexicalEnvironment\u00a0\u2014 <a href=\"https:\/\/tc39.es\/ecma262\/#sec-block\" rel=\"noopener noreferrer nofollow\">Block<\/a>.<\/p>\n<h4>ECMAScript<\/h4>\n<pre><code class=\"javascript\">{   let a = \"1\"; }  a = \"2\";<\/code><\/pre>\n<pre><code class=\"javascript\">\/\/ == babel == {   var _a = \"1\"; \/\/ babel \u0434\u043e\u0431\u0430\u0432\u0438\u043b \u043f\u0440\u0435\u0444\u0438\u043a\u0441 \"_\" \u043a \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u0439, \u0442\u0430\u043a\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c,                 \/\/ \u043e\u0442\u0434\u0435\u043b\u0438\u0432 \u0435\u0451 \u043e\u0442 \u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u043e\u0439 \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u0439 \"a\" \u043d\u0438\u0436\u0435 } a = \"2\";<\/code><\/pre>\n<h4>TypeScript<\/h4>\n<pre><code class=\"typescript\">{   let a = \"1\"; }  a = \"2\";<\/code><\/pre>\n<pre><code class=\"javascript\">\/\/ == tsc == {   var a = \"1\"; \/\/ tsc \u043d\u0435 \u043f\u0435\u0440\u0435\u0438\u043c\u0435\u043d\u043e\u0432\u0430\u043b \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u0443\u044e \u0438 \u043d\u0438\u043a\u0430\u043a\u0438\u043c \u0434\u0440\u0443\u0433\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c                \/\/ \u043d\u0435 \u0438\u0437\u043e\u043b\u0438\u0440\u043e\u0432\u0430\u043b \u0435\u0451 \u043e\u0442 \u043f\u0435\u0440\u0435\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u044f \u043d\u0438\u0436\u0435. } a = \"2\";<\/code><\/pre>\n<p>\u041a\u0430\u043a\u00a0\u0432\u0438\u0434\u0438\u043c\u043e \u0438\u0437\u00a0\u043f\u0440\u0438\u043c\u0435\u0440\u0430, <strong>TypeScript<\/strong> \u043d\u0438\u043a\u0430\u043a \u043d\u0435\u00a0\u043f\u043e\u0437\u0430\u0431\u043e\u0442\u0438\u043b\u0441\u044f \u043e\u0431\u00a0\u0438\u0437\u043e\u043b\u044f\u0446\u0438\u0438 \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u0439 <strong>let<\/strong> \u0432 <em>runtime<\/em>. \u0412\u00a0\u044d\u0442\u043e\u0439 \u0447\u0430\u0441\u0442\u0438 \u043a\u043e\u043c\u043f\u0438\u043b\u044f\u0442\u043e\u0440 \u043f\u043e\u043b\u043d\u043e\u0441\u0442\u044c\u044e \u043f\u043e\u043b\u0430\u0433\u0430\u0435\u0442\u0441\u044f \u043d\u0430 <em>compile time<\/em> \u0438\u0441\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435. \u0417\u043d\u0430\u0447\u0438\u0442\u00a0\u043b\u0438 \u044d\u0442\u043e, \u0447\u0442\u043e <strong>TypeScript<\/strong> \u043d\u0435\u00a0\u0431\u0435\u0437\u043e\u043f\u0430\u0441\u0435\u043d \u0432\u00a0runtime \u0432\u00a0\u043f\u0440\u0438\u043d\u0446\u0438\u043f\u0435?<\/p>\n<p>\u0414\u0430\u0432\u0430\u0439\u0442\u0435 \u0432\u0437\u0433\u043b\u044f\u043d\u0435\u043c \u043d\u0430\u00a0\u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0439 \u043f\u0440\u0438\u043c\u0435\u0440:<\/p>\n<h4>ECMAScript<\/h4>\n<pre><code class=\"javascript\">{   let a = \"1\";    setTimeout(() => {     console.log(a);   }, 0); } a = \"2\";<\/code><\/pre>\n<pre><code class=\"javascript\">\/\/ == babel == {   var _a = \"1\";   setTimeout(function () {     console.log(_a);   }, 0); } a = \"2\";<\/code><\/pre>\n<p>\u0421\u00a0\u0442\u043e\u0447\u043a\u0438 \u0437\u0440\u0435\u043d\u0438\u044f <strong>ECMAScript<\/strong> \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u0430\u044f \u043f\u043e\u00a0\u043f\u0440\u0435\u0436\u043d\u0435\u043c\u0443 \u00ab\u0438\u0437\u043e\u043b\u0438\u0440\u043e\u0432\u0430\u043d\u0430\u00bb \u0438 \u043f\u0435\u0440\u0435\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u044f \u043d\u0435\u00a0\u043f\u0440\u043e\u0438\u0437\u043e\u0439\u0434\u0435\u0442.<\/p>\n<h4>TypeScript<\/h4>\n<pre><code class=\"typescript\">{   let a = \"1\";      setTimeout(() => {     console.log(a);   }, 0); }  a = \"2\";<\/code><\/pre>\n<pre><code class=\"javascript\">\/\/ == tsc == {   var a_1 = \"1\";       setTimeout(function () {     console.log(a_1);   }, 0); } a = \"2\";<\/code><\/pre>\n<p>\u0412\u00a0\u044d\u0442\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435, <strong>TypeScript<\/strong> \u0443\u0447\u0435\u043b \u0444\u0430\u043a\u0442 \u0442\u043e\u0433\u043e, \u0447\u0442\u043e\u00a0\u043a\u00a0\u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u0439 \u0435\u0441\u0442\u044c \u043e\u0431\u0440\u0430\u0449\u0435\u043d\u0438\u0435 \u0432\u00a0\u043c\u0430\u043a\u0440\u043e\u0442\u0430\u0441\u043a\u0435 \u0438 \u043f\u043e\u0437\u0430\u0431\u043e\u0442\u0438\u043b\u0441\u044f \u043e\u00a0\u0435\u0451 \u0438\u0437\u043e\u043b\u044f\u0446\u0438\u0438, \u0430\u043d\u0430\u043b\u043e\u0433\u0438\u0447\u043d\u043e <strong>ECMAScript<\/strong>. \u0421\u00a0\u0442\u043e\u0447\u043a\u0438 \u0437\u0440\u0435\u043d\u0438\u044f \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430, \u0438\u0437\u043e\u043b\u044f\u0446\u0438\u044f \u043e\u0431\u0435\u0441\u043f\u0435\u0447\u0435\u043d\u0430, \u043e\u0434\u043d\u0430\u043a\u043e \u0432\u043e\u043f\u0440\u043e\u0441 \u0437\u043b\u043e\u043d\u0430\u043c\u0435\u0440\u0435\u043d\u043d\u044b\u0445 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0439 \u0438\u0437\u00a0\u0432\u043d\u0435, \u0432\u0441\u0451 \u0435\u0449\u0451 \u043e\u0441\u0442\u0430\u0435\u0442\u0441\u044f \u043e\u0442\u043a\u0440\u044b\u0442. \u041f\u043e\u00a0\u043a\u0440\u0430\u0439\u043d\u0435\u0439 \u043c\u0435\u0440\u0435, \u044d\u0442\u043e \u0447\u0443\u0442\u044c \u043c\u0435\u043d\u0435\u0435 \u0431\u0435\u0437\u043e\u043f\u0430\u0441\u043d\u043e, \u0447\u0435\u043c \u0432\u00a0\u0441\u043b\u0443\u0447\u0430\u0435 \u0441 <strong>ECMAScript<\/strong>.<\/p>\n<p>C <strong>let<\/strong> \u0440\u0430\u0437\u043e\u0431\u0440\u0430\u043b\u0438\u0441\u044c, \u0434\u0430\u0432\u0430\u0439\u0442\u0435 \u0442\u0435\u043f\u0435\u0440\u044c \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0438\u043c \u043d\u0430 <strong>const<\/strong>.<\/p>\n<h4>ECMAScript<\/h4>\n<pre><code class=\"javascript\">const b = \"1\"; b = \"2\";<\/code><\/pre>\n<pre><code class=\"javascript\">\/\/ == babel == function _readOnlyError(name) {   throw new TypeError('\"' + name + '\" is read-only'); } var b = \"1\"; \"2\", _readOnlyError(\"b\");<\/code><\/pre>\n<p><strong>Babel<\/strong> \u043d\u0435\u00a0\u043f\u043e\u0437\u0432\u043e\u043b\u0438\u043b \u043f\u0435\u0440\u0435\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0438\u0442\u044c \u043a\u043e\u043d\u0441\u0442\u0430\u043d\u0442\u0443 \u0438 \u0432\u0435\u0440\u043d\u0443\u043b \u0438\u0441\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435 \u0432\u00a0runtime.<\/p>\n<h4>TypeScript<\/h4>\n<pre><code class=\"typescript\">const b = \"1\"; b = \"2\";<\/code><\/pre>\n<pre><code class=\"javascript\">\/\/ == tsc == const b = \"1\"; b = \"2\";<\/code><\/pre>\n<p><strong>TypeScript<\/strong>, \u043a\u0430\u043a\u00a0\u0438 \u0432\u00a0\u0441\u043b\u0443\u0447\u0430\u0435 \u0441 <strong>let<\/strong>, \u043d\u0438\u043a\u0430\u043a \u043d\u0435\u00a0\u043f\u043e\u0437\u0430\u0431\u043e\u0442\u0438\u043b\u0441\u044f \u043e\u00a0\u0437\u0430\u0449\u0438\u0442\u0435 <strong>const<\/strong> \u0432 <em>runtime<\/em>, \u043f\u043e\u043b\u0430\u0433\u0430\u044f\u0441\u044c \u043d\u0430\u00a0\u043e\u0448\u0438\u0431\u043a\u0443 \u043a\u043e\u043c\u043f\u0438\u043b\u044f\u0446\u0438\u0438.<\/p>\n<h3>\u0421\u0442\u0440\u0435\u043b\u043e\u0447\u043d\u044b\u0435 \u0444\u0443\u043d\u043a\u0446\u0438\u0438<\/h3>\n<p>\u0415\u0449\u0435 \u043e\u0434\u043d\u0438\u043c \u043d\u043e\u0432\u043e\u0432\u0432\u0435\u0434\u0435\u043d\u0438\u0435\u043c <strong>ES6<\/strong>, \u0441\u0442\u0430\u043b\u0438 \u0441\u0442\u0440\u0435\u043b\u043e\u0447\u043d\u044b\u0435 \u0444\u0443\u043d\u043a\u0446\u0438\u0438. \u041e\u043d\u0438 \u043e\u0442\u043b\u0438\u0447\u0430\u044e\u0442\u0441\u044f \u043e\u0442\u00a0\u043e\u0431\u044b\u0447\u043d\u044b\u0445 \u043e\u0442\u0441\u0443\u0442\u0441\u0442\u0432\u0438\u0435\u043c \u0441\u043e\u0431\u0441\u0442\u0432\u0435\u043d\u043d\u043e\u0433\u043e \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u0430 \u0438 \u0441\u0441\u044b\u043b\u043a\u0438 \u043d\u0430 <em>arguments<\/em>.<\/p>\n<h4>ECMAScript<\/h4>\n<pre><code class=\"javascript\">const foo = () => {   this.a = \"1\" }<\/code><\/pre>\n<pre><code class=\"javascript\">\/\/ == babel == var _this = this; var foo = function foo() {   _this.a = \"1\"; };<\/code><\/pre>\n<p>\u0417\u0434\u0435\u0441\u044c \u043c\u044b \u0432\u0438\u0434\u0438\u043c, \u0447\u0442\u043e <strong>Babel<\/strong> \u0437\u0430\u043c\u0435\u043d\u0438\u043b \u0441\u0441\u044b\u043b\u043a\u0443 \u043d\u0430\u00a0\u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442 \u0444\u0443\u043d\u043a\u0446\u0438\u0438, \u043f\u0435\u0440\u0435\u043d\u0430\u043f\u0440\u0430\u0432\u0438\u0432 \u043e\u0431\u0440\u0430\u0449\u0435\u043d\u0438\u0435 \u0432\u00a0\u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u044b\u0439 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442.<\/p>\n<h4>TypeScript<\/h4>\n<pre><code class=\"typescript\">const foo = () => { this.a = \"1\" }<\/code><\/pre>\n<pre><code class=\"javascript\">\/\/ == tsc == var _this = this; var foo = function foo() {   _this.a = \"1\"; };<\/code><\/pre>\n<p>\u0410\u0431\u0441\u043e\u043b\u044e\u0442\u043d\u043e \u0438\u0434\u0435\u043d\u0442\u0438\u0447\u043d\u044b\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c \u043f\u043e\u0441\u0442\u0443\u043f\u0438\u043b \u0438\u00a0<strong>tsc<\/strong>.<\/p>\n<p>\u0410 \u043a\u0430\u043a \u043e\u0431\u0441\u0442\u043e\u044f\u0442 \u0434\u0435\u043b\u0430 \u0441 \u043c\u0430\u0441\u0441\u0438\u0432\u043e\u043c\u00a0<em>arguments<\/em>\u00a0\u0444\u0443\u043d\u043a\u0446\u0438\u0438?<\/p>\n<h4>ECMAScript<\/h4>\n<pre><code class=\"javascript\">const foo = () => {   console.log(arguments.length); }<\/code><\/pre>\n<pre><code class=\"javascript\">\/\/ == babel == var _arguments = typeof arguments === \"undefined\" ? void 0 : arguments; var foo = function foo() {   console.log(_arguments.length); };<\/code><\/pre>\n<p><strong>Babel<\/strong> \u043f\u0440\u0435\u0434\u0443\u0441\u043c\u043e\u0442\u0440\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u043f\u0440\u043e\u0432\u0435\u0440\u0438\u043b, \u043d\u0435\u0442\u00a0\u043b\u0438 \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u0439 \u0441\u00a0\u0442\u0430\u043a\u0438\u043c \u0438\u043c\u0435\u043d\u0435\u043c \u0432\u00a0\u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u043e\u043c \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u0435, \u0438 \u0435\u0441\u043b\u0438 \u0432\u0434\u0440\u0443\u0433 \u0435\u0441\u0442\u044c, \u043e\u043d \u0432\u0435\u0440\u043d\u0435\u0442 \u0441\u0441\u044b\u043b\u043a\u0443 \u043d\u0430\u00a0\u043d\u0435\u0433\u043e. \u0412\u00a0\u043f\u0440\u043e\u0442\u0438\u0432\u043d\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u043c\u0430\u0441\u0441\u0438\u0432 \u0431\u0443\u0434\u0435\u0442 \u043d\u0435\u00a0\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d.<\/p>\n<h4>TypeScript<\/h4>\n<pre><code class=\"typescript\">const foo = () => {   console.log(arguments.length); }<\/code><\/pre>\n<pre><code class=\"javascript\">\/\/ == tsc == var foo = function () {   console.log(arguments.length); };<\/code><\/pre>\n<p>\u0412\u00a0\u0441\u043b\u0443\u0447\u0430\u0435 \u0441 <strong>TypeScript<\/strong>, \u0441\u0441\u044b\u043b\u043a\u0430 \u043d\u0430\u00a0arguments \u0431\u0443\u0434\u0435\u0442 \u0432\u0435\u0441\u0442\u0438 \u043d\u0430\u00a0\u0440\u0435\u0430\u043b\u044c\u043d\u044b\u0439 \u043c\u0430\u0441\u0441\u0438\u0432 \u0430\u0440\u0433\u0443\u043c\u0435\u043d\u0442\u043e\u0432 \u0444\u0443\u043d\u043a\u0446\u0438\u0438, \u0438\u0441\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435 \u0441\u043b\u0443\u0447\u0438\u0442\u0441\u044f \u0442\u043e\u043b\u044c\u043a\u043e \u0432 <em>compile time<\/em>.<\/p>\n<h3>\u041a\u043b\u0430\u0441\u0441\u044b<\/h3>\n<p>\u041e\u0434\u043d\u0438\u043c \u0438\u0437\u00a0\u0432\u0430\u0436\u043d\u0435\u0439\u0448\u0438\u0445 \u043d\u043e\u0432\u043e\u0432\u0432\u0435\u0434\u0435\u043d\u0438\u0435 <strong>ES6<\/strong>\u00a0\u0431\u044b\u043b\u0438 \u043a\u043b\u0430\u0441\u0441\u044b. \u0412\u0437\u0433\u043b\u044f\u043d\u0435\u043c \u043d\u0430\u00a0\u043f\u0440\u043e\u0441\u0442\u0435\u0439\u0448\u0443\u044e \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044e \u043a\u043b\u0430\u0441\u0441\u0430.<\/p>\n<h4>ECMAScript<\/h4>\n<pre><code class=\"javascript\">class A {}<\/code><\/pre>\n<pre><code class=\"javascript\">\/\/ == babel == function _typeof(o) {   \"@babel\/helpers - typeof\";   return (     (_typeof =       \"function\" == typeof Symbol &amp;&amp; \"symbol\" == typeof Symbol.iterator         ? function (o) {             return typeof o;           }         : function (o) {             return o &amp;&amp;               \"function\" == typeof Symbol &amp;&amp;               o.constructor === Symbol &amp;&amp;               o !== Symbol.prototype               ? \"symbol\"               : typeof o;           }),     _typeof(o)   ); } function _defineProperties(target, props) {   for (var i = 0; i &lt; props.length; i++) {     var descriptor = props[i];     descriptor.enumerable = descriptor.enumerable || false;     descriptor.configurable = true;     if (\"value\" in descriptor) descriptor.writable = true;     Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);   } } function _createClass(Constructor, protoProps, staticProps) {   if (protoProps) _defineProperties(Constructor.prototype, protoProps);   if (staticProps) _defineProperties(Constructor, staticProps);   Object.defineProperty(Constructor, \"prototype\", { writable: false });   return Constructor; } function _toPropertyKey(t) {   var i = _toPrimitive(t, \"string\");   return \"symbol\" == _typeof(i) ? i : String(i); } function _toPrimitive(t, r) {   if (\"object\" != _typeof(t) || !t) return t;   var e = t[Symbol.toPrimitive];   if (void 0 !== e) {     var i = e.call(t, r || \"default\");     if (\"object\" != _typeof(i)) return i;     throw new TypeError(\"@@toPrimitive must return a primitive value.\");   }   return (\"string\" === r ? String : Number)(t); } function _classCallCheck(instance, Constructor) {   if (!(instance instanceof Constructor)) {     throw new TypeError(\"Cannot call a class as a function\");   } } var A = \/*#__PURE__*\/ _createClass(function A() {   _classCallCheck(this, A); });<\/code><\/pre>\n<p>\u041f\u0440\u043e\u0441\u0442\u043e\u0435 \u043e\u0431\u044a\u044f\u0432\u043b\u0435\u043d\u0438\u0435 \u043a\u043b\u0430\u0441\u0441\u0430, \u043f\u043e\u0441\u043b\u0435 \u0442\u0440\u0430\u043d\u0441\u0438\u043f\u043b\u044f\u0446\u0438\u0438 \u0441\u0440\u0435\u0434\u0441\u0442\u0432\u0430\u043c\u0438 Babel, \u043f\u0440\u0438\u0432\u043e\u0434\u0438\u0442 \u043a\u00a0\u0434\u043e\u0432\u043e\u043b\u044c\u043d\u043e \u0433\u0440\u043e\u043c\u043e\u0437\u0434\u043a\u043e\u043c\u0443 \u043a\u043e\u0434\u0443 \u0432\u00a0\u0432\u0438\u0434\u0435 \u043d\u0430\u0431\u043e\u0440\u0430 \u0444\u0430\u0431\u0440\u0438\u043a, \u0447\u0442\u043e\u0431\u044b \u043e\u0431\u0435\u0441\u043f\u0435\u0447\u0438\u0442\u044c \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u044b\u0439 \u0443\u0440\u043e\u0432\u0435\u043d\u044c \u0431\u0435\u0437\u043e\u043f\u0430\u0441\u043d\u043e\u0441\u0442\u0438.<\/p>\n<h4>TypeScript<\/h4>\n<pre><code class=\"typescript\">class A {}<\/code><\/pre>\n<pre><code class=\"javascript\">\/\/ == tsc == var A = \/** @class *\/ (function () {     function A() {     }     return A; }());<\/code><\/pre>\n<p><em>\u0422\u0430\u00a0\u0436\u0435 \u0441\u0430\u043c\u0430\u044f \u0438\u043d\u0441\u0442\u0440\u0443\u043a\u0446\u0438\u044f \u043d\u0430\u00a0TypeScript \u0441\u043e\u0437\u0434\u0430\u0435\u0442 \u0432\u0441\u0435\u0433\u043e \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u0441\u0442\u0440\u043e\u043a \u043a\u043e\u0434\u0430.<\/em><\/p>\n<p><em>\u0414\u043e\u043f\u043e\u043b\u043d\u0438\u043c \u043d\u0430\u0448 \u043a\u043b\u0430\u0441\u0441 \u043f\u043e\u043b\u044f\u043c\u0438 \u0438 \u043c\u0435\u0442\u043e\u0434\u0430\u043c\u0438.<\/em><\/p>\n<h4>ECMAScript<\/h4>\n<pre><code class=\"javascript\">class A {   propA = \"1\";   #probB = \"2\";      methodC() {}      #methodD() {} }<\/code><\/pre>\n<pre><code class=\"javascript\">\/\/ == babel == function _typeof(o) {   \"@babel\/helpers - typeof\";   return (     (_typeof =       \"function\" == typeof Symbol &amp;&amp; \"symbol\" == typeof Symbol.iterator         ? function (o) {             return typeof o;           }         : function (o) {             return o &amp;&amp;               \"function\" == typeof Symbol &amp;&amp;               o.constructor === Symbol &amp;&amp;               o !== Symbol.prototype               ? \"symbol\"               : typeof o;           }),     _typeof(o)   ); } function _classCallCheck(instance, Constructor) {   if (!(instance instanceof Constructor)) {     throw new TypeError(\"Cannot call a class as a function\");   } } function _defineProperties(target, props) {   for (var i = 0; i &lt; props.length; i++) {     var descriptor = props[i];     descriptor.enumerable = descriptor.enumerable || false;     descriptor.configurable = true;     if (\"value\" in descriptor) descriptor.writable = true;     Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);   } } function _createClass(Constructor, protoProps, staticProps) {   if (protoProps) _defineProperties(Constructor.prototype, protoProps);   if (staticProps) _defineProperties(Constructor, staticProps);   Object.defineProperty(Constructor, \"prototype\", { writable: false });   return Constructor; } function _classPrivateMethodInitSpec(obj, privateSet) {   _checkPrivateRedeclaration(obj, privateSet);   privateSet.add(obj); } function _classPrivateFieldInitSpec(obj, privateMap, value) {   _checkPrivateRedeclaration(obj, privateMap);   privateMap.set(obj, value); } function _checkPrivateRedeclaration(obj, privateCollection) {   if (privateCollection.has(obj)) {     throw new TypeError(       \"Cannot initialize the same private elements twice on an object\"     );   } } function _defineProperty(obj, key, value) {   key = _toPropertyKey(key);   if (key in obj) {     Object.defineProperty(obj, key, {       value: value,       enumerable: true,       configurable: true,       writable: true     });   } else {     obj[key] = value;   }   return obj; } function _toPropertyKey(t) {   var i = _toPrimitive(t, \"string\");   return \"symbol\" == _typeof(i) ? i : String(i); } function _toPrimitive(t, r) {   if (\"object\" != _typeof(t) || !t) return t;   var e = t[Symbol.toPrimitive];   if (void 0 !== e) {     var i = e.call(t, r || \"default\");     if (\"object\" != _typeof(i)) return i;     throw new TypeError(\"@@toPrimitive must return a primitive value.\");   }   return (\"string\" === r ? String : Number)(t); } var _propB = \/*#__PURE__*\/ new WeakMap(); var _methodD = \/*#__PURE__*\/ new WeakSet(); var A = \/*#__PURE__*\/ (function () {   function A() {     _classCallCheck(this, A);     _classPrivateMethodInitSpec(this, _methodD);     _defineProperty(this, \"propA\", \"1\");     _classPrivateFieldInitSpec(this, _propB, {       writable: true,       value: \"2\"     });   }   _createClass(A, [     {       key: \"methodC\",       value:         \/\/ private          function methodC() {}        \/\/ private     }   ]);   return A; })(); function _methodD2() {}<\/code><\/pre>\n<p>\u0412\u00a0\u0434\u0430\u043d\u043d\u043e\u043c \u043a\u043b\u0430\u0441\u0441\u0435 \u043f\u0440\u0438\u0441\u0443\u0442\u0441\u0442\u0432\u0443\u044e\u0442 \u043f\u0443\u0431\u043b\u0438\u0447\u043d\u043e\u0435 \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u043e, \u043f\u0440\u0438\u0432\u0430\u0442\u043d\u043e\u0435 \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u043e, \u043f\u0443\u0431\u043b\u0438\u0447\u043d\u044b\u0439 \u043c\u0435\u0442\u043e\u0434 \u0438 \u043f\u0440\u0438\u0432\u0430\u0442\u043d\u044b\u0439 \u043c\u0435\u0442\u043e\u0434. \u041f\u0440\u0438\u0432\u0430\u0442\u043d\u044b\u0435 \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430 \u0438 \u043c\u0435\u0442\u043e\u0434\u0430 Bebel \u043f\u043e\u043c\u0435\u0441\u0442\u0438\u043b \u0432\u00a0Weak\u2011\u043a\u043e\u043b\u043b\u0435\u043a\u0446\u0438\u0438. \u041f\u0443\u0431\u043b\u0438\u0447\u043d\u044b\u0435\u0439\u00a0\u0436\u0435\u00a0\u2014 \u043d\u0430\u0441\u0442\u0440\u043e\u0438\u043b \u043f\u043e\u0441\u0440\u0435\u0434\u0441\u0442\u0432\u043e\u043c <code>Object.defineProperty<\/code>.<\/p>\n<h4>TypeScript<\/h4>\n<pre><code class=\"typescript\">class A {   public propA = \"1\";   protected propB = \"2\";   private propC = \"3\";      public methodD() {}      protected methodE() {}      private methodF() {} }<\/code><\/pre>\n<pre><code class=\"javascript\">\/\/ == tsc == var A = \/** @class *\/ (function () {     function A() {         this.propA = \"1\";            this.propB = \"2\";             this.propC = \"3\";     }     A.prototype.methodD = function () { };     A.prototype.methodE = function () { };     A.prototype.methodF = function () { };     return A; }());<\/code><\/pre>\n<p><em>\u041d\u0435\u00a0\u0441\u043c\u043e\u0442\u0440\u044f \u043d\u0430\u00a0\u0442\u043e, \u0447\u0442\u043e <\/em><strong><em>TypeScript<\/em><\/strong><em> \u0438\u043c\u0435\u0435\u0442 \u0447\u0443\u0442\u044c \u0431\u043e\u043b\u0435\u0435 \u0433\u0438\u0431\u043a\u0443\u044e \u0438 \u0431\u043e\u043b\u0435\u0435 \u0442\u0440\u0430\u0434\u0438\u0446\u0438\u043e\u043d\u043d\u0443\u044e \u043e\u0431\u044a\u0435\u043a\u0442\u043d\u0443\u044e \u043c\u043e\u0434\u0435\u043b\u044c, \u0438\u0442\u043e\u0433\u043e\u0432\u044b\u0439 \u043a\u043e\u0434 \u0432\u0435\u0441\u044c\u043c\u0430 \u043f\u0440\u0438\u043c\u0438\u0442\u0438\u0432\u0435\u043d. \u0421\u0432\u043e\u0439\u0441\u0442\u0432\u0430 \u043f\u0440\u043e\u0441\u0442\u043e \u043f\u043e\u043c\u0435\u0449\u0430\u044e\u0442\u0441\u044f \u0432\u00a0\u0444\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u044b\u0439 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442, \u0430\u00a0\u043c\u0435\u0442\u043e\u0434\u044b\u00a0\u2014 \u0432\u00a0\u043f\u0440\u043e\u0442\u043e\u0442\u0438\u043f. \u041d\u0438\u043a\u0430\u043a\u0438\u0445 \u043f\u0440\u043e\u0432\u0435\u0440\u043e\u043a \u0438 \u043d\u0430\u0441\u0442\u0440\u043e\u0435\u043a \u0441\u0432\u043e\u0439\u0441\u0442\u0432 \u0438 \u043c\u0435\u0442\u043e\u0434\u043e\u0432 \u0442\u0443\u0442 \u043d\u0435\u00a0\u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442, \u0447\u0442\u043e\u00a0\u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043d\u0430\u043c \u0432\u00a0runtime, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u043e\u0431\u0440\u0430\u0442\u0438\u0442\u044c\u0441\u044f \u043a\u00a0protected \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0443 \u0438\u043b\u0438\u00a0\u0432\u044b\u0437\u0432\u0430\u0442\u044c private\u2011\u043c\u0435\u0442\u043e\u0434 \u0438\u0437\u00a0\u043a\u043b\u0430\u0441\u0441\u0430\u2011\u043d\u0430\u0441\u043b\u0435\u0434\u043d\u0438\u043a\u0430.<\/em><\/p>\n<pre><code class=\"javascript\">var __extends = (this &amp;&amp; this.__extends) || (function () {   var extendStatics = function (d, b) {       extendStatics = Object.setPrototypeOf ||           ({ __proto__: [] } instanceof Array &amp;&amp; function (d, b) { d.__proto__ = b; }) ||               function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };           return extendStatics(d, b);   };   return function (d, b) {       if (typeof b !== \"function\" &amp;&amp; b !== null)           throw new TypeError(\"Class extends value \" + String(b) + \" is not a constructor or null\");       extendStatics(d, b);       function __() { this.constructor = d; }       d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());   }; })(); var A = \/** @class *\/ (function () {     function A() {         this.propA = \"1\";         this.propB = \"2\";         this.propC = \"3\";     }     A.prototype.methodD = function () { };     A.prototype.methodE = function () { };     A.prototype.methodF = function () { };     return A; }()); var B = \/** @class *\/ (function (_super) {     __extends(B, _super);     function B() {         return _super !== null &amp;&amp; _super.apply(this, arguments) || this;     }     B.prototype.methodG = function () {         this.methodF();     };     return B; }(A));<\/code><\/pre>\n<p><em>\u0412\u00a0\u043f\u0440\u0438\u043c\u0435\u0440\u0435 \u0432\u044b\u0448\u0435, \u043a\u043b\u0430\u0441\u0441 <\/em><strong><em>B<\/em><\/strong><em>, \u0444\u0430\u043a\u0442\u0438\u0447\u0435\u0441\u043a\u0438, \u0438\u043c\u0435\u0435\u0442 \u0434\u043e\u0441\u0442\u0443\u043f \u043a\u00a0\u043f\u0440\u0438\u0432\u0430\u0442\u043d\u043e\u043c\u0443 \u043c\u0435\u0442\u043e\u0434\u0443 \u0440\u043e\u0434\u0438\u0442\u0435\u043b\u044f \u0447\u0435\u0440\u0435\u0437 \u0441\u0432\u043e\u044e \u0441\u0441\u044b\u043b\u043a\u0443 \u043d\u0430\u00a0\u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442.<\/em><\/p>\n<h3>Await\/Async<\/h3>\n<p><em>\u0412\u00a0\u0432\u0435\u0440\u0441\u0438\u0438 ES7\u00a0\u043f\u043e\u044f\u0432\u0438\u043b\u0438\u0441\u044c \u0430\u0441\u0438\u043d\u0445\u0440\u043e\u043d\u043d\u044b\u0435 \u043e\u043f\u0435\u0440\u0430\u0442\u043e\u0440\u044b <\/em><strong><em>await<\/em><\/strong><em> \u0438 <\/em><strong><em>async<\/em><\/strong><em>. \u041f\u043e\u0441\u043c\u043e\u0442\u0440\u0438\u043c, \u043a\u0430\u043a\u00a0\u043e\u043d\u0438 \u0443\u0441\u0442\u0440\u043e\u0435\u043d\u044b.<\/em><\/p>\n<h4>ECMAScript<\/h4>\n<pre><code class=\"javascript\">async function foo() {   await Promise.resolve(); }<\/code><\/pre>\n<pre><code class=\"javascript\">\/\/ == babel == function _typeof(o) {   \"@babel\/helpers - typeof\";   return (     (_typeof =       \"function\" == typeof Symbol &amp;&amp; \"symbol\" == typeof Symbol.iterator         ? function (o) {             return typeof o;           }         : function (o) {             return o &amp;&amp;               \"function\" == typeof Symbol &amp;&amp;               o.constructor === Symbol &amp;&amp;               o !== Symbol.prototype               ? \"symbol\"               : typeof o;           }),     _typeof(o)   ); } function _regeneratorRuntime() {   \"use strict\";   \/*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https:\/\/github.com\/facebook\/regenerator\/blob\/main\/LICENSE *\/ _regeneratorRuntime =     function _regeneratorRuntime() {       return e;     };   var t,     e = {},     r = Object.prototype,     n = r.hasOwnProperty,     o =       Object.defineProperty ||       function (t, e, r) {         t[e] = r.value;       },     i = \"function\" == typeof Symbol ? Symbol : {},     a = i.iterator || \"@@iterator\",     c = i.asyncIterator || \"@@asyncIterator\",     u = i.toStringTag || \"@@toStringTag\";   function define(t, e, r) {     return (       Object.defineProperty(t, e, {         value: r,         enumerable: !0,         configurable: !0,         writable: !0       }),       t[e]     );   }   try {     define({}, \"\");   } catch (t) {     define = function define(t, e, r) {       return (t[e] = r);     };   }   function wrap(t, e, r, n) {     var i = e &amp;&amp; e.prototype instanceof Generator ? e : Generator,       a = Object.create(i.prototype),       c = new Context(n || []);     return o(a, \"_invoke\", { value: makeInvokeMethod(t, r, c) }), a;   }   function tryCatch(t, e, r) {     try {       return { type: \"normal\", arg: t.call(e, r) };     } catch (t) {       return { type: \"throw\", arg: t };     }   }   e.wrap = wrap;   var h = \"suspendedStart\",     l = \"suspendedYield\",     f = \"executing\",     s = \"completed\",     y = {};   function Generator() {}   function GeneratorFunction() {}   function GeneratorFunctionPrototype() {}   var p = {};   define(p, a, function () {     return this;   });   var d = Object.getPrototypeOf,     v = d &amp;&amp; d(d(values([])));   v &amp;&amp; v !== r &amp;&amp; n.call(v, a) &amp;&amp; (p = v);   var g =     (GeneratorFunctionPrototype.prototype =     Generator.prototype =       Object.create(p));   function defineIteratorMethods(t) {     [\"next\", \"throw\", \"return\"].forEach(function (e) {       define(t, e, function (t) {         return this._invoke(e, t);       });     });   }   function AsyncIterator(t, e) {     function invoke(r, o, i, a) {       var c = tryCatch(t[r], t, o);       if (\"throw\" !== c.type) {         var u = c.arg,           h = u.value;         return h &amp;&amp; \"object\" == _typeof(h) &amp;&amp; n.call(h, \"__await\")           ? e.resolve(h.__await).then(               function (t) {                 invoke(\"next\", t, i, a);               },               function (t) {                 invoke(\"throw\", t, i, a);               }             )           : e.resolve(h).then(               function (t) {                 (u.value = t), i(u);               },               function (t) {                 return invoke(\"throw\", t, i, a);               }             );       }       a(c.arg);     }     var r;     o(this, \"_invoke\", {       value: function value(t, n) {         function callInvokeWithMethodAndArg() {           return new e(function (e, r) {             invoke(t, n, e, r);           });         }         return (r = r           ? r.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg)           : callInvokeWithMethodAndArg());       }     });   }   function makeInvokeMethod(e, r, n) {     var o = h;     return function (i, a) {       if (o === f) throw new Error(\"Generator is already running\");       if (o === s) {         if (\"throw\" === i) throw a;         return { value: t, done: !0 };       }       for (n.method = i, n.arg = a; ; ) {         var c = n.delegate;         if (c) {           var u = maybeInvokeDelegate(c, n);           if (u) {             if (u === y) continue;             return u;           }         }         if (\"next\" === n.method) n.sent = n._sent = n.arg;         else if (\"throw\" === n.method) {           if (o === h) throw ((o = s), n.arg);           n.dispatchException(n.arg);         } else \"return\" === n.method &amp;&amp; n.abrupt(\"return\", n.arg);         o = f;         var p = tryCatch(e, r, n);         if (\"normal\" === p.type) {           if (((o = n.done ? s : l), p.arg === y)) continue;           return { value: p.arg, done: n.done };         }         \"throw\" === p.type &amp;&amp; ((o = s), (n.method = \"throw\"), (n.arg = p.arg));       }     };   }   function maybeInvokeDelegate(e, r) {     var n = r.method,       o = e.iterator[n];     if (o === t)       return (         (r.delegate = null),         (\"throw\" === n &amp;&amp;           e.iterator.return &amp;&amp;           ((r.method = \"return\"),           (r.arg = t),           maybeInvokeDelegate(e, r),           \"throw\" === r.method)) ||           (\"return\" !== n &amp;&amp;             ((r.method = \"throw\"),             (r.arg = new TypeError(               \"The iterator does not provide a '\" + n + \"' method\"             )))),         y       );     var i = tryCatch(o, e.iterator, r.arg);     if (\"throw\" === i.type)       return (r.method = \"throw\"), (r.arg = i.arg), (r.delegate = null), y;     var a = i.arg;     return a       ? a.done         ? ((r[e.resultName] = a.value),           (r.next = e.nextLoc),           \"return\" !== r.method &amp;&amp; ((r.method = \"next\"), (r.arg = t)),           (r.delegate = null),           y)         : a       : ((r.method = \"throw\"),         (r.arg = new TypeError(\"iterator result is not an object\")),         (r.delegate = null),         y);   }   function pushTryEntry(t) {     var e = { tryLoc: t[0] };     1 in t &amp;&amp; (e.catchLoc = t[1]),       2 in t &amp;&amp; ((e.finallyLoc = t[2]), (e.afterLoc = t[3])),       this.tryEntries.push(e);   }   function resetTryEntry(t) {     var e = t.completion || {};     (e.type = \"normal\"), delete e.arg, (t.completion = e);   }   function Context(t) {     (this.tryEntries = [{ tryLoc: \"root\" }]),       t.forEach(pushTryEntry, this),       this.reset(!0);   }   function values(e) {     if (e || \"\" === e) {       var r = e[a];       if (r) return r.call(e);       if (\"function\" == typeof e.next) return e;       if (!isNaN(e.length)) {         var o = -1,           i = function next() {             for (; ++o &lt; e.length; )               if (n.call(e, o))                 return (next.value = e[o]), (next.done = !1), next;             return (next.value = t), (next.done = !0), next;           };         return (i.next = i);       }     }     throw new TypeError(_typeof(e) + \" is not iterable\");   }   return (     (GeneratorFunction.prototype = GeneratorFunctionPrototype),     o(g, \"constructor\", {       value: GeneratorFunctionPrototype,       configurable: !0     }),     o(GeneratorFunctionPrototype, \"constructor\", {       value: GeneratorFunction,       configurable: !0     }),     (GeneratorFunction.displayName = define(       GeneratorFunctionPrototype,       u,       \"GeneratorFunction\"     )),     (e.isGeneratorFunction = function (t) {       var e = \"function\" == typeof t &amp;&amp; t.constructor;       return (         !!e &amp;&amp;         (e === GeneratorFunction ||           \"GeneratorFunction\" === (e.displayName || e.name))       );     }),     (e.mark = function (t) {       return (         Object.setPrototypeOf           ? Object.setPrototypeOf(t, GeneratorFunctionPrototype)           : ((t.__proto__ = GeneratorFunctionPrototype),             define(t, u, \"GeneratorFunction\")),         (t.prototype = Object.create(g)),         t       );     }),     (e.awrap = function (t) {       return { __await: t };     }),     defineIteratorMethods(AsyncIterator.prototype),     define(AsyncIterator.prototype, c, function () {       return this;     }),     (e.AsyncIterator = AsyncIterator),     (e.async = function (t, r, n, o, i) {       void 0 === i &amp;&amp; (i = Promise);       var a = new AsyncIterator(wrap(t, r, n, o), i);       return e.isGeneratorFunction(r)         ? a         : a.next().then(function (t) {             return t.done ? t.value : a.next();           });     }),     defineIteratorMethods(g),     define(g, u, \"Generator\"),     define(g, a, function () {       return this;     }),     define(g, \"toString\", function () {       return \"[object Generator]\";     }),     (e.keys = function (t) {       var e = Object(t),         r = [];       for (var n in e) r.push(n);       return (         r.reverse(),         function next() {           for (; r.length; ) {             var t = r.pop();             if (t in e) return (next.value = t), (next.done = !1), next;           }           return (next.done = !0), next;         }       );     }),     (e.values = values),     (Context.prototype = {       constructor: Context,       reset: function reset(e) {         if (           ((this.prev = 0),           (this.next = 0),           (this.sent = this._sent = t),           (this.done = !1),           (this.delegate = null),           (this.method = \"next\"),           (this.arg = t),           this.tryEntries.forEach(resetTryEntry),           !e)         )           for (var r in this)             \"t\" === r.charAt(0) &amp;&amp;               n.call(this, r) &amp;&amp;               !isNaN(+r.slice(1)) &amp;&amp;               (this[r] = t);       },       stop: function stop() {         this.done = !0;         var t = this.tryEntries[0].completion;         if (\"throw\" === t.type) throw t.arg;         return this.rval;       },       dispatchException: function dispatchException(e) {         if (this.done) throw e;         var r = this;         function handle(n, o) {           return (             (a.type = \"throw\"),             (a.arg = e),             (r.next = n),             o &amp;&amp; ((r.method = \"next\"), (r.arg = t)),             !!o           );         }         for (var o = this.tryEntries.length - 1; o >= 0; --o) {           var i = this.tryEntries[o],             a = i.completion;           if (\"root\" === i.tryLoc) return handle(\"end\");           if (i.tryLoc &lt;= this.prev) {             var c = n.call(i, \"catchLoc\"),               u = n.call(i, \"finallyLoc\");             if (c &amp;&amp; u) {               if (this.prev &lt; i.catchLoc) return handle(i.catchLoc, !0);               if (this.prev &lt; i.finallyLoc) return handle(i.finallyLoc);             } else if (c) {               if (this.prev &lt; i.catchLoc) return handle(i.catchLoc, !0);             } else {               if (!u) throw new Error(\"try statement without catch or finally\");               if (this.prev &lt; i.finallyLoc) return handle(i.finallyLoc);             }           }         }       },       abrupt: function abrupt(t, e) {         for (var r = this.tryEntries.length - 1; r >= 0; --r) {           var o = this.tryEntries[r];           if (             o.tryLoc &lt;= this.prev &amp;&amp;             n.call(o, \"finallyLoc\") &amp;&amp;             this.prev &lt; o.finallyLoc           ) {             var i = o;             break;           }         }         i &amp;&amp;           (\"break\" === t || \"continue\" === t) &amp;&amp;           i.tryLoc &lt;= e &amp;&amp;           e &lt;= i.finallyLoc &amp;&amp;           (i = null);         var a = i ? i.completion : {};         return (           (a.type = t),           (a.arg = e),           i             ? ((this.method = \"next\"), (this.next = i.finallyLoc), y)             : this.complete(a)         );       },       complete: function complete(t, e) {         if (\"throw\" === t.type) throw t.arg;         return (           \"break\" === t.type || \"continue\" === t.type             ? (this.next = t.arg)             : \"return\" === t.type             ? ((this.rval = this.arg = t.arg),               (this.method = \"return\"),               (this.next = \"end\"))             : \"normal\" === t.type &amp;&amp; e &amp;&amp; (this.next = e),           y         );       },       finish: function finish(t) {         for (var e = this.tryEntries.length - 1; e >= 0; --e) {           var r = this.tryEntries[e];           if (r.finallyLoc === t)             return this.complete(r.completion, r.afterLoc), resetTryEntry(r), y;         }       },       catch: function _catch(t) {         for (var e = this.tryEntries.length - 1; e >= 0; --e) {           var r = this.tryEntries[e];           if (r.tryLoc === t) {             var n = r.completion;             if (\"throw\" === n.type) {               var o = n.arg;               resetTryEntry(r);             }             return o;           }         }         throw new Error(\"illegal catch attempt\");       },       delegateYield: function delegateYield(e, r, n) {         return (           (this.delegate = { iterator: values(e), resultName: r, nextLoc: n }),           \"next\" === this.method &amp;&amp; (this.arg = t),           y         );       }     }),     e   ); } function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {   try {     var info = gen[key](arg);     var value = info.value;   } catch (error) {     reject(error);     return;   }   if (info.done) {     resolve(value);   } else {     Promise.resolve(value).then(_next, _throw);   } } function _asyncToGenerator(fn) {   return function () {     var self = this,       args = arguments;     return new Promise(function (resolve, reject) {       var gen = fn.apply(self, args);       function _next(value) {         asyncGeneratorStep(gen, resolve, reject, _next, _throw, \"next\", value);       }       function _throw(err) {         asyncGeneratorStep(gen, resolve, reject, _next, _throw, \"throw\", err);       }       _next(undefined);     });   }; } function foo() {   return _foo.apply(this, arguments); } function _foo() {   _foo = _asyncToGenerator(     \/*#__PURE__*\/ _regeneratorRuntime().mark(function _callee() {       return _regeneratorRuntime().wrap(function _callee$(_context) {         while (1)           switch ((_context.prev = _context.next)) {             case 0:               _context.next = 2;               return Promise.resolve();             case 2:             case \"end\":               return _context.stop();           }       }, _callee);     })   );   return _foo.apply(this, arguments); }<\/code><\/pre>\n<p>\u0414\u043b\u044f\u00a0\u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u0442\u0430\u043a\u043e\u0439 \u043f\u0440\u043e\u0441\u0442\u043e\u0439, \u0441\u00a0\u0432\u0438\u0434\u0443, \u043a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0446\u0438\u0438, <strong>Babel<\/strong> \u0438\u043c\u043f\u043b\u0435\u043c\u0435\u043d\u0442\u0438\u0440\u0443\u0435\u0442 \u043c\u0435\u0445\u0430\u043d\u0438\u0437\u043c \u0433\u0435\u043d\u0435\u0440\u0430\u0442\u043e\u0440\u043e\u043c \u0441\u00a0\u043d\u0430\u0431\u043e\u0440\u043e\u043c \u043f\u0440\u043e\u0432\u0435\u0440\u043e\u043a \u0438 \u043d\u0430\u0441\u0442\u0440\u043e\u0435\u043a, \u0447\u0442\u043e\u00a0\u043f\u0440\u0438\u0432\u043e\u0434\u0438\u0442 \u043a\u00a0\u0438\u0442\u043e\u0433\u043e\u0432\u043e\u043c\u0443\u00a0\u043b\u0438\u0441\u0442\u0438\u043d\u0433\u0443 \u0432 490\u00a0\u0441\u0442\u0440\u043e\u043a \u043a\u043e\u0434\u0430.<\/p>\n<h4>TypeScript<\/h4>\n<pre><code class=\"typescript\">async function foo() {   await Promise.resolve(); }<\/code><\/pre>\n<pre><code class=\"javascript\">\/\/ == tsc == var __awaiter = (this &amp;&amp; this.__awaiter) || function (thisArg, _arguments, P, generator) {     function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }     return new (P || (P = Promise))(function (resolve, reject) {         function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }         function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }         function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }         step((generator = generator.apply(thisArg, _arguments || [])).next());     }); }; var __generator = (this &amp;&amp; this.__generator) || function (thisArg, body) {     var _ = { label: 0, sent: function() { if (t[0] &amp; 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;     return g = { next: verb(0), \"throw\": verb(1), \"return\": verb(2) }, typeof Symbol === \"function\" &amp;&amp; (g[Symbol.iterator] = function() { return this; }), g;     function verb(n) { return function (v) { return step([n, v]); }; }     function step(op) {         if (f) throw new TypeError(\"Generator is already executing.\");         while (_) try {             if (f = 1, y &amp;&amp; (t = op[0] &amp; 2 ? y[\"return\"] : op[0] ? y[\"throw\"] || ((t = y[\"return\"]) &amp;&amp; t.call(y), 0) : y.next) &amp;&amp; !(t = t.call(y, op[1])).done) return t;             if (y = 0, t) op = [op[0] &amp; 2, t.value];             switch (op[0]) {                 case 0: case 1: t = op; break;                 case 4: _.label++; return { value: op[1], done: false };                 case 5: _.label++; y = op[1]; op = [0]; continue;                 case 7: op = _.ops.pop(); _.trys.pop(); continue;                 default:                     if (!(t = _.trys, t = t.length > 0 &amp;&amp; t[t.length - 1]) &amp;&amp; (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }                     if (op[0] === 3 &amp;&amp; (!t || (op[1] > t[0] &amp;&amp; op[1] &lt; t[3]))) { _.label = op[1]; break; }                     if (op[0] === 6 &amp;&amp; _.label &lt; t[1]) { _.label = t[1]; t = op; break; }                     if (t &amp;&amp; _.label &lt; t[2]) { _.label = t[2]; _.ops.push(op); break; }                     if (t[2]) _.ops.pop();                     _.trys.pop(); continue;             }             op = body.call(thisArg, _);         } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }         if (op[0] &amp; 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };     } }; function foo() {     return __awaiter(this, void 0, void 0, function () {         return __generator(this, function (_a) {             switch (_a.label) {                 case 0: return [4 \/*yield*\/, Promise.resolve()];                 case 1:                     _a.sent();                     return [2 \/*return*\/];             }         });     }); }<\/code><\/pre>\n<p>TypeScript \u0442\u043e\u0436\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442, \u0432\u00a0\u044d\u0442\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435, \u0433\u0435\u043d\u0435\u0440\u0430\u0442\u043e\u0440\u044b, \u043d\u043e\u00a0\u0438\u043c\u043f\u0435\u043b\u0435\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u044f \u0433\u043e\u0440\u0430\u0437\u0434\u043e \u043f\u0440\u043e\u0449\u0435 \u0438 \u0438\u0442\u043e\u0433\u043e\u0432\u044b\u0439\u00a0\u043b\u0438\u0441\u0442\u0438\u043d\u0433\u00a0\u2014 \u0432\u0441\u0435\u0433\u043e 48\u00a0\u0441\u0442\u0440\u043e\u043a.<\/p>\n<h3>Spread-\u043e\u043f\u0435\u0440\u0430\u0442\u043e\u0440<\/h3>\n<p>Spread\u2011\u043e\u043f\u0435\u0440\u0430\u0442\u043e\u0440 \u043f\u043e\u044f\u0432\u0438\u043b\u0441\u044f \u0432\u00a0\u0432\u0435\u0440\u0441\u0438\u0438 <strong>ES9<\/strong>. \u0414\u043e\u00a0\u044d\u0442\u043e\u0433\u043e, \u0442\u0440\u0430\u0434\u0438\u0446\u0438\u043e\u043d\u043d\u043e, \u043f\u043e\u00a0\u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e\u0441\u0442\u0438, \u043f\u0440\u0438\u043c\u0435\u043d\u044f\u043b\u0441\u044f \u043c\u0435\u0442\u043e\u0434 <code>Object.assign<\/code>, \u043d\u043e\u00a0\u0441\u00a0\u043f\u043e\u044f\u0432\u043b\u0435\u043d\u0438\u0435\u043c <strong>spread<\/strong> \u0438 <strong>rest<\/strong> \u043e\u043f\u0435\u0440\u0430\u0442\u043e\u0440\u043e\u0432 \u043a\u043e\u0434 \u0441\u0442\u0430\u043b \u0432\u044b\u0433\u043b\u044f\u0434\u0435\u0442\u044c \u043f\u0440\u0438\u043c\u0435\u0440\u043d\u043e \u0432\u043e\u0442 \u0442\u0430\u043a:<\/p>\n<h4>ECMAScript<\/h4>\n<pre><code class=\"javascript\">const a = {...({})}<\/code><\/pre>\n<pre><code class=\"javascript\">\/\/ == babel == function _typeof(o) {   \"@babel\/helpers - typeof\";   return (     (_typeof =       \"function\" == typeof Symbol &amp;&amp; \"symbol\" == typeof Symbol.iterator         ? function (o) {             return typeof o;           }         : function (o) {             return o &amp;&amp;               \"function\" == typeof Symbol &amp;&amp;               o.constructor === Symbol &amp;&amp;               o !== Symbol.prototype               ? \"symbol\"               : typeof o;           }),     _typeof(o)   ); } function ownKeys(e, r) {   var t = Object.keys(e);   if (Object.getOwnPropertySymbols) {     var o = Object.getOwnPropertySymbols(e);     r &amp;&amp;       (o = o.filter(function (r) {         return Object.getOwnPropertyDescriptor(e, r).enumerable;       })),       t.push.apply(t, o);   }   return t; } function _objectSpread(e) {   for (var r = 1; r &lt; arguments.length; r++) {     var t = null != arguments[r] ? arguments[r] : {};     r % 2       ? ownKeys(Object(t), !0).forEach(function (r) {           _defineProperty(e, r, t[r]);         })       : Object.getOwnPropertyDescriptors       ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t))       : ownKeys(Object(t)).forEach(function (r) {           Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r));         });   }   return e; } function _defineProperty(obj, key, value) {   key = _toPropertyKey(key);   if (key in obj) {     Object.defineProperty(obj, key, {       value: value,       enumerable: true,       configurable: true,       writable: true     });   } else {     obj[key] = value;   }   return obj; } function _toPropertyKey(t) {   var i = _toPrimitive(t, \"string\");   return \"symbol\" == _typeof(i) ? i : String(i); } function _toPrimitive(t, r) {   if (\"object\" != _typeof(t) || !t) return t;   var e = t[Symbol.toPrimitive];   if (void 0 !== e) {     var i = e.call(t, r || \"default\");     if (\"object\" != _typeof(i)) return i;     throw new TypeError(\"@@toPrimitive must return a primitive value.\");   }   return (\"string\" === r ? String : Number)(t); } var a = _objectSpread({}, {});<\/code><\/pre>\n<p>\u0412\u00a0\u0441\u043b\u0443\u0447\u0430\u0435 \u0441 <strong>Babel<\/strong>, \u0437\u0434\u0435\u0441\u044c \u0441\u043e\u0437\u0434\u0430\u0435\u0442\u0441\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u044f <code>_objectSpread<\/code>, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043e\u0431\u0445\u043e\u0434\u0438\u0442 \u043e\u0431\u044a\u0435\u043a\u0442 \u043f\u043e\u00a0\u0435\u0433\u043e \u043a\u043b\u044e\u0447\u0430\u043c \u0438 \u043a\u043b\u043e\u043d\u0438\u0440\u0443\u0435\u0442 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f.<\/p>\n<h4>TypeScript<\/h4>\n<pre><code class=\"typescript\">const a = {...({})}<\/code><\/pre>\n<pre><code class=\"javascript\">\/\/ == tsc == var __assign = (this &amp;&amp; this.__assign) || function () {     __assign = Object.assign || function(t) {         for (var s, i = 1, n = arguments.length; i &lt; n; i++) {             s = arguments[i];             for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))                 t[p] = s[p];         }         return t;     };     return __assign.apply(this, arguments); }; var a = __assign({}, ({}));<\/code><\/pre>\n<p><strong>TypeScript<\/strong>\u00a0\u0436\u0435, \u043f\u044b\u0442\u0430\u0435\u0442\u0441\u044f \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043a\u043b\u0430\u0441\u0441\u0438\u0447\u0435\u0441\u043a\u0438\u0439 <code>Object.assign<\/code>, \u0438 \u0442\u043e\u043b\u044c\u043a\u043e \u0435\u0441\u043b\u0438 \u0435\u0433\u043e \u043d\u0435\u0442 \u0432\u00a0\u0434\u0430\u043d\u043d\u043e\u043c \u043e\u043a\u0440\u0443\u0436\u0435\u043d\u0438\u0438, \u0438\u043c\u043f\u043b\u0435\u043c\u0435\u043d\u0442\u0438\u0440\u0443\u0435\u0442\u0441\u044f \u043f\u0440\u043e\u0441\u0442\u043e\u0439 \u0430\u043b\u0433\u043e\u0440\u0438\u0442\u043c \u043e\u0431\u0445\u043e\u0434\u0430 \u043a\u043b\u044e\u0447\u0435\u0439 \u043e\u0431\u044a\u0435\u043a\u0442\u0430.<\/p>\n<h3>\u0417\u0430\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435<\/h3>\n<p>\u0412\u00a0\u0441\u0442\u0430\u0442\u044c\u0435 \u043f\u0440\u0438\u0432\u0435\u0434\u0435\u043d \u0434\u0430\u043a\u043b\u0435\u043a\u043e \u043d\u0435\u00a0\u043f\u043e\u043b\u043d\u044b\u0439 \u0441\u043f\u0438\u0441\u043e\u043a \u0432\u0441\u0435\u0445 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u0435\u0439 \u0438 \u043d\u043e\u0432\u043e\u0432\u0432\u0435\u0434\u0435\u043d\u0438\u0439 \u0432\u00a0\u0441\u043f\u0435\u0446\u0438\u0444\u0430\u043a\u0430\u0446\u0438\u044e <strong>ECMAScript<\/strong>\u0438 \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u044e <strong>TypeScript<\/strong>. \u0417\u0434\u0435\u0441\u044c \u043c\u044b \u0440\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u0435\u043b\u0438 \u0442\u043e\u043b\u044c\u043a\u043e \u0442\u0435 \u043c\u043e\u043c\u0435\u043d\u0442\u044b, \u0432\u00a0\u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u043c\u043e\u0433\u0443\u0442 \u0440\u0430\u0441\u0445\u043e\u0434\u0438\u0442\u044c\u0441\u044f, \u0441\u00a0\u0442\u043e\u0447\u043a\u0438 \u0437\u0440\u0435\u043d\u0438\u044f \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438.<\/p>\n<p>\u0412\u00a0\u0446\u0435\u043b\u043e\u043c, \u0440\u0435\u0437\u044e\u043c\u0438\u0440\u0443\u044f \u0432\u0441\u0435 \u0432\u044b\u0448\u0435 \u0441\u043a\u0430\u0437\u0430\u043d\u043d\u043e\u0435, <strong>ES6+<\/strong> (\u0432 \u0447\u0430\u0441\u0442\u043d\u043e\u0441\u0442\u0438, \u0440\u0435\u0430\u043b\u0438\u0437\u043e\u0432\u0430\u043d\u043d\u044b\u0439 \u043f\u043e\u0441\u0440\u0435\u0434\u0441\u0442\u0432\u043e\u043c <strong>Babel\u2011\u043f\u0430\u0440\u0441\u0435\u0440\u0430<\/strong>) \u0433\u0435\u043d\u0435\u0440\u0438\u0440\u0443\u0435\u0442 \u043e\u0442\u043d\u043e\u0441\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u0431\u0435\u0437\u043e\u043f\u0430\u0441\u043d\u044b\u0439 \u0438\u0442\u043e\u0433\u043e\u0432\u044b\u0439 \u043a\u043e\u0434, \u0431\u043e\u043b\u0435\u0435 \u0441\u0442\u043e\u0439\u043a\u0438\u0439 \u043e\u0448\u0438\u0431\u043a\u0430\u043c \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0438 \u0438 \u043a\u00a0\u0437\u043b\u043e\u043d\u0430\u043c\u0435\u0440\u0435\u043d\u043d\u043e\u043c\u0443 \u0432\u043c\u0435\u0448\u0430\u0442\u0435\u043b\u044c\u0441\u0442\u0432\u0443. \u041e\u0434\u043d\u0430\u043a\u043e, \u0446\u0435\u043d\u0430 \u0442\u043e\u043c\u0443\u00a0\u2014 \u0433\u0440\u043e\u043c\u043e\u0437\u0434\u043a\u0438\u0435 \u043a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0446\u0438\u0438 \u0438, \u043a\u0430\u043a\u00a0\u0441\u043b\u0435\u0434\u0441\u0442\u0432\u0438\u0435, \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u044c \u0433\u0435\u043d\u0435\u0440\u0430\u0446\u0438\u0438.<\/p>\n<p><strong>TypeScript<\/strong>\u00a0\u0436\u0435, \u0432\u00a0\u043f\u0440\u043e\u0442\u0438\u0432\u043e\u0432\u0435\u0441, \u043f\u0440\u0438\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u0442\u0441\u044f \u043f\u043e\u0434\u0445\u043e\u0434\u0430 \u043a\u00a0\u0432\u0430\u043b\u0438\u0434\u0430\u0446\u0438\u0438 \u043d\u0430\u00a0\u044d\u0442\u0430\u043f\u0435 <em>compile time<\/em>, \u0442.\u00a0\u0435. \u043a\u043e\u0434 \u0441\u00a0\u043e\u0448\u0438\u0431\u043a\u0430\u043c\u0438, \u0432\u00a0\u0442\u0435\u043e\u0440\u0438\u0438, \u043d\u0435\u00a0\u0434\u043e\u043b\u0436\u0435\u043d\u00a0\u0431\u044b\u0442\u044c \u0441\u043e\u0431\u0440\u0430\u043d, \u0438\u043b\u0438, \u043f\u043e\u00a0\u043a\u0440\u0430\u0439\u043d\u0435\u0439 \u043c\u0435\u0440\u0435, \u043e\u0431\u00a0\u043e\u0448\u0438\u0431\u043a\u0430\u0445 \u0431\u0443\u0434\u0435\u0442 \u0441\u0440\u0430\u0437\u0443 \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u043e. \u042d\u0442\u043e \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043e\u043f\u0443\u0441\u0442\u0438\u0442\u044c \u0432\u0441\u0435\u0432\u043e\u0437\u043c\u043e\u0436\u043d\u044b\u0435 \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0438 \u043d\u0430\u00a0\u0443\u0440\u043e\u0432\u043d\u0435 <em>runtime<\/em>, \u0447\u0442\u043e\u00a0\u0434\u0435\u043b\u0430\u0435\u0442 \u0438\u0442\u043e\u0433\u043e\u0432\u044b\u0439 \u043a\u043e\u0434 \u0433\u043e\u0440\u0430\u0437\u0434\u043e \u043c\u0435\u043d\u044c\u0448\u0435 \u0438 \u043b\u0435\u0433\u0447\u0435. \u041e\u0434\u043d\u0430\u043a\u043e, \u0432\u0441\u0435\u0433\u0434\u0430 \u043e\u0441\u0442\u0430\u0435\u0442\u0441\u044f, \u0432\u043f\u043e\u043b\u043d\u0435 \u043e\u0441\u044f\u0437\u0430\u0435\u043c\u0430\u044f \u043e\u043f\u0430\u0441\u043d\u043e\u0441\u0442\u044c \u043d\u0435\u0434\u043e\u0431\u0440\u043e\u0441\u043e\u0432\u0435\u0441\u0442\u043d\u043e\u0439 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0438 (<code>type-check<\/code> \u043c\u043e\u0436\u043d\u043e \u043f\u0440\u043e\u0438\u0433\u043d\u043e\u0440\u0438\u0440\u043e\u0432\u0430\u0442\u044c) \u0438 \u0437\u043b\u043e\u043d\u0430\u043c\u0435\u0440\u0435\u043d\u043d\u043e\u0433\u043e \u0432\u043c\u0435\u0448\u0430\u0442\u0435\u043b\u044c\u0441\u0442\u0432\u0430.<\/p>\n<p>\u0427\u0442\u043e\u00a0\u0441\u0447\u0438\u0442\u0430\u0442\u044c \u043b\u0443\u0447\u0448\u0438\u043c \u043f\u043e\u0434\u0445\u043e\u0434\u043e\u043c\u00a0\u2014 \u0432\u043e\u043f\u0440\u043e\u0441 \u0441\u043b\u043e\u0436\u043d\u044b\u0439. \u041a\u0430\u0436\u0434\u044b\u0439 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a \u0438 \u043a\u0430\u0436\u0434\u0430\u044f \u043a\u043e\u043c\u0430\u043d\u0434\u0430 \u0440\u0435\u0448\u0430\u0435\u0442 \u0435\u0433\u043e \u0441\u0430\u043c\u043e\u0441\u0442\u043e\u044f\u0442\u0435\u043b\u044c\u043d\u043e, \u0438\u0441\u0445\u043e\u0434\u044f \u0438\u0437\u00a0\u0441\u0432\u043e\u0438\u0445 \u0441\u043e\u0431\u0441\u0442\u0432\u0435\u043d\u043d\u044b\u0445 \u0440\u0435\u0430\u043b\u0438\u0439. \u0427\u0430\u0441\u0442\u043e, \u0440\u0435\u0448\u0435\u043d\u0438\u0435 \u043e\u0441\u043d\u043e\u0432\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u043d\u0430\u00a0\u0444\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u044b\u0445 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044f\u0445 \u044f\u0437\u044b\u043a\u0430. \u0422\u0430\u043a, \u043f\u043e\u00a0\u043c\u0438\u043c\u043e \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u0435\u0439 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u0430 <strong>ECMAScript<\/strong>, <strong>TypeScript<\/strong> \u0438\u043c\u0435\u0435\u0442 \u0431\u043e\u043b\u044c\u0448\u0438\u0435 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u0438 \u0432\u00a0\u0447\u0430\u0441\u0442\u0438 \u0442\u0438\u043f\u0438\u0437\u0430\u0446\u0438\u0438 (\u0441\u043e\u0431\u0441\u0442\u0432\u0435\u043d\u043d\u043e, \u044d\u0442\u043e \u0435\u0433\u043e \u043f\u0440\u044f\u043c\u043e \u043d\u0430\u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435), \u0447\u0435\u0433\u043e\u00a0\u043b\u0438\u0448\u0435\u043d <strong>ES6+<\/strong>. \u042d\u0442\u043e\u0433\u043e \u043a\u0440\u0438\u0442\u0435\u0440\u0438\u044f, \u0447\u0430\u0441\u0442\u043e, \u0434\u043e\u0441\u0442\u0430\u0442\u043e\u0447\u043d\u043e, \u0447\u0442\u043e\u0431\u044b \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u0432\u044b\u0431\u043e\u0440 \u0432\u00a0\u0435\u0433\u043e \u043f\u043e\u043b\u044c\u0437\u0443. \u0421\u00a0\u0434\u0440\u0443\u0433\u043e\u0439 \u0441\u0442\u043e\u0440\u043e\u043d\u044b, \u044d\u0442\u043e\u0442\u00a0\u0436\u0435 \u043f\u043b\u044e\u0441, \u043d\u0435\u00a0\u0440\u0435\u0434\u043a\u043e \u043c\u043e\u0436\u0435\u0442 \u043e\u043a\u0430\u0437\u0430\u0442\u044c\u0441\u044f \u043c\u0438\u043d\u0443\u0441\u043e\u043c, \u0442\u0430\u043a \u043a\u0430\u043a\u00a0\u0442\u0440\u0435\u0431\u0443\u0435\u0442 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u043d\u044b\u0445 \u043d\u0430\u0432\u044b\u043a\u043e\u0432 \u0438 \u043a\u043e\u043c\u043f\u0435\u0442\u0435\u043d\u0446\u0438\u0439 \u0432\u00a0\u043a\u043e\u043c\u0430\u043d\u0434\u0435 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0438.<\/p>\n<p>\u041c\u0435\u0436\u0434\u0443 \u0442\u0435\u043c, \u043e\u0431\u0430 \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u0430\u00a0\u0431\u044b\u043b\u0438 \u0438 \u043e\u0441\u0442\u0430\u044e\u0442\u0441\u044f \u0432\u043e\u0441\u0442\u0440\u0435\u0431\u043e\u0432\u0430\u043d\u043d\u044b\u043c\u0438, \u0430\u00a0\u0440\u0430\u0431\u043e\u0442\u044b \u043f\u043e\u00a0\u0438\u0445 \u0441\u043e\u0432\u0435\u0440\u0448\u0435\u043d\u0441\u0442\u0432\u043e\u0432\u0430\u043d\u0438\u044e \u0431\u0443\u0434\u0443\u0442 \u043f\u0440\u043e\u0434\u043e\u043b\u0436\u0430\u0442\u044c\u0441\u044f \u0434\u0430\u043b\u044c\u0448\u0435, \u0434\u0435\u043b\u0430\u044f \u0436\u0438\u0437\u043d\u044c \u043f\u0440\u043e\u0441\u0442\u043e\u0433\u043e \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430 \u043b\u0443\u0447\u0448\u0435. <\/p>\n<hr\/>\n<p>\u042d\u0442\u0443 \u0438 \u0434\u0440\u0443\u0433\u0438\u0435 \u043c\u043e\u0438 \u0441\u0442\u0430\u0442\u044c\u0438, \u0442\u0430\u043a \u0436\u0435, \u0447\u0438\u0442\u0430\u0439\u0442\u0435 \u0432 \u043c\u043e\u0435\u043c \u043a\u0430\u043d\u0430\u043b\u0435<\/p>\n<p>RU:\u00a0<a href=\"https:\/\/t.me\/frontend_almanac_ru\" rel=\"noopener noreferrer nofollow\">https:\/\/t.me\/frontend_almanac_ru<\/a><br \/>EN:\u00a0<a href=\"https:\/\/t.me\/frontend_almanac\" rel=\"noopener noreferrer nofollow\">https:\/\/t.me\/frontend_almanac<\/a><\/p>\n<\/p>\n<\/div>\n<\/div>\n<\/div>\n<p><!----><!----><\/div>\n<p><!----><!----><br \/> \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\/788254\/\"> https:\/\/habr.com\/ru\/articles\/788254\/<\/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<p>\u041c\u0438\u043d\u0443\u043b\u0438 \u0442\u0435 \u0432\u0440\u0435\u043c\u0435\u043d\u0430, \u043a\u043e\u0433\u0434\u0430 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0438 \u043f\u0438\u0441\u0430\u043b\u0438 Frontend \u043d\u0430 \u00ab\u0447\u0438\u0441\u0442\u043e\u043c\u00bb <strong>JavaScript<\/strong> (\u0432\u043f\u043b\u043e\u0442\u044c \u0434\u043e <strong>ECMAScript 5<\/strong>). \u0412\u0441\u0435 \u0438\u0437\u043c\u0435\u043d\u0438\u043b\u043e\u0441\u044c \u0441\u00a0\u0432\u044b\u0445\u043e\u0434\u043e\u043c \u0432\u00a0\u0441\u0432\u0435\u0442 \u0432\u0435\u0440\u0441\u0438\u0438 <strong>ECMAScript 6<\/strong> \u0432 2015-\u043c \u0433\u043e\u0434\u0443. \u042d\u0442\u043e \u0441\u043e\u0431\u044b\u0442\u0438\u0435 \u0441\u0442\u0430\u043b\u043e, \u043f\u043e\u00a0\u0438\u0441\u0442\u0438\u043d\u0435 \u0437\u043d\u0430\u0447\u0438\u043c\u044b\u043c \u0432\u00a0\u043c\u0438\u0440\u043e\u0432\u043e\u0439 Frontend \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0435. \u041f\u0440\u0435\u0434\u044b\u0434\u0443\u0449\u0438\u0435 6\u00a0\u043b\u0435\u0442 \u0434\u043e\u00a0\u044d\u0442\u043e\u0433\u043e, \u044f\u0437\u044b\u043a \u043f\u0440\u0430\u043a\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u043d\u0435\u00a0\u043c\u0435\u043d\u044f\u043b\u0441\u044f. \u0413\u043e\u0434\u043e\u043c \u0440\u0430\u043d\u0435\u0435, \u0432 2014-\u043c, \u043a\u043e\u043c\u043f\u0430\u043d\u0438\u044f Microsoft \u043e\u043f\u0443\u0431\u043b\u0438\u043a\u043e\u0432\u0430\u043b\u0430 <strong>TypeScript 1.0<\/strong> \u0438 \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u0438\u043b\u0430 \u0432\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u0443\u044e \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u043a\u0443 \u044f\u0437\u044b\u043a\u0430 \u0432\u00a0\u0441\u0432\u043e\u0435\u0439 IDE <a href=\"https:\/\/ru.wikipedia.org\/wiki\/Microsoft_Visual_Studio#Visual_Studio_2013\" rel=\"noopener noreferrer nofollow\">VisualStudio 2013<\/a>. \u041d\u0430\u00a0\u0441\u0430\u043c\u043e\u043c \u0434\u0435\u043b\u0435, \u043e\u0444\u0438\u0446\u0438\u0430\u043b\u044c\u043d\u043e, <strong>TypeScript<\/strong>\u00a0\u0431\u044b\u043b \u0432\u044b\u043f\u0443\u0449\u0435\u043d \u0435\u0449\u0435 \u0432 2012\u00a0(\u0432\u0435\u0440\u0441\u0438\u044f 0.8), \u043e\u0434\u043d\u0430\u043a\u043e, \u043f\u043e\u043f\u0443\u043b\u044f\u0440\u043d\u043e\u0441\u0442\u044c\u044e \u043e\u043d \u043d\u0435\u00a0\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043b\u0441\u044f \u0432\u00a0\u0432\u0438\u0434\u0443 \u043f\u0440\u0430\u043a\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u043f\u043e\u043b\u043d\u043e\u0433\u043e \u043e\u0442\u0441\u0443\u0442\u0441\u0442\u0432\u0438\u044f \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u043a\u0438 \u0441\u043e \u0441\u0442\u043e\u0440\u043e\u043d\u044b \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u044e\u0449\u0438\u0445, \u043d\u0430\u00a0\u0442\u043e\u0442 \u043c\u043e\u043c\u0435\u043d\u0442, IDE.<\/p>\n<p>\u0421\u00a0\u0442\u0435\u0445 \u043f\u0440\u043e\u0448\u043b\u043e \u043c\u043d\u043e\u0433\u043e \u0432\u0440\u0435\u043c\u0435\u043d\u0438. \u041e\u0431\u0430 \u044f\u0437\u044b\u043a\u0430 \u0440\u0430\u0437\u0432\u0438\u0432\u0430\u043b\u0438\u0441\u044c \u043f\u0430\u0440\u0430\u043b\u043b\u0435\u043b\u044c\u043d\u043e. \u0412\u00a0\u0447\u0435\u043c\u2011\u0442\u043e \u043e\u043d\u0438 \u0441\u0445\u043e\u0436\u0438, \u0432\u00a0\u0447\u0435\u043c\u2011\u0442\u043e \u043a\u0430\u0440\u0434\u0438\u043d\u0430\u043b\u044c\u043d\u043e \u0440\u0430\u0437\u043b\u0438\u0447\u0430\u044e\u0442\u0441\u044f. \u041a\u0430\u0436\u0434\u044b\u0439 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a \u0438 \u043a\u0430\u0436\u0434\u0430\u044f \u043a\u043e\u043c\u0430\u043d\u0434\u0430 \u0432\u043e\u043b\u044c\u043d\u0430 \u0441\u0430\u043c\u043e\u0441\u0442\u043e\u044f\u0442\u0435\u043b\u044c\u043d\u043e \u0440\u0435\u0448\u0430\u0442\u044c, \u043a\u0430\u043a\u043e\u0439 \u0438\u0437\u00a0\u043d\u0438\u0445 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c. \u0412\u00a0\u044d\u0442\u043e \u0441\u0442\u0430\u0442\u044c\u0435 \u043f\u043e\u043f\u0440\u043e\u0431\u0443\u0435\u043c \u043d\u0430\u0439\u0442\u0438 \u0442\u043e\u0447\u043a\u0438, \u043a\u0430\u043a\u00a0\u043f\u0435\u0440\u0435\u0441\u0435\u0447\u0435\u043d\u0438\u044f, \u0442\u0430\u043a \u0438 \u0440\u0430\u0441\u0445\u043e\u0436\u0434\u0435\u043d\u0438\u044f \u044d\u0442\u0438\u0445 \u0434\u0432\u0443\u0445 \u044f\u0437\u044b\u043a\u043e\u0432 \u0438 \u0441\u0440\u0430\u0432\u043d\u0438\u043c \u0438\u0445 \u043f\u043e\u0434\u0445\u043e\u0434\u044b.<\/p>\n<p>\u0422\u0438\u043f\u0438\u0437\u0430\u0446\u0438\u044e <strong>TypeScript<\/strong> \u0440\u0430\u0441\u0441\u043c\u0430\u0442\u0440\u0438\u0432\u0430\u0442\u044c \u0432\u00a0\u044d\u0442\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0435 \u043d\u0435\u00a0\u0431\u0443\u0434\u0435\u043c, \u0442.\u043a. \u043e\u0447\u0435\u0432\u0438\u0434\u043d\u043e, \u0447\u0442\u043e\u00a0\u0432 <strong>ECMAScript<\/strong> \u0435\u0451 \u043d\u0435\u0442, \u0438 \u0441\u0440\u0430\u0432\u043d\u0438\u0432\u0430\u0442\u044c \u0442\u0443\u0442 \u043d\u0435\u0447\u0435\u0433\u043e.<\/p>\n<p>\u0414\u043b\u044f\u00a0\u0447\u0438\u0441\u0442\u043e\u0442\u044b \u044d\u043a\u0441\u043f\u0435\u0440\u0438\u043c\u0435\u043d\u0442\u0430 \u043a\u043e\u0434 \u0431\u0443\u0434\u0435\u043c \u0442\u0440\u0430\u043d\u0441\u043f\u0438\u043b\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0432\u00a0\u0441\u0442\u0430\u0440\u044b\u0439 \u0434\u043e\u0431\u0440\u044b\u0439 <strong>ECMAScript 5<\/strong>. <strong>TypeScript<\/strong>, \u0434\u043b\u044f\u00a0\u0443\u0434\u043e\u0431\u0441\u0442\u0432\u0430, \u0432\u043e\u0437\u044c\u043c\u0435\u043c \u0432\u0435\u0440\u0441\u0438\u0438 4.8.4\u00a0(\u044d\u0442\u043e\u0439 \u0432\u0435\u0440\u0441\u0438\u0438, \u0434\u043b\u044f\u00a0\u0446\u0435\u043b\u0435\u0439 \u0441\u0442\u0430\u0442\u044c\u0438 \u0434\u043e\u0441\u0442\u0430\u0442\u043e\u0447\u043d\u043e) \u0438 \u0431\u0443\u0434\u0435\u043c \u043a\u043e\u043c\u043f\u0438\u043b\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0435\u0433\u043e \u0440\u043e\u0434\u043d\u044b\u043c <code>tsc<\/code> \u043a\u043e\u043c\u043f\u0438\u043b\u044f\u0442\u043e\u0440\u043e\u043c. \u0414\u043b\u044f <strong>ECMAScript<\/strong> \u0432\u043e\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u0441\u044f \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u0430\u0440\u0438\u0435\u043c <code>Babel<\/code>.<\/p>\n<h3>\u041e\u0431\u044a\u044f\u0432\u043b\u0435\u043d\u0438\u0435 \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0445<\/h3>\n<p>\u041d\u0430\u0447\u043d\u0435\u043c \u0441 \u0441\u0430\u043c\u043e\u0433\u043e \u043f\u0440\u043e\u0441\u0442\u043e\u0433\u043e, \u0441 \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0445. \u0412 \u044d\u0442\u043e\u0439 \u0447\u0430\u0441\u0442\u0438, \u043e\u0431\u0430 \u044f\u0437\u044b\u043a\u0430 \u0438\u043c\u0435\u044e\u0442 \u0438\u0434\u0435\u043d\u0442\u0438\u0447\u043d\u044b\u0439 \u0441\u0438\u043d\u0442\u0430\u043a\u0441\u0438\u0441.<\/p>\n<h4>ECMAScript<\/h4>\n<pre><code class=\"javascript\">let a = \"\"; const b = \"\"; var c = \"\";<\/code><\/pre>\n<pre><code class=\"javascript\">\/\/ == babel == var a = \"\"; var b = \"\"; var c = \"\";<\/code><\/pre>\n<h4>TypeScript<\/h4>\n<pre><code class=\"typescript\">let a = \"\"; const b = \"\"; var c = \"\";<\/code><\/pre>\n<pre><code class=\"javascript\">\/\/ == tsc == var a = \"\"; var b = \"\"; var c = \"\";<\/code><\/pre>\n<p>\u0412\u00a0\u043e\u0431\u043e\u0438\u0445 \u0441\u043b\u0443\u0447\u0430\u044f\u0445, \u043f\u043e\u0441\u043b\u0435 \u0442\u0440\u0430\u043d\u0441\u043f\u0438\u043b\u044f\u0446\u0438\u0438, \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0435 \u043f\u0440\u0438\u0432\u043e\u0434\u044f\u0442\u0441\u044f \u043a\u00a0\u0435\u0434\u0438\u043d\u0441\u0442\u0432\u0435\u043d\u043d\u043e\u043c\u0443 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u043c\u0443 \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u0443 \u0434\u0435\u043a\u043b\u0430\u0440\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0445 \u0432 <strong>ECMAScript 5<\/strong>, \u043f\u043e\u0441\u0440\u0435\u0434\u0441\u0442\u0432\u043e\u043c <strong>var<\/strong>.<\/p>\n<p>\u041e\u0434\u043d\u0430\u043a\u043e, \u043c\u044b \u0437\u043d\u0430\u0435\u043c, \u0447\u0442\u043e <strong>let<\/strong> \u0438 <strong>const<\/strong> \u043e\u0442\u043b\u0438\u0447\u0430\u044e\u0442\u0441\u044f \u043e\u0442 <strong>var<\/strong> \u0442\u0435\u043c, \u0447\u0442\u043e\u00a0\u043e\u0431\u043b\u0430\u0441\u0442\u044c \u0438\u0445 \u0432\u0438\u0434\u0438\u043c\u043e\u0441\u0442\u0438 \u043e\u0433\u0440\u0430\u043d\u0438\u0447\u0435\u043d\u0430 <a href=\"https:\/\/tc39.es\/ecma262\/#sec-execution-contexts\" rel=\"noopener noreferrer nofollow\">LexicalEnvironment<\/a>.<\/p>\n<p>\u041f\u043e\u043f\u0440\u043e\u0431\u0443\u0435\u043c \u043e\u0431\u0435\u0440\u043d\u0443\u0442\u044c \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u0443\u044e <strong>let<\/strong> \u0432\u00a0\u043f\u0440\u043e\u0441\u0442\u0435\u0439\u0448\u0438\u0439 LexicalEnvironment\u00a0\u2014 <a href=\"https:\/\/tc39.es\/ecma262\/#sec-block\" rel=\"noopener noreferrer nofollow\">Block<\/a>.<\/p>\n<h4>ECMAScript<\/h4>\n<pre><code class=\"javascript\">{   let a = \"1\"; }  a = \"2\";<\/code><\/pre>\n<pre><code class=\"javascript\">\/\/ == babel == {   var _a = \"1\"; \/\/ babel \u0434\u043e\u0431\u0430\u0432\u0438\u043b \u043f\u0440\u0435\u0444\u0438\u043a\u0441 \"_\" \u043a \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u0439, \u0442\u0430\u043a\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c,                 \/\/ \u043e\u0442\u0434\u0435\u043b\u0438\u0432 \u0435\u0451 \u043e\u0442 \u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u043e\u0439 \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u0439 \"a\" \u043d\u0438\u0436\u0435 } a = \"2\";<\/code><\/pre>\n<h4>TypeScript<\/h4>\n<pre><code class=\"typescript\">{   let a = \"1\"; }  a = \"2\";<\/code><\/pre>\n<pre><code class=\"javascript\">\/\/ == tsc == {   var a = \"1\"; \/\/ tsc \u043d\u0435 \u043f\u0435\u0440\u0435\u0438\u043c\u0435\u043d\u043e\u0432\u0430\u043b \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u0443\u044e \u0438 \u043d\u0438\u043a\u0430\u043a\u0438\u043c \u0434\u0440\u0443\u0433\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c                \/\/ \u043d\u0435 \u0438\u0437\u043e\u043b\u0438\u0440\u043e\u0432\u0430\u043b \u0435\u0451 \u043e\u0442 \u043f\u0435\u0440\u0435\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u044f \u043d\u0438\u0436\u0435. } a = \"2\";<\/code><\/pre>\n<p>\u041a\u0430\u043a\u00a0\u0432\u0438\u0434\u0438\u043c\u043e \u0438\u0437\u00a0\u043f\u0440\u0438\u043c\u0435\u0440\u0430, <strong>TypeScript<\/strong> \u043d\u0438\u043a\u0430\u043a \u043d\u0435\u00a0\u043f\u043e\u0437\u0430\u0431\u043e\u0442\u0438\u043b\u0441\u044f \u043e\u0431\u00a0\u0438\u0437\u043e\u043b\u044f\u0446\u0438\u0438 \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u0439 <strong>let<\/strong> \u0432 <em>runtime<\/em>. \u0412\u00a0\u044d\u0442\u043e\u0439 \u0447\u0430\u0441\u0442\u0438 \u043a\u043e\u043c\u043f\u0438\u043b\u044f\u0442\u043e\u0440 \u043f\u043e\u043b\u043d\u043e\u0441\u0442\u044c\u044e \u043f\u043e\u043b\u0430\u0433\u0430\u0435\u0442\u0441\u044f \u043d\u0430 <em>compile time<\/em> \u0438\u0441\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435. \u0417\u043d\u0430\u0447\u0438\u0442\u00a0\u043b\u0438 \u044d\u0442\u043e, \u0447\u0442\u043e <strong>TypeScript<\/strong> \u043d\u0435\u00a0\u0431\u0435\u0437\u043e\u043f\u0430\u0441\u0435\u043d \u0432\u00a0runtime \u0432\u00a0\u043f\u0440\u0438\u043d\u0446\u0438\u043f\u0435?<\/p>\n<p>\u0414\u0430\u0432\u0430\u0439\u0442\u0435 \u0432\u0437\u0433\u043b\u044f\u043d\u0435\u043c \u043d\u0430\u00a0\u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0439 \u043f\u0440\u0438\u043c\u0435\u0440:<\/p>\n<h4>ECMAScript<\/h4>\n<pre><code class=\"javascript\">{   let a = \"1\";    setTimeout(() => {     console.log(a);   }, 0); } a = \"2\";<\/code><\/pre>\n<pre><code class=\"javascript\">\/\/ == babel == {   var _a = \"1\";   setTimeout(function () {     console.log(_a);   }, 0); } a = \"2\";<\/code><\/pre>\n<p>\u0421\u00a0\u0442\u043e\u0447\u043a\u0438 \u0437\u0440\u0435\u043d\u0438\u044f <strong>ECMAScript<\/strong> \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u0430\u044f \u043f\u043e\u00a0\u043f\u0440\u0435\u0436\u043d\u0435\u043c\u0443 \u00ab\u0438\u0437\u043e\u043b\u0438\u0440\u043e\u0432\u0430\u043d\u0430\u00bb \u0438 \u043f\u0435\u0440\u0435\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u044f \u043d\u0435\u00a0\u043f\u0440\u043e\u0438\u0437\u043e\u0439\u0434\u0435\u0442.<\/p>\n<h4>TypeScript<\/h4>\n<pre><code class=\"typescript\">{   let a = \"1\";      setTimeout(() => {     console.log(a);   }, 0); }  a = \"2\";<\/code><\/pre>\n<pre><code class=\"javascript\">\/\/ == tsc == {   var a_1 = \"1\";       setTimeout(function () {     console.log(a_1);   }, 0); } a = \"2\";<\/code><\/pre>\n<p>\u0412\u00a0\u044d\u0442\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435, <strong>TypeScript<\/strong> \u0443\u0447\u0435\u043b \u0444\u0430\u043a\u0442 \u0442\u043e\u0433\u043e, \u0447\u0442\u043e\u00a0\u043a\u00a0\u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u0439 \u0435\u0441\u0442\u044c \u043e\u0431\u0440\u0430\u0449\u0435\u043d\u0438\u0435 \u0432\u00a0\u043c\u0430\u043a\u0440\u043e\u0442\u0430\u0441\u043a\u0435 \u0438 \u043f\u043e\u0437\u0430\u0431\u043e\u0442\u0438\u043b\u0441\u044f \u043e\u00a0\u0435\u0451 \u0438\u0437\u043e\u043b\u044f\u0446\u0438\u0438, \u0430\u043d\u0430\u043b\u043e\u0433\u0438\u0447\u043d\u043e <strong>ECMAScript<\/strong>. \u0421\u00a0\u0442\u043e\u0447\u043a\u0438 \u0437\u0440\u0435\u043d\u0438\u044f \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430, \u0438\u0437\u043e\u043b\u044f\u0446\u0438\u044f \u043e\u0431\u0435\u0441\u043f\u0435\u0447\u0435\u043d\u0430, \u043e\u0434\u043d\u0430\u043a\u043e \u0432\u043e\u043f\u0440\u043e\u0441 \u0437\u043b\u043e\u043d\u0430\u043c\u0435\u0440\u0435\u043d\u043d\u044b\u0445 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0439 \u0438\u0437\u00a0\u0432\u043d\u0435, \u0432\u0441\u0451 \u0435\u0449\u0451 \u043e\u0441\u0442\u0430\u0435\u0442\u0441\u044f \u043e\u0442\u043a\u0440\u044b\u0442. \u041f\u043e\u00a0\u043a\u0440\u0430\u0439\u043d\u0435\u0439 \u043c\u0435\u0440\u0435, \u044d\u0442\u043e \u0447\u0443\u0442\u044c \u043c\u0435\u043d\u0435\u0435 \u0431\u0435\u0437\u043e\u043f\u0430\u0441\u043d\u043e, \u0447\u0435\u043c \u0432\u00a0\u0441\u043b\u0443\u0447\u0430\u0435 \u0441 <strong>ECMAScript<\/strong>.<\/p>\n<p>C <strong>let<\/strong> \u0440\u0430\u0437\u043e\u0431\u0440\u0430\u043b\u0438\u0441\u044c, \u0434\u0430\u0432\u0430\u0439\u0442\u0435 \u0442\u0435\u043f\u0435\u0440\u044c \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0438\u043c \u043d\u0430 <strong>const<\/strong>.<\/p>\n<h4>ECMAScript<\/h4>\n<pre><code class=\"javascript\">const b = \"1\"; b = \"2\";<\/code><\/pre>\n<pre><code class=\"javascript\">\/\/ == babel == function _readOnlyError(name) {   throw new TypeError('\"' + name + '\" is read-only'); } var b = \"1\"; \"2\", _readOnlyError(\"b\");<\/code><\/pre>\n<p><strong>Babel<\/strong> \u043d\u0435\u00a0\u043f\u043e\u0437\u0432\u043e\u043b\u0438\u043b \u043f\u0435\u0440\u0435\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0438\u0442\u044c \u043a\u043e\u043d\u0441\u0442\u0430\u043d\u0442\u0443 \u0438 \u0432\u0435\u0440\u043d\u0443\u043b \u0438\u0441\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435 \u0432\u00a0runtime.<\/p>\n<h4>TypeScript<\/h4>\n<pre><code class=\"typescript\">const b = \"1\"; b = \"2\";<\/code><\/pre>\n<pre><code class=\"javascript\">\/\/ == tsc == const b = \"1\"; b = \"2\";<\/code><\/pre>\n<p><strong>TypeScript<\/strong>, \u043a\u0430\u043a\u00a0\u0438 \u0432\u00a0\u0441\u043b\u0443\u0447\u0430\u0435 \u0441 <strong>let<\/strong>, \u043d\u0438\u043a\u0430\u043a \u043d\u0435\u00a0\u043f\u043e\u0437\u0430\u0431\u043e\u0442\u0438\u043b\u0441\u044f \u043e\u00a0\u0437\u0430\u0449\u0438\u0442\u0435 <strong>const<\/strong> \u0432 <em>runtime<\/em>, \u043f\u043e\u043b\u0430\u0433\u0430\u044f\u0441\u044c \u043d\u0430\u00a0\u043e\u0448\u0438\u0431\u043a\u0443 \u043a\u043e\u043c\u043f\u0438\u043b\u044f\u0446\u0438\u0438.<\/p>\n<h3>\u0421\u0442\u0440\u0435\u043b\u043e\u0447\u043d\u044b\u0435 \u0444\u0443\u043d\u043a\u0446\u0438\u0438<\/h3>\n<p>\u0415\u0449\u0435 \u043e\u0434\u043d\u0438\u043c \u043d\u043e\u0432\u043e\u0432\u0432\u0435\u0434\u0435\u043d\u0438\u0435\u043c <strong>ES6<\/strong>, \u0441\u0442\u0430\u043b\u0438 \u0441\u0442\u0440\u0435\u043b\u043e\u0447\u043d\u044b\u0435 \u0444\u0443\u043d\u043a\u0446\u0438\u0438. \u041e\u043d\u0438 \u043e\u0442\u043b\u0438\u0447\u0430\u044e\u0442\u0441\u044f \u043e\u0442\u00a0\u043e\u0431\u044b\u0447\u043d\u044b\u0445 \u043e\u0442\u0441\u0443\u0442\u0441\u0442\u0432\u0438\u0435\u043c \u0441\u043e\u0431\u0441\u0442\u0432\u0435\u043d\u043d\u043e\u0433\u043e \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u0430 \u0438 \u0441\u0441\u044b\u043b\u043a\u0438 \u043d\u0430 <em>arguments<\/em>.<\/p>\n<h4>ECMAScript<\/h4>\n<pre><code class=\"javascript\">const foo = () => {   this.a = \"1\" }<\/code><\/pre>\n<pre><code class=\"javascript\">\/\/ == babel == var _this = this; var foo = function foo() {   _this.a = \"1\"; };<\/code><\/pre>\n<p>\u0417\u0434\u0435\u0441\u044c \u043c\u044b \u0432\u0438\u0434\u0438\u043c, \u0447\u0442\u043e <strong>Babel<\/strong> \u0437\u0430\u043c\u0435\u043d\u0438\u043b \u0441\u0441\u044b\u043b\u043a\u0443 \u043d\u0430\u00a0\u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442 \u0444\u0443\u043d\u043a\u0446\u0438\u0438, \u043f\u0435\u0440\u0435\u043d\u0430\u043f\u0440\u0430\u0432\u0438\u0432 \u043e\u0431\u0440\u0430\u0449\u0435\u043d\u0438\u0435 \u0432\u00a0\u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u044b\u0439 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442.<\/p>\n<h4>TypeScript<\/h4>\n<pre><code class=\"typescript\">const foo = () => { this.a = \"1\" }<\/code><\/pre>\n<pre><code class=\"javascript\">\/\/ == tsc == var _this = this; var foo = function foo() {   _this.a = \"1\"; };<\/code><\/pre>\n<p>\u0410\u0431\u0441\u043e\u043b\u044e\u0442\u043d\u043e \u0438\u0434\u0435\u043d\u0442\u0438\u0447\u043d\u044b\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c \u043f\u043e\u0441\u0442\u0443\u043f\u0438\u043b \u0438\u00a0<strong>tsc<\/strong>.<\/p>\n<p>\u0410 \u043a\u0430\u043a \u043e\u0431\u0441\u0442\u043e\u044f\u0442 \u0434\u0435\u043b\u0430 \u0441 \u043c\u0430\u0441\u0441\u0438\u0432\u043e\u043c\u00a0<em>arguments<\/em>\u00a0\u0444\u0443\u043d\u043a\u0446\u0438\u0438?<\/p>\n<h4>ECMAScript<\/h4>\n<pre><code class=\"javascript\">const foo = () => {   console.log(arguments.length); }<\/code><\/pre>\n<pre><code class=\"javascript\">\/\/ == babel == var _arguments = typeof arguments === \"undefined\" ? void 0 : arguments; var foo = function foo() {   console.log(_arguments.length); };<\/code><\/pre>\n<p><strong>Babel<\/strong> \u043f\u0440\u0435\u0434\u0443\u0441\u043c\u043e\u0442\u0440\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u043f\u0440\u043e\u0432\u0435\u0440\u0438\u043b, \u043d\u0435\u0442\u00a0\u043b\u0438 \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u0439 \u0441\u00a0\u0442\u0430\u043a\u0438\u043c \u0438\u043c\u0435\u043d\u0435\u043c \u0432\u00a0\u0433\u043b\u043e\u0431\u0430\u043b\u044c\u043d\u043e\u043c \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u0435, \u0438 \u0435\u0441\u043b\u0438 \u0432\u0434\u0440\u0443\u0433 \u0435\u0441\u0442\u044c, \u043e\u043d \u0432\u0435\u0440\u043d\u0435\u0442 \u0441\u0441\u044b\u043b\u043a\u0443 \u043d\u0430\u00a0\u043d\u0435\u0433\u043e. \u0412\u00a0\u043f\u0440\u043e\u0442\u0438\u0432\u043d\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u043c\u0430\u0441\u0441\u0438\u0432 \u0431\u0443\u0434\u0435\u0442 \u043d\u0435\u00a0\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d.<\/p>\n<h4>TypeScript<\/h4>\n<pre><code class=\"typescript\">const foo = () => {   console.log(arguments.length); }<\/code><\/pre>\n<pre><code class=\"javascript\">\/\/ == tsc == var foo = function () {   console.log(arguments.length); };<\/code><\/pre>\n<p>\u0412\u00a0\u0441\u043b\u0443\u0447\u0430\u0435 \u0441 <strong>TypeScript<\/strong>, \u0441\u0441\u044b\u043b\u043a\u0430 \u043d\u0430\u00a0arguments \u0431\u0443\u0434\u0435\u0442 \u0432\u0435\u0441\u0442\u0438 \u043d\u0430\u00a0\u0440\u0435\u0430\u043b\u044c\u043d\u044b\u0439 \u043c\u0430\u0441\u0441\u0438\u0432 \u0430\u0440\u0433\u0443\u043c\u0435\u043d\u0442\u043e\u0432 \u0444\u0443\u043d\u043a\u0446\u0438\u0438, \u0438\u0441\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435 \u0441\u043b\u0443\u0447\u0438\u0442\u0441\u044f \u0442\u043e\u043b\u044c\u043a\u043e \u0432 <em>compile time<\/em>.<\/p>\n<h3>\u041a\u043b\u0430\u0441\u0441\u044b<\/h3>\n<p>\u041e\u0434\u043d\u0438\u043c \u0438\u0437\u00a0\u0432\u0430\u0436\u043d\u0435\u0439\u0448\u0438\u0445 \u043d\u043e\u0432\u043e\u0432\u0432\u0435\u0434\u0435\u043d\u0438\u0435 <strong>ES6<\/strong>\u00a0\u0431\u044b\u043b\u0438 \u043a\u043b\u0430\u0441\u0441\u044b. \u0412\u0437\u0433\u043b\u044f\u043d\u0435\u043c \u043d\u0430\u00a0\u043f\u0440\u043e\u0441\u0442\u0435\u0439\u0448\u0443\u044e \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044e \u043a\u043b\u0430\u0441\u0441\u0430.<\/p>\n<h4>ECMAScript<\/h4>\n<pre><code class=\"javascript\">class A {}<\/code><\/pre>\n<pre><code class=\"javascript\">\/\/ == babel == function _typeof(o) {   \"@babel\/helpers - typeof\";   return (     (_typeof =       \"function\" == typeof Symbol &amp;&amp; \"symbol\" == typeof Symbol.iterator         ? function (o) {             return typeof o;           }         : function (o) {             return o &amp;&amp;               \"function\" == typeof Symbol &amp;&amp;               o.constructor === Symbol &amp;&amp;               o !== Symbol.prototype               ? \"symbol\"               : typeof o;           }),     _typeof(o)   ); } function _defineProperties(target, props) {   for (var i = 0; i &lt; props.length; i++) {     var descriptor = props[i];     descriptor.enumerable = descriptor.enumerable || false;     descriptor.configurable = true;     if (\"value\" in descriptor) descriptor.writable = true;     Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);   } } function _createClass(Constructor, protoProps, staticProps) {   if (protoProps) _defineProperties(Constructor.prototype, protoProps);   if (staticProps) _defineProperties(Constructor, staticProps);   Object.defineProperty(Constructor, \"prototype\", { writable: false });   return Constructor; } function _toPropertyKey(t) {   var i = _toPrimitive(t, \"string\");   return \"symbol\" == _typeof(i) ? i : String(i); } function _toPrimitive(t, r) {   if (\"object\" != _typeof(t) || !t) return t;   var e = t[Symbol.toPrimitive];   if (void 0 !== e) {     var i = e.call(t, r || \"default\");     if (\"object\" != _typeof(i)) return i;     throw new TypeError(\"@@toPrimitive must return a primitive value.\");   }   return (\"string\" === r ? String : Number)(t); } function _classCallCheck(instance, Constructor) {   if (!(instance instanceof Constructor)) {     throw new TypeError(\"Cannot call a class as a function\");   } } var A = \/*#__PURE__*\/ _createClass(function A() {   _classCallCheck(this, A); });<\/code><\/pre>\n<p>\u041f\u0440\u043e\u0441\u0442\u043e\u0435 \u043e\u0431\u044a\u044f\u0432\u043b\u0435\u043d\u0438\u0435 \u043a\u043b\u0430\u0441\u0441\u0430, \u043f\u043e\u0441\u043b\u0435 \u0442\u0440\u0430\u043d\u0441\u0438\u043f\u043b\u044f\u0446\u0438\u0438 \u0441\u0440\u0435\u0434\u0441\u0442\u0432\u0430\u043c\u0438 Babel, \u043f\u0440\u0438\u0432\u043e\u0434\u0438\u0442 \u043a\u00a0\u0434\u043e\u0432\u043e\u043b\u044c\u043d\u043e \u0433\u0440\u043e\u043c\u043e\u0437\u0434\u043a\u043e\u043c\u0443 \u043a\u043e\u0434\u0443 \u0432\u00a0\u0432\u0438\u0434\u0435 \u043d\u0430\u0431\u043e\u0440\u0430 \u0444\u0430\u0431\u0440\u0438\u043a, \u0447\u0442\u043e\u0431\u044b \u043e\u0431\u0435\u0441\u043f\u0435\u0447\u0438\u0442\u044c \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u044b\u0439 \u0443\u0440\u043e\u0432\u0435\u043d\u044c \u0431\u0435\u0437\u043e\u043f\u0430\u0441\u043d\u043e\u0441\u0442\u0438.<\/p>\n<h4>TypeScript<\/h4>\n<pre><code class=\"typescript\">class A {}<\/code><\/pre>\n<pre><code class=\"javascript\">\/\/ == tsc == var A = \/** @class *\/ (function () {     function A() {     }     return A; }());<\/code><\/pre>\n<p><em>\u0422\u0430\u00a0\u0436\u0435 \u0441\u0430\u043c\u0430\u044f \u0438\u043d\u0441\u0442\u0440\u0443\u043a\u0446\u0438\u044f \u043d\u0430\u00a0TypeScript \u0441\u043e\u0437\u0434\u0430\u0435\u0442 \u0432\u0441\u0435\u0433\u043e \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u0441\u0442\u0440\u043e\u043a \u043a\u043e\u0434\u0430.<\/em><\/p>\n<p><em>\u0414\u043e\u043f\u043e\u043b\u043d\u0438\u043c \u043d\u0430\u0448 \u043a\u043b\u0430\u0441\u0441 \u043f\u043e\u043b\u044f\u043c\u0438 \u0438 \u043c\u0435\u0442\u043e\u0434\u0430\u043c\u0438.<\/em><\/p>\n<h4>ECMAScript<\/h4>\n<pre><code class=\"javascript\">class A {   propA = \"1\";   #probB = \"2\";      methodC() {}      #methodD() {} }<\/code><\/pre>\n<pre><code class=\"javascript\">\/\/ == babel == function _typeof(o) {   \"@babel\/helpers - typeof\";   return (     (_typeof =       \"function\" == typeof Symbol &amp;&amp; \"symbol\" == typeof Symbol.iterator         ? function (o) {             return typeof o;           }         : function (o) {             return o &amp;&amp;               \"function\" == typeof Symbol &amp;&amp;               o.constructor === Symbol &amp;&amp;               o !== Symbol.prototype               ? \"symbol\"               : typeof o;           }),     _typeof(o)   ); } function _classCallCheck(instance, Constructor) {   if (!(instance instanceof Constructor)) {     throw new TypeError(\"Cannot call a class as a function\");   } } function _defineProperties(target, props) {   for (var i = 0; i &lt; props.length; i++) {     var descriptor = props[i];     descriptor.enumerable = descriptor.enumerable || false;     descriptor.configurable = true;     if (\"value\" in descriptor) descriptor.writable = true;     Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);   } } function _createClass(Constructor, protoProps, staticProps) {   if (protoProps) _defineProperties(Constructor.prototype, protoProps);   if (staticProps) _defineProperties(Constructor, staticProps);   Object.defineProperty(Constructor, \"prototype\", { writable: false });   return Constructor; } function _classPrivateMethodInitSpec(obj, privateSet) {   _checkPrivateRedeclaration(obj, privateSet);   privateSet.add(obj); } function _classPrivateFieldInitSpec(obj, privateMap, value) {   _checkPrivateRedeclaration(obj, privateMap);   privateMap.set(obj, value); } function _checkPrivateRedeclaration(obj, privateCollection) {   if (privateCollection.has(obj)) {     throw new TypeError(       \"Cannot initialize the same private elements twice on an object\"     );   } } function _defineProperty(obj, key, value) {   key = _toPropertyKey(key);   if (key in obj) {     Object.defineProperty(obj, key, {       value: value,       enumerable: true,       configurable: true,       writable: true     });   } else {     obj[key] = value;   }   return obj; } function _toPropertyKey(t) {   var i = _toPrimitive(t, \"string\");   return \"symbol\" == _typeof(i) ? i : String(i); } function _toPrimitive(t, r) {   if (\"object\" != _typeof(t) || !t) return t;   var e = t[Symbol.toPrimitive];   if (void 0 !== e) {<\/code><\/pre>\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-366067","post","type-post","status-publish","format-standard","hentry"],"_links":{"self":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts\/366067","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=366067"}],"version-history":[{"count":0,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts\/366067\/revisions"}],"wp:attachment":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=366067"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=366067"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=366067"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}