1:HL["/_next/static/media/2d141e1a38819612-s.p.woff2","font",{"crossOrigin":"","type":"font/woff2"}] 2:HL["/_next/static/css/cf073754662ee1dd.css","style",{"crossOrigin":""}] 0:["PKb518kvGJ1fSv37ZR9-f",[[["",{"children":["blog",{"children":[["slug","es2022","d"],{"children":["__PAGE__?{\"slug\":\"es2022\"}",{}]}]}]},"$undefined","$undefined",true],"$L3",[[["$","link","0",{"rel":"stylesheet","href":"/_next/static/css/cf073754662ee1dd.css","precedence":"next","crossOrigin":""}]],"$L4"]]]] 5:I[7221,["311","static/chunks/311-ece9a4947c63cbe4.js","965","static/chunks/965-704ef81d34001ffc.js","45","static/chunks/45-5cd7c451ab04a44f.js","185","static/chunks/app/layout-c9339678b85bd69a.js"],"ThemeProvider"] 6:I[2920,["311","static/chunks/311-ece9a4947c63cbe4.js","965","static/chunks/965-704ef81d34001ffc.js","45","static/chunks/45-5cd7c451ab04a44f.js","185","static/chunks/app/layout-c9339678b85bd69a.js"],"Header"] 7:I[6899,[],""] 8:I[345,[],""] 9:I[9311,["311","static/chunks/311-ece9a4947c63cbe4.js","900","static/chunks/900-5fb194ef90f0bbe9.js","965","static/chunks/965-704ef81d34001ffc.js","308","static/chunks/app/blog/%5Bslug%5D/page-79b4219c250c2fa1.js"],""] c:I[9328,["311","static/chunks/311-ece9a4947c63cbe4.js","965","static/chunks/965-704ef81d34001ffc.js","45","static/chunks/45-5cd7c451ab04a44f.js","185","static/chunks/app/layout-c9339678b85bd69a.js"],"GoogleAnalytics"] d:I[5097,["311","static/chunks/311-ece9a4947c63cbe4.js","900","static/chunks/900-5fb194ef90f0bbe9.js","965","static/chunks/965-704ef81d34001ffc.js","308","static/chunks/app/blog/%5Bslug%5D/page-79b4219c250c2fa1.js"],""] 4:[["$","meta","0",{"charSet":"utf-8"}],["$","title","1",{"children":"Exciting Features in ES2022 | Adarsha Acharya"}],["$","meta","2",{"name":"description","content":"Overview and examples of some exicitng features coming in ES2022."}],["$","meta","3",{"name":"viewport","content":"width=device-width, initial-scale=1"}],["$","meta","4",{"name":"robots","content":"index, follow"}],["$","meta","5",{"name":"googlebot","content":"index, follow, max-video-preview:-1, max-image-preview:large, max-snippet:-1"}],["$","meta","6",{"property":"og:title","content":"Exciting Features in ES2022"}],["$","meta","7",{"property":"og:description","content":"Overview and examples of some exicitng features coming in ES2022."}],["$","meta","8",{"property":"og:url","content":"https://adarsha.dev/blog/es2022"}],["$","meta","9",{"property":"og:site_name","content":"Adarsha Acharya"}],["$","meta","10",{"property":"og:locale","content":"en_US"}],["$","meta","11",{"property":"og:image","content":"https://adarsha.dev/og?title=Exciting%20Features%20in%20ES2022"}],["$","meta","12",{"property":"og:image:width","content":"1200"}],["$","meta","13",{"property":"og:image:height","content":"630"}],["$","meta","14",{"property":"og:image:alt","content":"Exciting Features in ES2022"}],["$","meta","15",{"property":"og:type","content":"article"}],["$","meta","16",{"property":"article:published_time","content":"2022-03-28\r"}],["$","meta","17",{"property":"article:author","content":"Adarsha Acharya"}],["$","meta","18",{"name":"twitter:card","content":"summary_large_image"}],["$","meta","19",{"name":"twitter:title","content":"Exciting Features in ES2022"}],["$","meta","20",{"name":"twitter:description","content":"Overview and examples of some exicitng features coming in ES2022."}],["$","meta","21",{"name":"twitter:image","content":"https://adarsha.dev/og?title=Exciting%20Features%20in%20ES2022"}],["$","meta","22",{"name":"next-size-adjust"}]] 3:[null,["$","html",null,{"lang":"en","suppressHydrationWarning":true,"children":[[["$","link",null,{"rel":"apple-touch-icon","sizes":"76x76","href":"/_static/favicons/apple-touch-icon.png"}],["$","link",null,{"rel":"icon","type":"image/png","sizes":"32x32","href":"/_static/favicons/favicon-32x32.png"}],["$","link",null,{"rel":"icon","type":"image/png","sizes":"16x16","href":"/_static/favicons/favicon-16x16.png"}],["$","link",null,{"rel":"manifest","href":"/_static/favicons/site.webmanifest"}],["$","link",null,{"rel":"mask-icon","href":"/_static/favicons/safari-pinned-tab.svg","color":"#5bbad5"}],["$","meta",null,{"name":"msapplication-TileColor","content":"#000000"}],["$","meta",null,{"name":"theme-color","media":"(prefers-color-scheme: light)","content":"#fff"}],["$","meta",null,{"name":"theme-color","media":"(prefers-color-scheme: dark)","content":"#000"}],["$","link",null,{"rel":"alternate","type":"application/rss+xml","href":"/feed.xml"}],["$","meta",null,{"content":"width=device-width, initial-scale=1","name":"viewport"}],["$","meta",null,{"name":"google-site-verification","content":"br9AjaAyJgS4OVigpXtHmm2DwdzuzMqzpK4G77lD2TY"}]],["$","body",null,{"className":"mx-auto min-h-screen max-w-3xl antialiased dark:bg-zinc-950 dark:text-gray-100 __className_0aa4ae","children":[["$","$L5",null,{"attribute":"class","defaultTheme":"dark","enableSystem":true,"disableTransitionOnChange":true,"children":[["$","main",null,{"className":"mx-4 px-2 md:px-0 lg:mx-auto flex flex-col justify-between min-h-screen","children":[["$","$L6",null,{}],["$","$L7",null,{"parallelRouterKey":"children","segmentPath":["children"],"loading":"$undefined","loadingStyles":"$undefined","hasLoading":false,"error":"$undefined","errorStyles":"$undefined","template":["$","$L8",null,{}],"templateStyles":"$undefined","notFound":["$","div",null,{"className":"flex flex-col items-start justify-start md:flex-row md:items-center md:justify-center md:space-x-6","children":[["$","div",null,{"className":"space-x-2 pb-8 pt-6 md:space-y-5","children":["$","h1",null,{"className":"text-6xl font-extrabold leading-9 tracking-tight md:border-r-2 md:px-6 md:text-8xl md:leading-14","children":"404"}]}],["$","div",null,{"className":"max-w-md","children":[["$","p",null,{"className":"mb-4 text-xl font-bold leading-normal md:text-2xl","children":"Sorry we couldn't find this page."}],["$","$L9",null,{"href":"/","className":"underline","children":"Back to homepage"}]]}]]}],"notFoundStyles":[],"childProp":{"current":["$","$L7",null,{"parallelRouterKey":"children","segmentPath":["children","blog","children"],"loading":"$undefined","loadingStyles":"$undefined","hasLoading":false,"error":"$undefined","errorStyles":"$undefined","template":["$","$L8",null,{}],"templateStyles":"$undefined","notFound":"$undefined","notFoundStyles":"$undefined","childProp":{"current":["$","$L7",null,{"parallelRouterKey":"children","segmentPath":["children","blog","children",["slug","es2022","d"],"children"],"loading":"$undefined","loadingStyles":"$undefined","hasLoading":false,"error":"$undefined","errorStyles":"$undefined","template":["$","$L8",null,{}],"templateStyles":"$undefined","notFound":"$undefined","notFoundStyles":"$undefined","childProp":{"current":["$La","$Lb",null],"segment":"__PAGE__?{\"slug\":\"es2022\"}"},"styles":[]}],"segment":["slug","es2022","d"]},"styles":[]}],"segment":"blog"},"styles":[]}],["$","footer",null,{"className":"flex justify-center align-center pt-10 pb-5 h-20px","children":["$","p",null,{"className":"text-gray-500 dark:text-gray-400 text-sm","children":["© ",2024," ",["$","a",null,{"href":"https://x.com/adarsha_ach","target":"_blank","rel":"noopener noreferrer","children":"Adarsha Acharya."}],"  All rights reserved."]}]}]]}],null]}],["$","$Lc",null,{"gaId":"$undefined"}],["$","$Ld",null,{"async":true,"src":"https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-undefined","crossOrigin":"anonymous","strategy":"afterInteractive"}]]}]]}],null] e:I[3364,["311","static/chunks/311-ece9a4947c63cbe4.js","900","static/chunks/900-5fb194ef90f0bbe9.js","965","static/chunks/965-704ef81d34001ffc.js","308","static/chunks/app/blog/%5Bslug%5D/page-79b4219c250c2fa1.js"],""] f:I[419,["311","static/chunks/311-ece9a4947c63cbe4.js","900","static/chunks/900-5fb194ef90f0bbe9.js","965","static/chunks/965-704ef81d34001ffc.js","308","static/chunks/app/blog/%5Bslug%5D/page-79b4219c250c2fa1.js"],"BlogComments"] b:["$","section",null,{"children":[["$","h1",null,{"className":"text-2xl font-bold tracking-tighter","children":["$","$Le",null,{"children":"Exciting Features in ES2022"}]}],["$","div",null,{"className":"mb-8 mt-2 flex items-center justify-between text-sm text-neutral-600 dark:text-neutral-400","children":["$","p",null,{"children":["March 28, 2022"," - ","5 min read"]}]}],[["$","article",null,{"className":"prose prose-neutral dark:prose-invert prose-quoteless max-w-none","children":[["$","p",null,{"children":["In this article we will look at some cool features that are coming in ECMAScript 2022. Since its inception in 1997, ES2022 will be Javascript's 13th edition. At the time of writing this article all the features have already ",["$","a",null,{"target":"_blank","rel":"noopener noreferrer","href":"https://github.com/tc39/proposals/blob/main/finished-proposals.md","children":"reached Stage 4"}]," and are expected to be released by July, 2022."]}],"\n",["$","h2",null,{"id":"1-class-fields","children":[["$","a",null,{"className":"anchor","href":"#1-class-fields","children":["$","span",null,{"className":"icon icon-link"}]}],"1. Class Fields"]}],"\n",["$","h3",null,{"id":"private-fields-and-methods","children":[["$","a",null,{"className":"anchor","href":"#private-fields-and-methods","children":["$","span",null,{"className":"icon icon-link"}]}],"Private Fields and Methods"]}],"\n",["$","p",null,{"children":"Previously there wasn't any mechanism to setup private class fields in Javascript."}],"\n",["$","div",null,{"data-rehype-pretty-code-fragment":"","children":["$","pre",null,{"data-language":"js","data-theme":"default","children":["$","code",null,{"data-language":"js","data-theme":"default","style":{"display":"grid"},"children":[["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#C678DD"},"children":"class"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#E5C07B"},"children":"Post"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" {"}]]}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#E06C75"},"children":"title"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#56B6C2"},"children":"="}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#98C379"},"children":"\"Default Title\""}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"; "}],["$","span",null,{"style":{"color":"#7F848E","fontStyle":"italic"},"children":"// public"}]]}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#E06C75"},"children":"_date"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#56B6C2"},"children":"="}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#E5C07B"},"children":"Date"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"."}],["$","span",null,{"style":{"color":"#61AFEF"},"children":"now"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"(); "}],["$","span",null,{"style":{"color":"#7F848E","fontStyle":"italic"},"children":"// private"}]]}],"\n",["$","span",null,{"data-line":"","children":" "}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#61AFEF"},"children":"print"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"() {"}]]}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#E5C07B"},"children":"console"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"."}],["$","span",null,{"style":{"color":"#61AFEF"},"children":"log"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"("}],["$","span",null,{"style":{"color":"#E5C07B"},"children":"this"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"."}],["$","span",null,{"style":{"color":"#E06C75"},"children":"title"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":", "}],["$","span",null,{"style":{"color":"#E5C07B"},"children":"this"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"."}],["$","span",null,{"style":{"color":"#E06C75"},"children":"date"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":");"}]]}],"\n",["$","span",null,{"data-line":"","children":["$","span",null,{"style":{"color":"#ABB2BF"},"children":" }"}]}],"\n",["$","span",null,{"data-line":"","children":["$","span",null,{"style":{"color":"#ABB2BF"},"children":"}"}]}],"\n",["$","span",null,{"data-line":"","children":" "}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#C678DD"},"children":"const"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#E5C07B"},"children":"post"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#56B6C2"},"children":"="}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#C678DD"},"children":"new"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#61AFEF"},"children":"Post"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"();"}]]}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#E5C07B"},"children":"post"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"."}],["$","span",null,{"style":{"color":"#E06C75"},"children":"title"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#56B6C2"},"children":"="}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#98C379"},"children":"\"New Post\""}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"; "}],["$","span",null,{"style":{"color":"#7F848E","fontStyle":"italic"},"children":"// public field accessed from outsite"}]]}],"\n",["$","span",null,{"data-line":"","children":" "}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#E5C07B"},"children":"post"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"."}],["$","span",null,{"style":{"color":"#E06C75"},"children":"_date"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#56B6C2"},"children":"="}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#98C379"},"children":"\"2022/10/20\""}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"; "}],["$","span",null,{"style":{"color":"#7F848E","fontStyle":"italic"},"children":"// even though we have access private field outsite of class"}]]}],"\n",["$","span",null,{"data-line":"","children":" "}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#E5C07B"},"children":"post"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"."}],["$","span",null,{"style":{"color":"#61AFEF"},"children":"print"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"();"}]]}]]}]}]}],"\n",["$","p",null,{"children":["Even though ",["$","code",null,{"children":"_date"}]," field is marked as private, ",["$","code",null,{"children":"_"}]," underscore is just naming convention for private field, it's not there in language specification so can be accessed from outside and doesn't shows any error. So there wasn't any Encapsulation in fields and methods in Js specs."]}],"\n",["$","p",null,{"children":["Now in ES2022 we have private class fields and methos. For that we have to prefix our methods and fields with pound ",["$","code",null,{"children":"#"}]," sign. Also, whenever we try to access private field we have to prefix ",["$","code",null,{"children":"#"}],"."]}],"\n",["$","div",null,{"data-rehype-pretty-code-fragment":"","children":["$","pre",null,{"data-language":"js","data-theme":"default","children":["$","code",null,{"data-language":"js","data-theme":"default","style":{"display":"grid"},"children":[["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#C678DD"},"children":"class"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#E5C07B"},"children":"Post"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" {"}]]}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#E06C75"},"children":"title"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#56B6C2"},"children":"="}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#98C379"},"children":"\"Default Title\""}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":";"}]]}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#E06C75"},"children":"#date"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#56B6C2"},"children":"="}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#E5C07B"},"children":"Date"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"."}],["$","span",null,{"style":{"color":"#61AFEF"},"children":"now"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"(); "}],["$","span",null,{"style":{"color":"#7F848E","fontStyle":"italic"},"children":"// private field from ES2022"}]]}],"\n",["$","span",null,{"data-line":"","children":" "}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#61AFEF"},"children":"print"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"() {"}]]}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#E5C07B"},"children":"console"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"."}],["$","span",null,{"style":{"color":"#61AFEF"},"children":"log"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"("}],["$","span",null,{"style":{"color":"#E5C07B"},"children":"this"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"."}],["$","span",null,{"style":{"color":"#E06C75"},"children":"title"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":", "}],["$","span",null,{"style":{"color":"#E5C07B"},"children":"this"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"."}],["$","span",null,{"style":{"color":"#E06C75"},"children":"#date"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"); "}],["$","span",null,{"style":{"color":"#7F848E","fontStyle":"italic"},"children":"// ✅ can access private field within class"}]]}],"\n",["$","span",null,{"data-line":"","children":["$","span",null,{"style":{"color":"#ABB2BF"},"children":" }"}]}],"\n",["$","span",null,{"data-line":"","children":" "}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#ABB2BF"},"children":" #"}],["$","span",null,{"style":{"color":"#61AFEF"},"children":"getTitle"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"() {"}]]}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#C678DD"},"children":"return"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#E5C07B"},"children":"this"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"."}],["$","span",null,{"style":{"color":"#E06C75"},"children":"title"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":";"}]]}],"\n",["$","span",null,{"data-line":"","children":["$","span",null,{"style":{"color":"#ABB2BF"},"children":" }"}]}],"\n",["$","span",null,{"data-line":"","children":["$","span",null,{"style":{"color":"#ABB2BF"},"children":"}"}]}],"\n",["$","span",null,{"data-line":"","children":" "}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#C678DD"},"children":"const"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#E5C07B"},"children":"post"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#56B6C2"},"children":"="}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#C678DD"},"children":"new"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#61AFEF"},"children":"Post"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"();"}]]}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#E5C07B"},"children":"post"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"."}],["$","span",null,{"style":{"color":"#E06C75"},"children":"title"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#56B6C2"},"children":"="}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#98C379"},"children":"\"New Post\""}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":";"}]]}],"\n",["$","span",null,{"data-line":"","children":" "}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#E5C07B"},"children":"post"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"."}],["$","span",null,{"style":{"color":"#E06C75"},"children":"#date"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#56B6C2"},"children":"="}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#98C379"},"children":"\"2022/10/20\""}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"; "}],["$","span",null,{"style":{"color":"#7F848E","fontStyle":"italic"},"children":"// ❌ Uncaught SyntaxError: Private field '#date' must be declared in an enclosing class"}]]}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#E5C07B"},"children":"post"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"."}],["$","span",null,{"style":{"color":"#61AFEF"},"children":"getTitle"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"(); "}],["$","span",null,{"style":{"color":"#7F848E","fontStyle":"italic"},"children":"// ❌ Uncaught SyntaxError: Private field '#print' must be declared in an enclosing class"}]]}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#E5C07B"},"children":"post"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"."}],["$","span",null,{"style":{"color":"#61AFEF"},"children":"print"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"();"}]]}]]}]}]}],"\n",["$","h3",null,{"id":"static-methods-and-fields","children":[["$","a",null,{"className":"anchor","href":"#static-methods-and-fields","children":["$","span",null,{"className":"icon icon-link"}]}],"Static Methods and Fields"]}],"\n",["$","p",null,{"children":"The static members of a class are accessed using the class name and dot notation, without creating an object."}],"\n",["$","p",null,{"children":"Previously,"}],"\n",["$","div",null,{"data-rehype-pretty-code-fragment":"","children":["$","pre",null,{"data-language":"js","data-theme":"default","children":["$","code",null,{"data-language":"js","data-theme":"default","style":{"display":"grid"},"children":[["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#C678DD"},"children":"class"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#E5C07B"},"children":"Cirlce"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" {"}]]}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#61AFEF"},"children":"getArea"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"() {}"}]]}],"\n",["$","span",null,{"data-line":"","children":["$","span",null,{"style":{"color":"#ABB2BF"},"children":"}"}]}],"\n",["$","span",null,{"data-line":"","children":" "}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#E5C07B"},"children":"Cricle"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"."}],["$","span",null,{"style":{"color":"#E06C75"},"children":"PI"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#56B6C2"},"children":"="}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#D19A66"},"children":"3.14"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"; "}],["$","span",null,{"style":{"color":"#7F848E","fontStyle":"italic"},"children":"// define sttaic fields"}]]}]]}]}]}],"\n",["$","p",null,{"children":["But now with introduction to ",["$","code",null,{"children":"static"}]," keywordwe can directly define it inside class."]}],"\n",["$","div",null,{"data-rehype-pretty-code-fragment":"","children":["$","pre",null,{"data-language":"js","data-theme":"default","children":["$","code",null,{"data-language":"js","data-theme":"default","style":{"display":"grid"},"children":[["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#C678DD"},"children":"class"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#E5C07B"},"children":"Circle"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" {"}]]}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#C678DD"},"children":"static"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#E06C75"},"children":"PI"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#56B6C2"},"children":"="}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#D19A66"},"children":"3.14"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":";"}]]}],"\n",["$","span",null,{"data-line":"","children":" "}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#C678DD"},"children":"static"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#61AFEF"},"children":"getArea"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"("}],["$","span",null,{"style":{"color":"#E06C75","fontStyle":"italic"},"children":"radius"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":") {"}]]}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#C678DD"},"children":"return"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#E5C07B"},"children":"this"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"."}],["$","span",null,{"style":{"color":"#E06C75"},"children":"PI"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#56B6C2"},"children":"*"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#E5C07B"},"children":"Math"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"."}],["$","span",null,{"style":{"color":"#61AFEF"},"children":"pow"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"("}],["$","span",null,{"style":{"color":"#E06C75"},"children":"radius"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":", "}],["$","span",null,{"style":{"color":"#D19A66"},"children":"2"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":");"}]]}],"\n",["$","span",null,{"data-line":"","children":["$","span",null,{"style":{"color":"#ABB2BF"},"children":" }"}]}],"\n",["$","span",null,{"data-line":"","children":["$","span",null,{"style":{"color":"#ABB2BF"},"children":"}"}]}],"\n",["$","span",null,{"data-line":"","children":" "}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#E5C07B"},"children":"console"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"."}],["$","span",null,{"style":{"color":"#61AFEF"},"children":"log"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"("}],["$","span",null,{"style":{"color":"#E5C07B"},"children":"Circle"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"."}],["$","span",null,{"style":{"color":"#61AFEF"},"children":"getArea"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"("}],["$","span",null,{"style":{"color":"#D19A66"},"children":"3"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"));"}]]}]]}]}]}],"\n",["$","h2",null,{"id":"2-top-level-await","children":[["$","a",null,{"className":"anchor","href":"#2-top-level-await","children":["$","span",null,{"className":"icon icon-link"}]}],"2. Top-level ",["$","code",null,{"children":"await"}]]}],"\n",["$","p",null,{"children":["Previously we need we can't declare ",["$","code",null,{"children":"await"}]," keyword outside ",["$","code",null,{"children":"async"}]," function."]}],"\n",["$","p",null,{"children":["When we fetch the data from api using ",["$","code",null,{"children":"async await"}],", we return promises and use ",["$","code",null,{"children":"then()"}]," to use the data."]}],"\n",["$","div",null,{"data-rehype-pretty-code-fragment":"","children":["$","pre",null,{"data-language":"js","data-theme":"default","children":["$","code",null,{"data-language":"js","data-theme":"default","style":{"display":"grid"},"children":[["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#C678DD"},"children":"async"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#C678DD"},"children":"function"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#61AFEF"},"children":"getPost"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"() {"}]]}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#C678DD"},"children":"const"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#E5C07B"},"children":"data"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#56B6C2"},"children":"="}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#C678DD"},"children":"await"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#61AFEF"},"children":"fetch"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"("}],["$","span",null,{"style":{"color":"#98C379"},"children":"\"https://jsonplaceholder.typicode.com/posts/1\""}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":");"}]]}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#C678DD"},"children":"const"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#E5C07B"},"children":"postJson"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#56B6C2"},"children":"="}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#C678DD"},"children":"await"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#E5C07B"},"children":"data"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"."}],["$","span",null,{"style":{"color":"#61AFEF"},"children":"json"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"();"}]]}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#C678DD"},"children":"return"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#E06C75"},"children":"postJson"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":";"}]]}],"\n",["$","span",null,{"data-line":"","children":["$","span",null,{"style":{"color":"#ABB2BF"},"children":"}"}]}],"\n",["$","span",null,{"data-line":"","children":" "}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#61AFEF"},"children":"getPost"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"()."}],["$","span",null,{"style":{"color":"#61AFEF"},"children":"then"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"(("}],["$","span",null,{"style":{"color":"#E06C75","fontStyle":"italic"},"children":"post"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":") "}],["$","span",null,{"style":{"color":"#C678DD"},"children":"=>"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#E5C07B"},"children":"console"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"."}],["$","span",null,{"style":{"color":"#61AFEF"},"children":"log"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"("}],["$","span",null,{"style":{"color":"#E06C75"},"children":"post"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"));"}]]}]]}]}]}],"\n",["$","p",null,{"children":["But now we can directly use await keyword without wrapping it inside async function. With top-level ",["$","code",null,{"children":"await"}]," it will treat the whole module as ",["$","code",null,{"children":"async"}]," function."]}],"\n",["$","div",null,{"data-rehype-pretty-code-fragment":"","children":["$","pre",null,{"data-language":"js","data-theme":"default","children":["$","code",null,{"data-language":"js","data-theme":"default","style":{"display":"grid"},"children":[["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#C678DD"},"children":"const"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#E5C07B"},"children":"post"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#56B6C2"},"children":"="}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#C678DD"},"children":"await"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#61AFEF"},"children":"fetch"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"("}],["$","span",null,{"style":{"color":"#98C379"},"children":"\"https://jsonplaceholder.typicode.com/posts/1\""}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":");"}]]}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#E5C07B"},"children":"console"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"."}],["$","span",null,{"style":{"color":"#61AFEF"},"children":"log"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"("}],["$","span",null,{"style":{"color":"#E06C75"},"children":"posts"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":");"}]]}]]}]}]}],"\n",["$","p",null,{"children":["There we other exciting usecases for it ",["$","a",null,{"target":"_blank","rel":"noopener noreferrer","href":"https://github.com/tc39/proposal-top-level-await#use-cases","children":"Check tc39 proposal"}],"."]}],"\n",["$","h2",null,{"id":"3-relative-indexing-using-at-method","children":[["$","a",null,{"className":"anchor","href":"#3-relative-indexing-using-at-method","children":["$","span",null,{"className":"icon icon-link"}]}],"3. Relative indexing using ",["$","code",null,{"children":".at()"}]," method"]}],"\n",["$","p",null,{"children":["Till noew we can only access the elements in array using positive index, so have calculate the length of array and calculate the value accordingly. After ES2022, we can easily access the elements using positive or negative index using ",["$","code",null,{"children":"at()"}]," method."]}],"\n",["$","div",null,{"data-rehype-pretty-code-fragment":"","children":["$","pre",null,{"data-language":"js","data-theme":"default","children":["$","code",null,{"data-language":"js","data-theme":"default","style":{"display":"grid"},"children":[["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#C678DD"},"children":"const"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#E5C07B"},"children":"arr"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#56B6C2"},"children":"="}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#61AFEF"},"children":"Array"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"("}],["$","span",null,{"style":{"color":"#D19A66"},"children":"100"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":")"}]]}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#ABB2BF"},"children":" ."}],["$","span",null,{"style":{"color":"#61AFEF"},"children":"fill"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"()"}]]}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#ABB2BF"},"children":" ."}],["$","span",null,{"style":{"color":"#61AFEF"},"children":"map"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"(() "}],["$","span",null,{"style":{"color":"#C678DD"},"children":"=>"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#E5C07B"},"children":"Math"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"."}],["$","span",null,{"style":{"color":"#61AFEF"},"children":"random"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"());"}]]}],"\n",["$","span",null,{"data-line":"","children":" "}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#E06C75"},"children":"arr"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"["}],["$","span",null,{"style":{"color":"#E5C07B"},"children":"arr"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"."}],["$","span",null,{"style":{"color":"#E06C75"},"children":"length"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#56B6C2"},"children":"-"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#D19A66"},"children":"1"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"]; "}],["$","span",null,{"style":{"color":"#7F848E","fontStyle":"italic"},"children":"// prev, 100"}]]}],"\n",["$","span",null,{"data-line":"","children":" "}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#E5C07B"},"children":"arr"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"."}],["$","span",null,{"style":{"color":"#61AFEF"},"children":"at"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"("}],["$","span",null,{"style":{"color":"#56B6C2"},"children":"-"}],["$","span",null,{"style":{"color":"#D19A66"},"children":"1"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"); "}],["$","span",null,{"style":{"color":"#7F848E","fontStyle":"italic"},"children":"// last num i.e 100"}]]}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#E5C07B"},"children":"arr"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"."}],["$","span",null,{"style":{"color":"#61AFEF"},"children":"at"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"("}],["$","span",null,{"style":{"color":"#56B6C2"},"children":"-"}],["$","span",null,{"style":{"color":"#D19A66"},"children":"2"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"); "}],["$","span",null,{"style":{"color":"#7F848E","fontStyle":"italic"},"children":"// second last i.e 99"}]]}]]}]}]}],"\n",["$","h2",null,{"id":"4-accessible-objecthasown-method","children":[["$","a",null,{"className":"anchor","href":"#4-accessible-objecthasown-method","children":["$","span",null,{"className":"icon icon-link"}]}],"4. Accessible ",["$","code",null,{"children":"Object.hasOwn()"}]," method"]}],"\n",["$","p",null,{"children":["This method is used to confirm wether the certian property exists in object itself or nested prototypical chain of that object. Previously we used to have ",["$","code",null,{"children":"Object.hasOwnProperty()"}]," to do the same thing. ",["$","code",null,{"children":"hasOwnProperty"}]," tries to check if certain property exists inside object itself, if that property exists inside its prototype then it will return ",["$","code",null,{"children":"false"}],". Issue with this method is that, JavaScript does not protect the property name hasOwnProperty; an object that has a property with this name may return incorrect results:"]}],"\n",["$","div",null,{"data-rehype-pretty-code-fragment":"","children":["$","pre",null,{"data-language":"js","data-theme":"default","children":["$","code",null,{"data-language":"js","data-theme":"default","style":{"display":"grid"},"children":[["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#C678DD"},"children":"const"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#E5C07B"},"children":"user"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#56B6C2"},"children":"="}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" {"}]]}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#E06C75"},"children":"name"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":": "}],["$","span",null,{"style":{"color":"#98C379"},"children":"\"John\""}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":","}]]}],"\n",["$","span",null,{"data-line":"","children":" "}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#7F848E","fontStyle":"italic"},"children":"// override hasOwnProperty() method in obj"}]]}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#61AFEF"},"children":"hasOwnProperty"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"() {"}]]}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#C678DD"},"children":"return"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#D19A66"},"children":"false"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":";"}]]}],"\n",["$","span",null,{"data-line":"","children":["$","span",null,{"style":{"color":"#ABB2BF"},"children":" },"}]}],"\n",["$","span",null,{"data-line":"","children":["$","span",null,{"style":{"color":"#ABB2BF"},"children":"};"}]}],"\n",["$","span",null,{"data-line":"","children":" "}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#E5C07B"},"children":"user"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"."}],["$","span",null,{"style":{"color":"#61AFEF"},"children":"hasOwnProperty"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"("}],["$","span",null,{"style":{"color":"#98C379"},"children":"\"name\""}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"); "}],["$","span",null,{"style":{"color":"#7F848E","fontStyle":"italic"},"children":"// always return false since we override it to return false"}]]}]]}]}]}],"\n",["$","p",null,{"children":["Instead of calling ",["$","code",null,{"children":"hasOwnProperty()"}]," on object prototypical chain (",["$","code",null,{"children":"user"}]," in our case), we pass the object and property we want to check inside the ",["$","code",null,{"children":"hasOwn()"}]," method shipped in ES2022 ",["$","code",null,{"children":"Object"}]," class itself."]}],"\n",["$","div",null,{"data-rehype-pretty-code-fragment":"","children":["$","pre",null,{"data-language":"js","data-theme":"default","children":["$","code",null,{"data-language":"js","data-theme":"default","style":{"display":"grid"},"children":[["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#C678DD"},"children":"const"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#E5C07B"},"children":"user"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#56B6C2"},"children":"="}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" {"}]]}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#E06C75"},"children":"name"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":": "}],["$","span",null,{"style":{"color":"#98C379"},"children":"\"John\""}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":","}]]}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#E06C75"},"children":"age"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":": "}],["$","span",null,{"style":{"color":"#D19A66"},"children":"20"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":","}]]}],"\n",["$","span",null,{"data-line":"","children":["$","span",null,{"style":{"color":"#ABB2BF"},"children":"};"}]}],"\n",["$","span",null,{"data-line":"","children":" "}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#E5C07B"},"children":"Object"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"."}],["$","span",null,{"style":{"color":"#61AFEF"},"children":"hasOwn"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"("}],["$","span",null,{"style":{"color":"#E06C75"},"children":"user"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":", "}],["$","span",null,{"style":{"color":"#98C379"},"children":"\"name\""}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"); "}],["$","span",null,{"style":{"color":"#7F848E","fontStyle":"italic"},"children":"// true"}]]}]]}]}]}],"\n",["$","h2",null,{"id":"5-error-cause","children":[["$","a",null,{"className":"anchor","href":"#5-error-cause","children":["$","span",null,{"className":"icon icon-link"}]}],"5. Error .cause"]}],"\n",["$","p",null,{"children":["Most of the time error are wrapped with meaningful message about case of error, but original contextual information of error might get lost. Using error ",["$","code",null,{"children":"cause"}]," we can attach the original error to a wrapping error. The options parameter is added to ",["$","code",null,{"children":"Error()"}]," constructor with ",["$","code",null,{"children":"cause"}]," property and a ",["$","code",null,{"children":"cause"}]," field is used for retrieving the original error."]}],"\n",["$","div",null,{"data-rehype-pretty-code-fragment":"","children":["$","pre",null,{"data-language":"js","data-theme":"default","children":["$","code",null,{"data-language":"js","data-theme":"default","style":{"display":"grid"},"children":[["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#C678DD"},"children":"const"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#61AFEF"},"children":"getPost"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#56B6C2"},"children":"="}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#C678DD"},"children":"async"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" ("}],["$","span",null,{"style":{"color":"#E06C75","fontStyle":"italic"},"children":"postId"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":") "}],["$","span",null,{"style":{"color":"#C678DD"},"children":"=>"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" {"}]]}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#C678DD"},"children":"try"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" {"}]]}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#C678DD"},"children":"const"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#E5C07B"},"children":"data"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#56B6C2"},"children":"="}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#C678DD"},"children":"await"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#61AFEF"},"children":"fetch"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"("}]]}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#98C379"},"children":"`https://jsonplaceholder.typicode.com/posts/"}],["$","span",null,{"style":{"color":"#C678DD"},"children":"$${"}],["$","span",null,{"style":{"color":"#E06C75"},"children":"postId"}],["$","span",null,{"style":{"color":"#C678DD"},"children":"}"}],["$","span",null,{"style":{"color":"#98C379"},"children":"`"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":","}]]}],"\n",["$","span",null,{"data-line":"","children":["$","span",null,{"style":{"color":"#ABB2BF"},"children":" );"}]}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#C678DD"},"children":"const"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#E5C07B"},"children":"postJson"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#56B6C2"},"children":"="}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#C678DD"},"children":"await"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#E5C07B"},"children":"data"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"."}],["$","span",null,{"style":{"color":"#61AFEF"},"children":"json"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"();"}]]}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#C678DD"},"children":"return"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#E06C75"},"children":"postJson"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":";"}]]}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#ABB2BF"},"children":" } "}],["$","span",null,{"style":{"color":"#C678DD"},"children":"catch"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" ("}],["$","span",null,{"style":{"color":"#E06C75"},"children":"error"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":") {"}]]}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#C678DD"},"children":"throw"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#C678DD"},"children":"new"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#61AFEF"},"children":"Error"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"("}],["$","span",null,{"style":{"color":"#98C379"},"children":"`Loading data for post with id "}],["$","span",null,{"style":{"color":"#C678DD"},"children":"$${"}],["$","span",null,{"style":{"color":"#E06C75"},"children":"postId"}],["$","span",null,{"style":{"color":"#C678DD"},"children":"}"}],["$","span",null,{"style":{"color":"#98C379"},"children":" failed.`"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":", {"}]]}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#E06C75"},"children":"cause"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":": "}],["$","span",null,{"style":{"color":"#E06C75"},"children":"error"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":","}]]}],"\n",["$","span",null,{"data-line":"","children":["$","span",null,{"style":{"color":"#ABB2BF"},"children":" });"}]}],"\n",["$","span",null,{"data-line":"","children":["$","span",null,{"style":{"color":"#ABB2BF"},"children":" }"}]}],"\n",["$","span",null,{"data-line":"","children":["$","span",null,{"style":{"color":"#ABB2BF"},"children":"};"}]}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#C678DD"},"children":"try"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" {"}]]}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#C678DD"},"children":"const"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#E5C07B"},"children":"post"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#56B6C2"},"children":"="}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#C678DD"},"children":"await"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#61AFEF"},"children":"getPost"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"("}],["$","span",null,{"style":{"color":"#D19A66"},"children":"4352"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":");"}]]}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#7F848E","fontStyle":"italic"},"children":"// do something"}]]}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#ABB2BF"},"children":"} "}],["$","span",null,{"style":{"color":"#C678DD"},"children":"catch"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" ("}],["$","span",null,{"style":{"color":"#E06C75"},"children":"error"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":") {"}]]}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#E5C07B"},"children":"console"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"."}],["$","span",null,{"style":{"color":"#61AFEF"},"children":"log"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"("}],["$","span",null,{"style":{"color":"#E06C75"},"children":"error"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"); "}],["$","span",null,{"style":{"color":"#7F848E","fontStyle":"italic"},"children":"// Error: Loading data for post with id 4352 failed."}]]}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#E5C07B"},"children":"console"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"."}],["$","span",null,{"style":{"color":"#61AFEF"},"children":"log"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"("}],["$","span",null,{"style":{"color":"#E5C07B"},"children":"error"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"."}],["$","span",null,{"style":{"color":"#E06C75"},"children":"cause"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"); "}],["$","span",null,{"style":{"color":"#7F848E","fontStyle":"italic"},"children":"// TypeError: Failed to fetch"}]]}],"\n",["$","span",null,{"data-line":"","children":["$","span",null,{"style":{"color":"#ABB2BF"},"children":"}"}]}]]}]}]}],"\n",["$","h2",null,{"id":"6-regexp-match-indices","children":[["$","a",null,{"className":"anchor","href":"#6-regexp-match-indices","children":["$","span",null,{"className":"icon icon-link"}]}],"6. RegExp Match Indices"]}],"\n",["$","p",null,{"children":["RegExp Match Indices provide additional information about the start and end indices of captured substrings. While calling the ",["$","code",null,{"children":"RegExp.exec"}]," or ",["$","code",null,{"children":"String.matchAll()"}]," methods, we provide additional ",["$","code",null,{"children":"/d"}]," flag to regular expression, the start and end index are available in the ",["$","code",null,{"children":"indices"}]," array property of the result."]}],"\n",["$","p",null,{"children":"In the below example we find all the indices of the switch reserved keyword present in out code."}],"\n",["$","div",null,{"data-rehype-pretty-code-fragment":"","children":["$","pre",null,{"data-language":"js","data-theme":"default","children":["$","code",null,{"data-language":"js","data-theme":"default","style":{"display":"grid"},"children":[["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#C678DD"},"children":"const"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#E5C07B"},"children":"statement"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#56B6C2"},"children":"="}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#98C379"},"children":"\"const switch = 0\""}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":";"}]]}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#C678DD"},"children":"const"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#E5C07B"},"children":"regex"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#56B6C2"},"children":"="}],["$","span",null,{"style":{"color":"#E06C75"},"children":" /(switch)/"}],["$","span",null,{"style":{"color":"#C678DD"},"children":"dg"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":";"}]]}],"\n",["$","span",null,{"data-line":"","children":" "}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#C678DD"},"children":"const"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#E5C07B"},"children":"matches"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" "}],["$","span",null,{"style":{"color":"#56B6C2"},"children":"="}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":" [..."}],["$","span",null,{"style":{"color":"#E5C07B"},"children":"statement"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"."}],["$","span",null,{"style":{"color":"#61AFEF"},"children":"matchAll"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"("}],["$","span",null,{"style":{"color":"#E06C75"},"children":"regex"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":")];"}]]}],"\n",["$","span",null,{"data-line":"","children":" "}],"\n",["$","span",null,{"data-line":"","children":[["$","span",null,{"style":{"color":"#E5C07B"},"children":"console"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"."}],["$","span",null,{"style":{"color":"#61AFEF"},"children":"log"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":"("}],["$","span",null,{"style":{"color":"#E06C75"},"children":"matches"}],["$","span",null,{"style":{"color":"#ABB2BF"},"children":");"}]]}],"\n",["$","span",null,{"data-line":"","children":" "}],"\n",["$","span",null,{"data-line":"","children":["$","span",null,{"style":{"color":"#7F848E","fontStyle":"italic"},"children":"/**"}]}],"\n",["$","span",null,{"data-line":"","children":["$","span",null,{"style":{"color":"#7F848E","fontStyle":"italic"},"children":" * Result :"}]}],"\n",["$","span",null,{"data-line":"","children":["$","span",null,{"style":{"color":"#7F848E","fontStyle":"italic"},"children":"["}]}],"\n",["$","span",null,{"data-line":"","children":["$","span",null,{"style":{"color":"#7F848E","fontStyle":"italic"},"children":" \"switch\","}]}],"\n",["$","span",null,{"data-line":"","children":["$","span",null,{"style":{"color":"#7F848E","fontStyle":"italic"},"children":" \"switch\","}]}],"\n",["$","span",null,{"data-line":"","children":["$","span",null,{"style":{"color":"#7F848E","fontStyle":"italic"},"children":" groups: undefined,"}]}],"\n",["$","span",null,{"data-line":"","children":["$","span",null,{"style":{"color":"#7F848E","fontStyle":"italic"},"children":" index: 6,"}]}],"\n",["$","span",null,{"data-line":"","children":["$","span",null,{"style":{"color":"#7F848E","fontStyle":"italic"},"children":" indices: ["}]}],"\n",["$","span",null,{"data-line":"","children":["$","span",null,{"style":{"color":"#7F848E","fontStyle":"italic"},"children":" [6, 12],"}]}],"\n",["$","span",null,{"data-line":"","children":["$","span",null,{"style":{"color":"#7F848E","fontStyle":"italic"},"children":" [6, 12],"}]}],"\n",["$","span",null,{"data-line":"","children":["$","span",null,{"style":{"color":"#7F848E","fontStyle":"italic"},"children":" groups: undefined"}]}],"\n",["$","span",null,{"data-line":"","children":["$","span",null,{"style":{"color":"#7F848E","fontStyle":"italic"},"children":" ]"}]}],"\n",["$","span",null,{"data-line":"","children":["$","span",null,{"style":{"color":"#7F848E","fontStyle":"italic"},"children":" input: \"const switch = 0\","}]}],"\n",["$","span",null,{"data-line":"","children":["$","span",null,{"style":{"color":"#7F848E","fontStyle":"italic"},"children":" length: 2,"}]}],"\n",["$","span",null,{"data-line":"","children":["$","span",null,{"style":{"color":"#7F848E","fontStyle":"italic"},"children":"]"}]}],"\n",["$","span",null,{"data-line":"","children":["$","span",null,{"style":{"color":"#7F848E","fontStyle":"italic"},"children":" */"}]}]]}]}]}],"\n",["$","p",null,{"children":"Most of the above features are already available in modern browsers, and Node.js environment, but for production use we might need to polyfill for target environment."}],"\n",["$","h2",null,{"id":"references","children":[["$","a",null,{"className":"anchor","href":"#references","children":["$","span",null,{"className":"icon icon-link"}]}],"References"]}],"\n",["$","ul",null,{"children":["\n",["$","li",null,{"children":["$","a",null,{"target":"_blank","rel":"noopener noreferrer","href":"https://github.com/tc39/proposals/blob/main/finished-proposals.md","children":"TC39 Finished Proposals"}]}],"\n"]}]]}],["$","$Lf",null,{}]]]}] a:null