[{"data":1,"prerenderedAt":4074},["ShallowReactive",2],{"page-\u002Fjs\u002F07-objects-and-properties":3},{"id":4,"title":5,"body":6,"description":35,"extension":4068,"meta":4069,"navigation":81,"path":4070,"seo":4071,"stem":4072,"__hash__":4073},"content\u002Fjs\u002F07-objects-and-properties.md","07 — Objects & Properties",{"type":7,"value":8,"toc":4041},"minimark",[9,13,255,436,575,744,932,1186,1417,1640,1848,2069,2296,2483,2654,2862,3153,3335,3523,3698,3803,4037],[10,11,5],"h1",{"id":12},"_07-objects-properties",[14,15,17,27,177,217],"question-wrapper",{"language":16},"javascript",[18,19,21,22,26],"h3",{"id":20},"q1-what-does-objectkeysproduct-log","Q1. What does ",[23,24,25],"code",{},"Object.keys(product)"," log?",[28,29,30],"code-wrapper",{"language":16},[31,32,36],"pre",{"className":33,"code":34,"language":16,"meta":35,"style":35},"language-javascript shiki shiki-themes github-light github-dark","const price = 42;\nconst inStock = true;\n\nconst product = {\n  price,\n  inStock,\n  describe() {\n    return `$${this.price}`;\n  },\n};\n\nconsole.log(Object.keys(product));\n","",[23,37,38,61,76,83,96,102,108,118,142,148,154,159],{"__ignoreMap":35},[39,40,43,47,51,54,57],"span",{"class":41,"line":42},"line",1,[39,44,46],{"class":45},"svdQ7","const",[39,48,50],{"class":49},"snvgF"," price",[39,52,53],{"class":45}," =",[39,55,56],{"class":49}," 42",[39,58,60],{"class":59},"ssxIu",";\n",[39,62,64,66,69,71,74],{"class":41,"line":63},2,[39,65,46],{"class":45},[39,67,68],{"class":49}," inStock",[39,70,53],{"class":45},[39,72,73],{"class":49}," true",[39,75,60],{"class":59},[39,77,79],{"class":41,"line":78},3,[39,80,82],{"emptyLinePlaceholder":81},true,"\n",[39,84,86,88,91,93],{"class":41,"line":85},4,[39,87,46],{"class":45},[39,89,90],{"class":49}," product",[39,92,53],{"class":45},[39,94,95],{"class":59}," {\n",[39,97,99],{"class":41,"line":98},5,[39,100,101],{"class":59},"  price,\n",[39,103,105],{"class":41,"line":104},6,[39,106,107],{"class":59},"  inStock,\n",[39,109,111,115],{"class":41,"line":110},7,[39,112,114],{"class":113},"sIsaT","  describe",[39,116,117],{"class":59},"() {\n",[39,119,121,124,128,131,134,137,140],{"class":41,"line":120},8,[39,122,123],{"class":45},"    return",[39,125,127],{"class":126},"sJ6F3"," `$${",[39,129,130],{"class":49},"this",[39,132,133],{"class":126},".",[39,135,136],{"class":59},"price",[39,138,139],{"class":126},"}`",[39,141,60],{"class":59},[39,143,145],{"class":41,"line":144},9,[39,146,147],{"class":59},"  },\n",[39,149,151],{"class":41,"line":150},10,[39,152,153],{"class":59},"};\n",[39,155,157],{"class":41,"line":156},11,[39,158,82],{"emptyLinePlaceholder":81},[39,160,162,165,168,171,174],{"class":41,"line":161},12,[39,163,164],{"class":59},"console.",[39,166,167],{"class":113},"log",[39,169,170],{"class":59},"(Object.",[39,172,173],{"class":113},"keys",[39,175,176],{"class":59},"(product));\n",[178,179,182,195,203,211],"ul",{"className":180},[181],"contains-task-list",[183,184,187,191,192],"li",{"className":185},[186],"task-list-item",[188,189],"input",{"disabled":81,"type":190},"checkbox"," ",[39,193,194],{},"\"price\", \"inStock\"",[183,196,198,191,200],{"className":197},[186],[188,199],{"disabled":81,"type":190},[39,201,202],{},"\"price\", \"inStock\", \"describe\"",[183,204,206,191,208],{"className":205},[186],[188,207],{"disabled":81,"type":190},[39,209,210],{},"\"describe\", \"price\", \"inStock\"",[183,212,214,216],{"className":213},[186],[188,215],{"disabled":81,"type":190}," TypeError: describe is not a valid shorthand method",[218,219,220,224,234],"details",{},[221,222,223],"summary",{},"Show Answer",[225,226,227,231,232],"p",{},[228,229,230],"strong",{},"Answer:"," B — ",[39,233,202],{},[225,235,236,239,240,243,244,247,248,250,251,254],{},[228,237,238],{},"Explanation:"," Method shorthand (",[23,241,242],{},"describe() {}",") creates a regular own, enumerable, writable, configurable property whose value happens to be a function — it's collected by ",[23,245,246],{},"Object.keys"," exactly like ",[23,249,136],{}," and ",[23,252,253],{},"inStock",", listed without parentheses. Keys stay in insertion order since none of them are integer-like. Option A wrongly assumes methods aren't \"real\" properties; C wrongly reorders them (string keys keep insertion order, they aren't sorted); D is wrong because shorthand methods are valid ES6 syntax.",[14,256,257,261,366,393],{"language":16},[18,258,260],{"id":259},"q2-what-does-this-log","Q2. What does this log?",[28,262,263],{"language":16},[31,264,266],{"className":33,"code":265,"language":16,"meta":35,"style":35},"const key = \"role\" + \"Id\";\nconst suffix = 2;\n\nconst user = {\n  [key]: 101,\n  [`level${suffix}`]: \"admin\",\n};\n\nconsole.log(user);\n",[23,267,268,288,302,306,317,328,349,353,357],{"__ignoreMap":35},[39,269,270,272,275,277,280,283,286],{"class":41,"line":42},[39,271,46],{"class":45},[39,273,274],{"class":49}," key",[39,276,53],{"class":45},[39,278,279],{"class":126}," \"role\"",[39,281,282],{"class":45}," +",[39,284,285],{"class":126}," \"Id\"",[39,287,60],{"class":59},[39,289,290,292,295,297,300],{"class":41,"line":63},[39,291,46],{"class":45},[39,293,294],{"class":49}," suffix",[39,296,53],{"class":45},[39,298,299],{"class":49}," 2",[39,301,60],{"class":59},[39,303,304],{"class":41,"line":78},[39,305,82],{"emptyLinePlaceholder":81},[39,307,308,310,313,315],{"class":41,"line":85},[39,309,46],{"class":45},[39,311,312],{"class":49}," user",[39,314,53],{"class":45},[39,316,95],{"class":59},[39,318,319,322,325],{"class":41,"line":98},[39,320,321],{"class":59},"  [key]: ",[39,323,324],{"class":49},"101",[39,326,327],{"class":59},",\n",[39,329,330,333,336,339,341,344,347],{"class":41,"line":104},[39,331,332],{"class":59},"  [",[39,334,335],{"class":126},"`level${",[39,337,338],{"class":59},"suffix",[39,340,139],{"class":126},[39,342,343],{"class":59},"]: ",[39,345,346],{"class":126},"\"admin\"",[39,348,327],{"class":59},[39,350,351],{"class":41,"line":110},[39,352,153],{"class":59},[39,354,355],{"class":41,"line":120},[39,356,82],{"emptyLinePlaceholder":81},[39,358,359,361,363],{"class":41,"line":144},[39,360,164],{"class":59},[39,362,167],{"class":113},[39,364,365],{"class":59},"(user);\n",[178,367,369,375,381,387],{"className":368},[181],[183,370,372,374],{"className":371},[186],[188,373],{"disabled":81,"type":190}," { key: 101, \"level2\": \"admin\" }",[183,376,378,380],{"className":377},[186],[188,379],{"disabled":81,"type":190}," { roleId: 101, level: \"admin\" }",[183,382,384,386],{"className":383},[186],[188,385],{"disabled":81,"type":190}," { roleId: 101, level2: \"admin\" }",[183,388,390,392],{"className":389},[186],[188,391],{"disabled":81,"type":190}," SyntaxError: template literals cannot be used as computed keys",[218,394,395,397,402],{},[221,396,223],{},[225,398,399,401],{},[228,400,230],{}," C — { roleId: 101, level2: \"admin\" }",[225,403,404,406,407,410,411,414,415,418,419,422,423,426,427,429,430,432,433,133],{},[228,405,238],{}," A computed property name ",[23,408,409],{},"[expr]"," evaluates ",[23,412,413],{},"expr"," at the moment the object literal is constructed and uses the resulting string as the key — so ",[23,416,417],{},"key"," (the variable) evaluates to ",[23,420,421],{},"\"roleId\"",", and the template literal evaluates to ",[23,424,425],{},"\"level2\"",". Option A confuses the identifier ",[23,428,417],{}," with its computed string value. Option B forgets ",[23,431,338],{}," gets interpolated. Option D is wrong: any valid expression, including a template literal, is allowed inside ",[23,434,435],{},"[]",[14,437,438,442,525,552],{"language":16},[18,439,441],{"id":440},"q3-what-does-this-log","Q3. What does this log?",[28,443,444],{"language":16},[31,445,447],{"className":33,"code":446,"language":16,"meta":35,"style":35},"const cache = {};\ncache[1] = \"first\";\ncache[\"1\"] = \"overwritten\";\n\nconsole.log(cache[1], Object.keys(cache).length);\n",[23,448,449,461,480,496,500],{"__ignoreMap":35},[39,450,451,453,456,458],{"class":41,"line":42},[39,452,46],{"class":45},[39,454,455],{"class":49}," cache",[39,457,53],{"class":45},[39,459,460],{"class":59}," {};\n",[39,462,463,466,469,472,475,478],{"class":41,"line":63},[39,464,465],{"class":59},"cache[",[39,467,468],{"class":49},"1",[39,470,471],{"class":59},"] ",[39,473,474],{"class":45},"=",[39,476,477],{"class":126}," \"first\"",[39,479,60],{"class":59},[39,481,482,484,487,489,491,494],{"class":41,"line":78},[39,483,465],{"class":59},[39,485,486],{"class":126},"\"1\"",[39,488,471],{"class":59},[39,490,474],{"class":45},[39,492,493],{"class":126}," \"overwritten\"",[39,495,60],{"class":59},[39,497,498],{"class":41,"line":85},[39,499,82],{"emptyLinePlaceholder":81},[39,501,502,504,506,509,511,514,516,519,522],{"class":41,"line":98},[39,503,164],{"class":59},[39,505,167],{"class":113},[39,507,508],{"class":59},"(cache[",[39,510,468],{"class":49},[39,512,513],{"class":59},"], Object.",[39,515,173],{"class":113},[39,517,518],{"class":59},"(cache).",[39,520,521],{"class":49},"length",[39,523,524],{"class":59},");\n",[178,526,528,534,540,546],{"className":527},[181],[183,529,531,533],{"className":530},[186],[188,532],{"disabled":81,"type":190}," \"overwritten\" 1",[183,535,537,539],{"className":536},[186],[188,538],{"disabled":81,"type":190}," \"first\" 2",[183,541,543,545],{"className":542},[186],[188,544],{"disabled":81,"type":190}," \"overwritten\" 2",[183,547,549,551],{"className":548},[186],[188,550],{"disabled":81,"type":190}," undefined 1",[218,553,554,556,561],{},[221,555,223],{},[225,557,558,560],{},[228,559,230],{}," A — \"overwritten\" 1",[225,562,563,191,565,568,569,571,572,574],{},[228,564,238],{},[228,566,567],{},"Debug:"," every non-Symbol property key on a plain object is coerced to a string before it's stored, so the numeric key ",[23,570,468],{}," and the string key ",[23,573,486],{}," address the exact same property. The second assignment overwrites the first rather than creating a second entry, leaving one key and the latest value. Options B and C wrongly assume numeric and string keys are distinct slots.",[14,576,577,581,673,700],{"language":16},[18,578,580],{"id":579},"q4-what-does-this-log","Q4. What does this log?",[28,582,583],{"language":16},[31,584,586],{"className":33,"code":585,"language":16,"meta":35,"style":35},"const config = Object.freeze({\n  name: \"app\",\n  limits: { maxUsers: 10 },\n});\n\nconfig.name = \"changed\";\nconfig.limits.maxUsers = 999;\n\nconsole.log(config.name, config.limits.maxUsers);\n",[23,587,588,606,616,627,632,636,648,660,664],{"__ignoreMap":35},[39,589,590,592,595,597,600,603],{"class":41,"line":42},[39,591,46],{"class":45},[39,593,594],{"class":49}," config",[39,596,53],{"class":45},[39,598,599],{"class":59}," Object.",[39,601,602],{"class":113},"freeze",[39,604,605],{"class":59},"({\n",[39,607,608,611,614],{"class":41,"line":63},[39,609,610],{"class":59},"  name: ",[39,612,613],{"class":126},"\"app\"",[39,615,327],{"class":59},[39,617,618,621,624],{"class":41,"line":78},[39,619,620],{"class":59},"  limits: { maxUsers: ",[39,622,623],{"class":49},"10",[39,625,626],{"class":59}," },\n",[39,628,629],{"class":41,"line":85},[39,630,631],{"class":59},"});\n",[39,633,634],{"class":41,"line":98},[39,635,82],{"emptyLinePlaceholder":81},[39,637,638,641,643,646],{"class":41,"line":104},[39,639,640],{"class":59},"config.name ",[39,642,474],{"class":45},[39,644,645],{"class":126}," \"changed\"",[39,647,60],{"class":59},[39,649,650,653,655,658],{"class":41,"line":110},[39,651,652],{"class":59},"config.limits.maxUsers ",[39,654,474],{"class":45},[39,656,657],{"class":49}," 999",[39,659,60],{"class":59},[39,661,662],{"class":41,"line":120},[39,663,82],{"emptyLinePlaceholder":81},[39,665,666,668,670],{"class":41,"line":144},[39,667,164],{"class":59},[39,669,167],{"class":113},[39,671,672],{"class":59},"(config.name, config.limits.maxUsers);\n",[178,674,676,682,688,694],{"className":675},[181],[183,677,679,681],{"className":678},[186],[188,680],{"disabled":81,"type":190}," \"changed\" 999",[183,683,685,687],{"className":684},[186],[188,686],{"disabled":81,"type":190}," \"app\" 10",[183,689,691,693],{"className":690},[186],[188,692],{"disabled":81,"type":190}," \"changed\" 10",[183,695,697,699],{"className":696},[186],[188,698],{"disabled":81,"type":190}," \"app\" 999",[218,701,702,704,709],{},[221,703,223],{},[225,705,706,708],{},[228,707,230],{}," D — \"app\" 999",[225,710,711,191,713,191,716,719,720,723,724,727,728,730,731,734,735,739,740,743],{},[228,712,238],{},[228,714,715],{},"Safety:",[23,717,718],{},"Object.freeze"," only locks the object's own top-level property slots — it makes ",[23,721,722],{},"name"," non-writable, so the reassignment is silently ignored (in non-strict mode) and ",[23,725,726],{},"config.name"," stays ",[23,729,613],{},". But ",[23,732,733],{},"limits"," itself is just a frozen ",[736,737,738],"em",{},"reference"," to another, unfrozen object; freezing never cascades into values it points to, so mutating ",[23,741,742],{},"config.limits.maxUsers"," succeeds normally. Deep-freezing requires recursively freezing every nested object yourself.",[14,745,746,750,842,876],{"language":16},[18,747,749],{"id":748},"q5-what-does-this-log","Q5. What does this log?",[28,751,752],{"language":16},[31,753,755],{"className":33,"code":754,"language":16,"meta":35,"style":35},"const original = { id: 1, meta: { tags: [\"a\"] } };\nconst copy = { ...original };\n\ncopy.id = 2;\ncopy.meta.tags.push(\"b\");\n\nconsole.log(original.id, original.meta.tags);\n",[23,756,757,780,798,802,813,829,833],{"__ignoreMap":35},[39,758,759,761,764,766,769,771,774,777],{"class":41,"line":42},[39,760,46],{"class":45},[39,762,763],{"class":49}," original",[39,765,53],{"class":45},[39,767,768],{"class":59}," { id: ",[39,770,468],{"class":49},[39,772,773],{"class":59},", meta: { tags: [",[39,775,776],{"class":126},"\"a\"",[39,778,779],{"class":59},"] } };\n",[39,781,782,784,787,789,792,795],{"class":41,"line":63},[39,783,46],{"class":45},[39,785,786],{"class":49}," copy",[39,788,53],{"class":45},[39,790,791],{"class":59}," { ",[39,793,794],{"class":45},"...",[39,796,797],{"class":59},"original };\n",[39,799,800],{"class":41,"line":78},[39,801,82],{"emptyLinePlaceholder":81},[39,803,804,807,809,811],{"class":41,"line":85},[39,805,806],{"class":59},"copy.id ",[39,808,474],{"class":45},[39,810,299],{"class":49},[39,812,60],{"class":59},[39,814,815,818,821,824,827],{"class":41,"line":98},[39,816,817],{"class":59},"copy.meta.tags.",[39,819,820],{"class":113},"push",[39,822,823],{"class":59},"(",[39,825,826],{"class":126},"\"b\"",[39,828,524],{"class":59},[39,830,831],{"class":41,"line":104},[39,832,82],{"emptyLinePlaceholder":81},[39,834,835,837,839],{"class":41,"line":110},[39,836,164],{"class":59},[39,838,167],{"class":113},[39,840,841],{"class":59},"(original.id, original.meta.tags);\n",[178,843,845,853,862,869],{"className":844},[181],[183,846,848,850,851],{"className":847},[186],[188,849],{"disabled":81,"type":190}," 2 ",[39,852,776],{},[183,854,856,858,859],{"className":855},[186],[188,857],{"disabled":81,"type":190}," 1 ",[39,860,861],{},"\"a\", \"b\"",[183,863,865,850,867],{"className":864},[186],[188,866],{"disabled":81,"type":190},[39,868,861],{},[183,870,872,858,874],{"className":871},[186],[188,873],{"disabled":81,"type":190},[39,875,776],{},[218,877,878,880,887],{},[221,879,223],{},[225,881,882,884,885],{},[228,883,230],{}," B — 1 ",[39,886,861],{},[225,888,889,191,891,893,894,897,898,901,902,905,906,909,910,912,913,916,917,250,920,923,924,927,928,931],{},[228,890,238],{},[228,892,567],{}," the spread operator ",[23,895,896],{},"{ ...original }"," performs a ",[736,899,900],{},"shallow"," copy — each top-level value is copied into a new slot, so reassigning ",[23,903,904],{},"copy.id"," never touches ",[23,907,908],{},"original.id"," (still ",[23,911,468],{},"). But ",[23,914,915],{},"meta"," holds an object reference, and the shallow copy duplicates the reference itself, not the object it points to — ",[23,918,919],{},"copy.meta",[23,921,922],{},"original.meta"," are the same array's owner, so pushing onto ",[23,925,926],{},"copy.meta.tags"," is visible through ",[23,929,930],{},"original.meta.tags"," too. This is the classic shallow-copy trap with nested reference types.",[14,933,934,938,1081,1123],{"language":16},[18,935,937],{"id":936},"q6-what-does-this-log","Q6. What does this log?",[28,939,940],{"language":16},[31,941,943],{"className":33,"code":942,"language":16,"meta":35,"style":35},"const obj = { visible: 1 };\nObject.defineProperty(obj, \"hidden\", {\n  value: 2,\n  enumerable: false,\n  writable: true,\n  configurable: true,\n});\n\nlet keys = [];\nfor (const k in obj) keys.push(k);\n\nconsole.log(keys, Object.keys(obj), obj.hidden);\n",[23,944,945,962,979,989,999,1009,1018,1022,1026,1039,1063,1067],{"__ignoreMap":35},[39,946,947,949,952,954,957,959],{"class":41,"line":42},[39,948,46],{"class":45},[39,950,951],{"class":49}," obj",[39,953,53],{"class":45},[39,955,956],{"class":59}," { visible: ",[39,958,468],{"class":49},[39,960,961],{"class":59}," };\n",[39,963,964,967,970,973,976],{"class":41,"line":63},[39,965,966],{"class":59},"Object.",[39,968,969],{"class":113},"defineProperty",[39,971,972],{"class":59},"(obj, ",[39,974,975],{"class":126},"\"hidden\"",[39,977,978],{"class":59},", {\n",[39,980,981,984,987],{"class":41,"line":78},[39,982,983],{"class":59},"  value: ",[39,985,986],{"class":49},"2",[39,988,327],{"class":59},[39,990,991,994,997],{"class":41,"line":85},[39,992,993],{"class":59},"  enumerable: ",[39,995,996],{"class":49},"false",[39,998,327],{"class":59},[39,1000,1001,1004,1007],{"class":41,"line":98},[39,1002,1003],{"class":59},"  writable: ",[39,1005,1006],{"class":49},"true",[39,1008,327],{"class":59},[39,1010,1011,1014,1016],{"class":41,"line":104},[39,1012,1013],{"class":59},"  configurable: ",[39,1015,1006],{"class":49},[39,1017,327],{"class":59},[39,1019,1020],{"class":41,"line":110},[39,1021,631],{"class":59},[39,1023,1024],{"class":41,"line":120},[39,1025,82],{"emptyLinePlaceholder":81},[39,1027,1028,1031,1034,1036],{"class":41,"line":144},[39,1029,1030],{"class":45},"let",[39,1032,1033],{"class":59}," keys ",[39,1035,474],{"class":45},[39,1037,1038],{"class":59}," [];\n",[39,1040,1041,1044,1047,1049,1052,1055,1058,1060],{"class":41,"line":150},[39,1042,1043],{"class":45},"for",[39,1045,1046],{"class":59}," (",[39,1048,46],{"class":45},[39,1050,1051],{"class":49}," k",[39,1053,1054],{"class":45}," in",[39,1056,1057],{"class":59}," obj) keys.",[39,1059,820],{"class":113},[39,1061,1062],{"class":59},"(k);\n",[39,1064,1065],{"class":41,"line":156},[39,1066,82],{"emptyLinePlaceholder":81},[39,1068,1069,1071,1073,1076,1078],{"class":41,"line":161},[39,1070,164],{"class":59},[39,1072,167],{"class":113},[39,1074,1075],{"class":59},"(keys, Object.",[39,1077,173],{"class":113},[39,1079,1080],{"class":59},"(obj), obj.hidden);\n",[178,1082,1084,1094,1104,1113],{"className":1083},[181],[183,1085,1087,191,1089,191,1092,299],{"className":1086},[186],[188,1088],{"disabled":81,"type":190},[39,1090,1091],{},"\"visible\", \"hidden\"",[39,1093,1091],{},[183,1095,1097,191,1099,191,1102,299],{"className":1096},[186],[188,1098],{"disabled":81,"type":190},[39,1100,1101],{},"\"visible\"",[39,1103,1091],{},[183,1105,1107,191,1109,191,1111,299],{"className":1106},[186],[188,1108],{"disabled":81,"type":190},[39,1110,1101],{},[39,1112,1101],{},[183,1114,1116,191,1118,191,1120,1122],{"className":1115},[186],[188,1117],{"disabled":81,"type":190},[39,1119,1091],{},[39,1121,1101],{}," undefined",[218,1124,1125,1127,1136],{},[221,1126,223],{},[225,1128,1129,1131,1132,191,1134,299],{},[228,1130,230],{}," C — ",[39,1133,1101],{},[39,1135,1101],{},[225,1137,1138,191,1140,1143,1144,1147,1148,1151,1152,1155,1156,1155,1158,1161,1162,1165,1166,1169,1170,1173,1174,1177,1178,1180,1181,250,1183,1185],{},[228,1139,238],{},[23,1141,1142],{},"enumerable: false"," hides ",[23,1145,1146],{},"hidden"," from anything that iterates ",[736,1149,1150],{},"enumerable"," properties — ",[23,1153,1154],{},"for...in",", ",[23,1157,246],{},[23,1159,1160],{},"Object.values","\u002F",[23,1163,1164],{},"entries",", and ",[23,1167,1168],{},"JSON.stringify"," all skip it identically. The property still fully exists though: it's directly readable and (since ",[23,1171,1172],{},"writable: true",") writable via ",[23,1175,1176],{},"obj.hidden",", which still returns ",[23,1179,986],{},". Option D wrongly assumes non-enumerable also means inaccessible; A and the mixed variants wrongly assume ",[23,1182,1154],{},[23,1184,246],{}," diverge here — for an own property, both honor the same enumerable flag the same way.",[14,1187,1188,1192,1328,1355],{"language":16},[18,1189,1191],{"id":1190},"q7-what-does-this-log","Q7. What does this log?",[28,1193,1194],{"language":16},[31,1195,1197],{"className":33,"code":1196,"language":16,"meta":35,"style":35},"function Base() {}\nBase.prototype.role = \"guest\";\n\nconst user = Object.create(Base.prototype);\nuser.name = \"Ana\";\n\nconsole.log(\n  \"role\" in user,\n  user.hasOwnProperty(\"role\"),\n  Object.hasOwn(user, \"role\")\n);\n",[23,1198,1199,1210,1230,1234,1257,1269,1273,1282,1292,1308,1324],{"__ignoreMap":35},[39,1200,1201,1204,1207],{"class":41,"line":42},[39,1202,1203],{"class":45},"function",[39,1205,1206],{"class":113}," Base",[39,1208,1209],{"class":59},"() {}\n",[39,1211,1212,1215,1217,1220,1223,1225,1228],{"class":41,"line":63},[39,1213,1214],{"class":49},"Base",[39,1216,133],{"class":59},[39,1218,1219],{"class":49},"prototype",[39,1221,1222],{"class":59},".role ",[39,1224,474],{"class":45},[39,1226,1227],{"class":126}," \"guest\"",[39,1229,60],{"class":59},[39,1231,1232],{"class":41,"line":78},[39,1233,82],{"emptyLinePlaceholder":81},[39,1235,1236,1238,1240,1242,1244,1247,1249,1251,1253,1255],{"class":41,"line":85},[39,1237,46],{"class":45},[39,1239,312],{"class":49},[39,1241,53],{"class":45},[39,1243,599],{"class":59},[39,1245,1246],{"class":113},"create",[39,1248,823],{"class":59},[39,1250,1214],{"class":49},[39,1252,133],{"class":59},[39,1254,1219],{"class":49},[39,1256,524],{"class":59},[39,1258,1259,1262,1264,1267],{"class":41,"line":98},[39,1260,1261],{"class":59},"user.name ",[39,1263,474],{"class":45},[39,1265,1266],{"class":126}," \"Ana\"",[39,1268,60],{"class":59},[39,1270,1271],{"class":41,"line":104},[39,1272,82],{"emptyLinePlaceholder":81},[39,1274,1275,1277,1279],{"class":41,"line":110},[39,1276,164],{"class":59},[39,1278,167],{"class":113},[39,1280,1281],{"class":59},"(\n",[39,1283,1284,1287,1289],{"class":41,"line":120},[39,1285,1286],{"class":126},"  \"role\"",[39,1288,1054],{"class":45},[39,1290,1291],{"class":59}," user,\n",[39,1293,1294,1297,1300,1302,1305],{"class":41,"line":144},[39,1295,1296],{"class":59},"  user.",[39,1298,1299],{"class":113},"hasOwnProperty",[39,1301,823],{"class":59},[39,1303,1304],{"class":126},"\"role\"",[39,1306,1307],{"class":59},"),\n",[39,1309,1310,1313,1316,1319,1321],{"class":41,"line":150},[39,1311,1312],{"class":59},"  Object.",[39,1314,1315],{"class":113},"hasOwn",[39,1317,1318],{"class":59},"(user, ",[39,1320,1304],{"class":126},[39,1322,1323],{"class":59},")\n",[39,1325,1326],{"class":41,"line":156},[39,1327,524],{"class":59},[178,1329,1331,1337,1343,1349],{"className":1330},[181],[183,1332,1334,1336],{"className":1333},[186],[188,1335],{"disabled":81,"type":190}," true false false",[183,1338,1340,1342],{"className":1339},[186],[188,1341],{"disabled":81,"type":190}," true true true",[183,1344,1346,1348],{"className":1345},[186],[188,1347],{"disabled":81,"type":190}," false false false",[183,1350,1352,1354],{"className":1351},[186],[188,1353],{"disabled":81,"type":190}," true false true",[218,1356,1357,1359,1364],{},[221,1358,223],{},[225,1360,1361,1363],{},[228,1362,230],{}," A — true false false",[225,1365,1366,1368,1369,1372,1373,1376,1377,1380,1381,1383,1384,1387,1388,1391,1392,1395,1396,250,1398,1401,1402,1404,1405,1408,1409,1412,1413,1416],{},[228,1367,238],{}," The ",[23,1370,1371],{},"in"," operator walks the ",[736,1374,1375],{},"entire"," prototype chain, so ",[23,1378,1379],{},"\"role\" in user"," is ",[23,1382,1006],{}," because ",[23,1385,1386],{},"role"," is inherited from ",[23,1389,1390],{},"Base.prototype",", even though ",[23,1393,1394],{},"user"," doesn't own it. ",[23,1397,1299],{},[23,1399,1400],{},"Object.hasOwn"," both check only the object's own properties, so both correctly return ",[23,1403,996],{}," for an inherited property. ",[23,1406,1407],{},"Object.hasOwn(obj, key)"," is the modern (ES2022) replacement for ",[23,1410,1411],{},".hasOwnProperty()"," — it works even on objects with no prototype, where ",[23,1414,1415],{},".hasOwnProperty"," wouldn't exist to call.",[14,1418,1419,1423,1528,1569],{"language":16},[18,1420,1422],{"id":1421},"q8-what-does-this-log","Q8. What does this log?",[28,1424,1425],{"language":16},[31,1426,1428],{"className":33,"code":1427,"language":16,"meta":35,"style":35},"const defaults = { theme: \"dark\" };\nconst settings = Object.create(defaults);\nsettings.fontSize = 14;\n\nconst seen = [];\nfor (const key in settings) seen.push(key);\n\nconsole.log(seen, Object.keys(settings));\n",[23,1429,1430,1447,1463,1475,1479,1490,1510,1514],{"__ignoreMap":35},[39,1431,1432,1434,1437,1439,1442,1445],{"class":41,"line":42},[39,1433,46],{"class":45},[39,1435,1436],{"class":49}," defaults",[39,1438,53],{"class":45},[39,1440,1441],{"class":59}," { theme: ",[39,1443,1444],{"class":126},"\"dark\"",[39,1446,961],{"class":59},[39,1448,1449,1451,1454,1456,1458,1460],{"class":41,"line":63},[39,1450,46],{"class":45},[39,1452,1453],{"class":49}," settings",[39,1455,53],{"class":45},[39,1457,599],{"class":59},[39,1459,1246],{"class":113},[39,1461,1462],{"class":59},"(defaults);\n",[39,1464,1465,1468,1470,1473],{"class":41,"line":78},[39,1466,1467],{"class":59},"settings.fontSize ",[39,1469,474],{"class":45},[39,1471,1472],{"class":49}," 14",[39,1474,60],{"class":59},[39,1476,1477],{"class":41,"line":85},[39,1478,82],{"emptyLinePlaceholder":81},[39,1480,1481,1483,1486,1488],{"class":41,"line":98},[39,1482,46],{"class":45},[39,1484,1485],{"class":49}," seen",[39,1487,53],{"class":45},[39,1489,1038],{"class":59},[39,1491,1492,1494,1496,1498,1500,1502,1505,1507],{"class":41,"line":104},[39,1493,1043],{"class":45},[39,1495,1046],{"class":59},[39,1497,46],{"class":45},[39,1499,274],{"class":49},[39,1501,1054],{"class":45},[39,1503,1504],{"class":59}," settings) seen.",[39,1506,820],{"class":113},[39,1508,1509],{"class":59},"(key);\n",[39,1511,1512],{"class":41,"line":110},[39,1513,82],{"emptyLinePlaceholder":81},[39,1515,1516,1518,1520,1523,1525],{"class":41,"line":120},[39,1517,164],{"class":59},[39,1519,167],{"class":113},[39,1521,1522],{"class":59},"(seen, Object.",[39,1524,173],{"class":113},[39,1526,1527],{"class":59},"(settings));\n",[178,1529,1531,1541,1551,1560],{"className":1530},[181],[183,1532,1534,191,1536,191,1539],{"className":1533},[186],[188,1535],{"disabled":81,"type":190},[39,1537,1538],{},"\"fontSize\"",[39,1540,1538],{},[183,1542,1544,191,1546,191,1549],{"className":1543},[186],[188,1545],{"disabled":81,"type":190},[39,1547,1548],{},"\"theme\", \"fontSize\"",[39,1550,1548],{},[183,1552,1554,191,1556,191,1558],{"className":1553},[186],[188,1555],{"disabled":81,"type":190},[39,1557,1538],{},[39,1559,1548],{},[183,1561,1563,191,1565,191,1567],{"className":1562},[186],[188,1564],{"disabled":81,"type":190},[39,1566,1548],{},[39,1568,1538],{},[218,1570,1571,1573,1582],{},[221,1572,223],{},[225,1574,1575,1577,1578,191,1580],{},[228,1576,230],{}," D — ",[39,1579,1548],{},[39,1581,1538],{},[225,1583,1584,191,1586,191,1588,1590,1591,1594,1595,1598,1599,1602,1603,1606,1607,1610,1611,1613,1614,1616,1617,1161,1620,1623,1624,1627,1628,1631,1632,1161,1634,1636,1637,1639],{},[228,1585,238],{},[228,1587,567],{},[23,1589,1154],{}," walks the prototype chain and includes any ",[736,1592,1593],{},"inherited"," enumerable property, so it picks up ",[23,1596,1597],{},"theme"," from ",[23,1600,1601],{},"defaults"," in addition to ",[23,1604,1605],{},"settings","' own ",[23,1608,1609],{},"fontSize"," — this is the classic footgun that makes ",[23,1612,1154],{}," risky on objects with a non-trivial prototype. ",[23,1615,246],{}," (and ",[23,1618,1619],{},"Object.entries",[23,1621,1622],{},"for...of Object.entries(...)",") only ever return an object's ",[736,1625,1626],{},"own"," enumerable properties, giving the safer, predictable ",[23,1629,1630],{},"[\"fontSize\"]",". Prefer ",[23,1633,246],{},[23,1635,1164],{}," over ",[23,1638,1154],{}," for plain data iteration.",[14,1641,1642,1646,1720,1781],{"language":16},[18,1643,1645],{"id":1644},"q9-given-this-code-what-actually-happens-when-it-runs","Q9. Given this code, what actually happens when it runs?",[28,1647,1648],{"language":16},[31,1649,1651],{"className":33,"code":1650,"language":16,"meta":35,"style":35},"const response = { data: null };\n\nconst a = response.data?.user?.name;\nconsole.log(a);\n\nconst b = response.data.user?.name;\nconsole.log(b);\n",[23,1652,1653,1670,1674,1686,1695,1699,1711],{"__ignoreMap":35},[39,1654,1655,1657,1660,1662,1665,1668],{"class":41,"line":42},[39,1656,46],{"class":45},[39,1658,1659],{"class":49}," response",[39,1661,53],{"class":45},[39,1663,1664],{"class":59}," { data: ",[39,1666,1667],{"class":49},"null",[39,1669,961],{"class":59},[39,1671,1672],{"class":41,"line":63},[39,1673,82],{"emptyLinePlaceholder":81},[39,1675,1676,1678,1681,1683],{"class":41,"line":78},[39,1677,46],{"class":45},[39,1679,1680],{"class":49}," a",[39,1682,53],{"class":45},[39,1684,1685],{"class":59}," response.data?.user?.name;\n",[39,1687,1688,1690,1692],{"class":41,"line":85},[39,1689,164],{"class":59},[39,1691,167],{"class":113},[39,1693,1694],{"class":59},"(a);\n",[39,1696,1697],{"class":41,"line":98},[39,1698,82],{"emptyLinePlaceholder":81},[39,1700,1701,1703,1706,1708],{"class":41,"line":104},[39,1702,46],{"class":45},[39,1704,1705],{"class":49}," b",[39,1707,53],{"class":45},[39,1709,1710],{"class":59}," response.data.user?.name;\n",[39,1712,1713,1715,1717],{"class":41,"line":110},[39,1714,164],{"class":59},[39,1716,167],{"class":113},[39,1718,1719],{"class":59},"(b);\n",[178,1721,1723,1739,1757,1770],{"className":1722},[181],[183,1724,1726,1728,1729,250,1732,1735,1736],{"className":1725},[186],[188,1727],{"disabled":81,"type":190}," Both lines log fine; ",[23,1730,1731],{},"a",[23,1733,1734],{},"b"," are both ",[23,1737,1738],{},"undefined",[183,1740,1742,191,1744,1746,1747,1749,1750,1752,1753,1756],{"className":1741},[186],[188,1743],{"disabled":81,"type":190},[23,1745,1731],{}," logs ",[23,1748,1738],{},"; the line defining ",[23,1751,1734],{}," throws a ",[23,1754,1755],{},"TypeError"," before it can log",[183,1758,1760,1762,1763,1383,1765,1380,1768],{"className":1759},[186],[188,1761],{"disabled":81,"type":190}," Both lines throw a ",[23,1764,1755],{},[23,1766,1767],{},"response.data",[23,1769,1667],{},[183,1771,1773,191,1775,1777,1778],{"className":1772},[186],[188,1774],{"disabled":81,"type":190},[23,1776,1731],{}," throws first, because optional chaining requires every link in a chain to use ",[23,1779,1780],{},"?.",[218,1782,1783,1785,1797],{},[221,1784,223],{},[225,1786,1787,231,1789,1746,1791,1749,1793,1752,1795,1756],{},[228,1788,230],{},[23,1790,1731],{},[23,1792,1738],{},[23,1794,1734],{},[23,1796,1755],{},[225,1798,1799,191,1801,191,1803,1805,1806,1161,1808,1810,1811,1813,1814,1817,1818,250,1820,1822,1823,1826,1827,1829,1830,1833,1834,1837,1838,1840,1841,1844,1845,1847],{},[228,1800,238],{},[228,1802,715],{},[23,1804,1780],{}," short-circuits the moment it hits a ",[23,1807,1667],{},[23,1809,1738],{}," reference and returns ",[23,1812,1738],{}," immediately, without evaluating the rest of the chain — so ",[23,1815,1816],{},"response.data?.user?.name"," safely yields ",[23,1819,1738],{},[23,1821,1731],{}," logs fine. ",[23,1824,1825],{},"response.data.user"," has no ",[23,1828,1780],{}," after ",[23,1831,1832],{},"data",", so it accesses ",[23,1835,1836],{},".user"," directly on ",[23,1839,1667],{},", which throws ",[23,1842,1843],{},"TypeError: Cannot read properties of null (reading 'user')"," before ",[23,1846,1734],{}," is ever assigned. Optional chaining protects only the specific link it's placed on, not the whole expression.",[14,1849,1850,1854,1979,2006],{"language":16},[18,1851,1853],{"id":1852},"q10-what-does-this-log","Q10. What does this log?",[28,1855,1856],{"language":16},[31,1857,1859],{"className":33,"code":1858,"language":16,"meta":35,"style":35},"const settings = { retries: 0, label: \"\", timeout: null };\n\nconst retries = settings.retries || 3;\nconst retries2 = settings.retries ?? 3;\nconst label = settings.label || \"default\";\nconst label2 = settings.label ?? \"default\";\n\nconsole.log(retries, retries2, label, label2);\n",[23,1860,1861,1888,1892,1912,1930,1949,1966,1970],{"__ignoreMap":35},[39,1862,1863,1865,1867,1869,1872,1875,1878,1881,1884,1886],{"class":41,"line":42},[39,1864,46],{"class":45},[39,1866,1453],{"class":49},[39,1868,53],{"class":45},[39,1870,1871],{"class":59}," { retries: ",[39,1873,1874],{"class":49},"0",[39,1876,1877],{"class":59},", label: ",[39,1879,1880],{"class":126},"\"\"",[39,1882,1883],{"class":59},", timeout: ",[39,1885,1667],{"class":49},[39,1887,961],{"class":59},[39,1889,1890],{"class":41,"line":63},[39,1891,82],{"emptyLinePlaceholder":81},[39,1893,1894,1896,1899,1901,1904,1907,1910],{"class":41,"line":78},[39,1895,46],{"class":45},[39,1897,1898],{"class":49}," retries",[39,1900,53],{"class":45},[39,1902,1903],{"class":59}," settings.retries ",[39,1905,1906],{"class":45},"||",[39,1908,1909],{"class":49}," 3",[39,1911,60],{"class":59},[39,1913,1914,1916,1919,1921,1923,1926,1928],{"class":41,"line":85},[39,1915,46],{"class":45},[39,1917,1918],{"class":49}," retries2",[39,1920,53],{"class":45},[39,1922,1903],{"class":59},[39,1924,1925],{"class":45},"??",[39,1927,1909],{"class":49},[39,1929,60],{"class":59},[39,1931,1932,1934,1937,1939,1942,1944,1947],{"class":41,"line":98},[39,1933,46],{"class":45},[39,1935,1936],{"class":49}," label",[39,1938,53],{"class":45},[39,1940,1941],{"class":59}," settings.label ",[39,1943,1906],{"class":45},[39,1945,1946],{"class":126}," \"default\"",[39,1948,60],{"class":59},[39,1950,1951,1953,1956,1958,1960,1962,1964],{"class":41,"line":104},[39,1952,46],{"class":45},[39,1954,1955],{"class":49}," label2",[39,1957,53],{"class":45},[39,1959,1941],{"class":59},[39,1961,1925],{"class":45},[39,1963,1946],{"class":126},[39,1965,60],{"class":59},[39,1967,1968],{"class":41,"line":110},[39,1969,82],{"emptyLinePlaceholder":81},[39,1971,1972,1974,1976],{"class":41,"line":120},[39,1973,164],{"class":59},[39,1975,167],{"class":113},[39,1977,1978],{"class":59},"(retries, retries2, label, label2);\n",[178,1980,1982,1988,1994,2000],{"className":1981},[181],[183,1983,1985,1987],{"className":1984},[186],[188,1986],{"disabled":81,"type":190}," 0 0 \"\" \"\"",[183,1989,1991,1993],{"className":1990},[186],[188,1992],{"disabled":81,"type":190}," 3 3 \"default\" \"default\"",[183,1995,1997,1999],{"className":1996},[186],[188,1998],{"disabled":81,"type":190}," 3 0 \"default\" \"\"",[183,2001,2003,2005],{"className":2002},[186],[188,2004],{"disabled":81,"type":190}," 0 3 \"\" \"default\"",[218,2007,2008,2010,2015],{},[221,2009,223],{},[225,2011,2012,2014],{},[228,2013,230],{}," C — 3 0 \"default\" \"\"",[225,2016,2017,191,2019,191,2021,2023,2024,2027,2028,1155,2030,1155,2032,1155,2034,1155,2037,1155,2039,2041,2042,2044,2045,2047,2048,2050,2051,2053,2054,2057,2058,250,2060,2057,2063,2065,2066,2068],{},[228,2018,238],{},[228,2020,567],{},[23,2022,1906],{}," falls back to its right-hand side on ",[736,2025,2026],{},"any"," falsy value — ",[23,2029,1874],{},[23,2031,1880],{},[23,2033,996],{},[23,2035,2036],{},"NaN",[23,2038,1667],{},[23,2040,1738],{}," — so both the legitimate ",[23,2043,1874],{}," retry count and the legitimate empty-string label get incorrectly overridden. ",[23,2046,1925],{}," only falls back on ",[23,2049,1667],{}," or ",[23,2052,1738],{},", so ",[23,2055,2056],{},"retries2"," correctly stays ",[23,2059,1874],{},[23,2061,2062],{},"label2",[23,2064,1880],{},". This is why ",[23,2067,1925],{}," is the safer default operator for fields (counts, flags, strings) that can hold a meaningful falsy value.",[14,2070,2071,2079,2162,2227],{"language":16},[18,2072,2074,2075,2078],{"id":2073},"q11-what-is-logged-and-what-happens-when-delete-total-runs-afterward-in-non-strict-mode","Q11. What is logged, and what happens when ",[23,2076,2077],{},"delete total;"," runs afterward in non-strict mode?",[28,2080,2081],{"language":16},[31,2082,2084],{"className":33,"code":2083,"language":16,"meta":35,"style":35},"const state = { count: 5 };\nconst result = delete state.count;\nconsole.log(result, state);\n\nlet total = 10;\ndelete total;\nconsole.log(total);\n",[23,2085,2086,2103,2118,2127,2131,2145,2153],{"__ignoreMap":35},[39,2087,2088,2090,2093,2095,2098,2101],{"class":41,"line":42},[39,2089,46],{"class":45},[39,2091,2092],{"class":49}," state",[39,2094,53],{"class":45},[39,2096,2097],{"class":59}," { count: ",[39,2099,2100],{"class":49},"5",[39,2102,961],{"class":59},[39,2104,2105,2107,2110,2112,2115],{"class":41,"line":63},[39,2106,46],{"class":45},[39,2108,2109],{"class":49}," result",[39,2111,53],{"class":45},[39,2113,2114],{"class":45}," delete",[39,2116,2117],{"class":59}," state.count;\n",[39,2119,2120,2122,2124],{"class":41,"line":78},[39,2121,164],{"class":59},[39,2123,167],{"class":113},[39,2125,2126],{"class":59},"(result, state);\n",[39,2128,2129],{"class":41,"line":85},[39,2130,82],{"emptyLinePlaceholder":81},[39,2132,2133,2135,2138,2140,2143],{"class":41,"line":98},[39,2134,1030],{"class":45},[39,2136,2137],{"class":59}," total ",[39,2139,474],{"class":45},[39,2141,2142],{"class":49}," 10",[39,2144,60],{"class":59},[39,2146,2147,2150],{"class":41,"line":104},[39,2148,2149],{"class":45},"delete",[39,2151,2152],{"class":59}," total;\n",[39,2154,2155,2157,2159],{"class":41,"line":110},[39,2156,164],{"class":59},[39,2158,167],{"class":113},[39,2160,2161],{"class":59},"(total);\n",[178,2163,2165,2180,2196,2209],{"className":2164},[181],[183,2166,2168,191,2170,2173,2174,2176,2177,2179],{"className":2167},[186],[188,2169],{"disabled":81,"type":190},[23,2171,2172],{},"true { }"," then ",[23,2175,623],{}," — ",[23,2178,2149],{}," removes object properties but is a silent no-op on variable bindings",[183,2181,2183,191,2185,2173,2187,2176,2189,2191,2192,2195],{"className":2182},[186],[188,2184],{"disabled":81,"type":190},[23,2186,2172],{},[23,2188,1738],{},[23,2190,2149],{}," also removes the ",[23,2193,2194],{},"total"," variable itself",[183,2197,2199,191,2201,2173,2204,2176,2206,2208],{"className":2198},[186],[188,2200],{"disabled":81,"type":190},[23,2202,2203],{},"false { count: 5 }",[23,2205,623],{},[23,2207,2149],{}," can't remove a property declared with a value",[183,2210,2212,191,2214,2216,2217,1752,2219,1383,2222,2224,2225],{"className":2211},[186],[188,2213],{"disabled":81,"type":190},[23,2215,2172],{}," — the second ",[23,2218,2149],{},[23,2220,2221],{},"SyntaxError",[23,2223,2194],{}," was declared with ",[23,2226,1030],{},[218,2228,2229,2231,2242],{},[221,2230,223],{},[225,2232,2233,2235,2236,2173,2238,2176,2240,2179],{},[228,2234,230],{}," A — ",[23,2237,2172],{},[23,2239,623],{},[23,2241,2149],{},[225,2243,2244,191,2246,191,2248,2250,2251,2253,2254,2257,2258,2260,2261,2264,2265,2268,2269,2272,2273,2275,2276,1161,2279,1161,2281,2283,2284,2286,2287,2289,2290,2292,2293,2295],{},[228,2245,238],{},[228,2247,567],{},[23,2249,2149],{}," operates on object properties, not bindings — it removes the configurable own property and returns ",[23,2252,1006],{}," on success (state becomes ",[23,2255,2256],{},"{}","). Note ",[23,2259,46],{}," only prevents ",[736,2262,2263],{},"reassigning"," the ",[23,2266,2267],{},"state"," binding, it doesn't stop mutating or deleting its properties. ",[23,2270,2271],{},"delete total"," targets a variable, not a property; ",[23,2274,2149],{}," has no power over ",[23,2277,2278],{},"var",[23,2280,1030],{},[23,2282,46],{}," bindings, so in non-strict mode it's simply a no-op that returns ",[23,2285,996],{},", leaving ",[23,2288,2194],{}," unchanged at ",[23,2291,623],{}," (in strict mode, deleting a bare identifier is a ",[23,2294,2221],{}," at parse time, but that's a different scenario than this sloppy-mode script).",[14,2297,2298,2302,2396,2421],{"language":16},[18,2299,2301],{"id":2300},"q12-what-does-this-log","Q12. What does this log?",[28,2303,2304],{"language":16},[31,2305,2307],{"className":33,"code":2306,"language":16,"meta":35,"style":35},"const a = { id: 1 };\nconst b = { id: 1 };\nconst c = a;\n\nconsole.log(a === b, a === c, JSON.stringify(a) === JSON.stringify(b));\n",[23,2308,2309,2323,2337,2349,2353],{"__ignoreMap":35},[39,2310,2311,2313,2315,2317,2319,2321],{"class":41,"line":42},[39,2312,46],{"class":45},[39,2314,1680],{"class":49},[39,2316,53],{"class":45},[39,2318,768],{"class":59},[39,2320,468],{"class":49},[39,2322,961],{"class":59},[39,2324,2325,2327,2329,2331,2333,2335],{"class":41,"line":63},[39,2326,46],{"class":45},[39,2328,1705],{"class":49},[39,2330,53],{"class":45},[39,2332,768],{"class":59},[39,2334,468],{"class":49},[39,2336,961],{"class":59},[39,2338,2339,2341,2344,2346],{"class":41,"line":78},[39,2340,46],{"class":45},[39,2342,2343],{"class":49}," c",[39,2345,53],{"class":45},[39,2347,2348],{"class":59}," a;\n",[39,2350,2351],{"class":41,"line":85},[39,2352,82],{"emptyLinePlaceholder":81},[39,2354,2355,2357,2359,2362,2365,2368,2370,2373,2376,2378,2381,2384,2386,2389,2391,2393],{"class":41,"line":98},[39,2356,164],{"class":59},[39,2358,167],{"class":113},[39,2360,2361],{"class":59},"(a ",[39,2363,2364],{"class":45},"===",[39,2366,2367],{"class":59}," b, a ",[39,2369,2364],{"class":45},[39,2371,2372],{"class":59}," c, ",[39,2374,2375],{"class":49},"JSON",[39,2377,133],{"class":59},[39,2379,2380],{"class":113},"stringify",[39,2382,2383],{"class":59},"(a) ",[39,2385,2364],{"class":45},[39,2387,2388],{"class":49}," JSON",[39,2390,133],{"class":59},[39,2392,2380],{"class":113},[39,2394,2395],{"class":59},"(b));\n",[178,2397,2399,2404,2409,2415],{"className":2398},[181],[183,2400,2402,1342],{"className":2401},[186],[188,2403],{"disabled":81,"type":190},[183,2405,2407,1354],{"className":2406},[186],[188,2408],{"disabled":81,"type":190},[183,2410,2412,2414],{"className":2411},[186],[188,2413],{"disabled":81,"type":190}," false false true",[183,2416,2418,2420],{"className":2417},[186],[188,2419],{"disabled":81,"type":190}," false true true",[218,2422,2423,2425,2430],{},[221,2424,223],{},[225,2426,2427,2429],{},[228,2428,230],{}," D — false true true",[225,2431,2432,191,2434,191,2437,2439,2440,2442,2443,250,2445,2447,2448,1380,2451,2453,2454,2457,2458,2460,2461,1380,2464,2466,2467,2469,2470,1165,2473,2476,2477,2479,2480,2482],{},[228,2433,238],{},[228,2435,2436],{},"Idiom:",[23,2438,2364],{}," compares object operands by ",[736,2441,738],{},", never by structural content — ",[23,2444,1731],{},[23,2446,1734],{}," are two distinct objects that merely look alike, so ",[23,2449,2450],{},"a === b",[23,2452,996],{}," even though every property matches. ",[23,2455,2456],{},"c"," was assigned the exact same reference as ",[23,2459,1731],{}," (no new object was created), so ",[23,2462,2463],{},"a === c",[23,2465,1006],{},". ",[23,2468,1168],{}," converts both objects to the identical string ",[23,2471,2472],{},"'{\"id\":1}'",[736,2474,2475],{},"that"," string comparison is ",[23,2478,1006],{}," — but that's comparing two strings, not testing object identity, and it breaks down for objects with functions, ",[23,2481,1738],{},", or differently-ordered keys with different serializers.",[14,2484,2485,2492,2580,2615],{"language":16},[18,2486,2488,2489,26],{"id":2487},"q13-what-does-objectkeysobj-log","Q13. What does ",[23,2490,2491],{},"Object.keys(obj)",[28,2493,2494],{"language":16},[31,2495,2497],{"className":33,"code":2496,"language":16,"meta":35,"style":35},"const obj = {};\nobj.b = 1;\nobj[2] = \"two\";\nobj.a = 3;\nobj[1] = \"one\";\n\nconsole.log(Object.keys(obj));\n",[23,2498,2499,2509,2521,2537,2548,2563,2567],{"__ignoreMap":35},[39,2500,2501,2503,2505,2507],{"class":41,"line":42},[39,2502,46],{"class":45},[39,2504,951],{"class":49},[39,2506,53],{"class":45},[39,2508,460],{"class":59},[39,2510,2511,2514,2516,2519],{"class":41,"line":63},[39,2512,2513],{"class":59},"obj.b ",[39,2515,474],{"class":45},[39,2517,2518],{"class":49}," 1",[39,2520,60],{"class":59},[39,2522,2523,2526,2528,2530,2532,2535],{"class":41,"line":78},[39,2524,2525],{"class":59},"obj[",[39,2527,986],{"class":49},[39,2529,471],{"class":59},[39,2531,474],{"class":45},[39,2533,2534],{"class":126}," \"two\"",[39,2536,60],{"class":59},[39,2538,2539,2542,2544,2546],{"class":41,"line":85},[39,2540,2541],{"class":59},"obj.a ",[39,2543,474],{"class":45},[39,2545,1909],{"class":49},[39,2547,60],{"class":59},[39,2549,2550,2552,2554,2556,2558,2561],{"class":41,"line":98},[39,2551,2525],{"class":59},[39,2553,468],{"class":49},[39,2555,471],{"class":59},[39,2557,474],{"class":45},[39,2559,2560],{"class":126}," \"one\"",[39,2562,60],{"class":59},[39,2564,2565],{"class":41,"line":104},[39,2566,82],{"emptyLinePlaceholder":81},[39,2568,2569,2571,2573,2575,2577],{"class":41,"line":110},[39,2570,164],{"class":59},[39,2572,167],{"class":113},[39,2574,170],{"class":59},[39,2576,173],{"class":113},[39,2578,2579],{"class":59},"(obj));\n",[178,2581,2583,2591,2599,2607],{"className":2582},[181],[183,2584,2586,191,2588],{"className":2585},[186],[188,2587],{"disabled":81,"type":190},[39,2589,2590],{},"\"b\", \"2\", \"a\", \"1\"",[183,2592,2594,191,2596],{"className":2593},[186],[188,2595],{"disabled":81,"type":190},[39,2597,2598],{},"\"1\", \"2\", \"b\", \"a\"",[183,2600,2602,191,2604],{"className":2601},[186],[188,2603],{"disabled":81,"type":190},[39,2605,2606],{},"\"1\", \"2\", \"a\", \"b\"",[183,2608,2610,191,2612],{"className":2609},[186],[188,2611],{"disabled":81,"type":190},[39,2613,2614],{},"\"2\", \"1\", \"b\", \"a\"",[218,2616,2617,2619,2625],{},[221,2618,223],{},[225,2620,2621,231,2623],{},[228,2622,230],{},[39,2624,2598],{},[225,2626,2627,191,2629,2631,2632,2635,2636,250,2638,2641,2642,1844,2644,1391,2646,2648,2649,250,2651,2653],{},[228,2628,238],{},[228,2630,567],{}," own-property key ordering follows a fixed spec rule, not insertion order alone: integer-index-like string keys come first, sorted in ",[736,2633,2634],{},"ascending numeric"," order regardless of when they were added, followed by all other string keys in insertion order, then Symbol keys last. Here ",[23,2637,486],{},[23,2639,2640],{},"\"2\""," are integer-like, so they're sorted numerically first (",[23,2643,468],{},[23,2645,986],{},[23,2647,986],{}," was inserted first), and only then come ",[23,2650,826],{},[23,2652,776],{}," in the order they were actually assigned.",[14,2655,2656,2663,2792,2819],{"language":16},[18,2657,2659,2660,26],{"id":2658},"q14-what-does-jsonstringifyaccount-log","Q14. What does ",[23,2661,2662],{},"JSON.stringify(account)",[28,2664,2665],{"language":16},[31,2666,2668],{"className":33,"code":2667,"language":16,"meta":35,"style":35},"const account = {\n  _balance: 100,\n  get balance() {\n    return `$${this._balance}`;\n  },\n  set balance(value) {\n    this._balance = value;\n  },\n};\n\naccount.balance = 250;\nconsole.log(JSON.stringify(account));\n",[23,2669,2670,2681,2691,2701,2718,2722,2738,2751,2755,2759,2763,2775],{"__ignoreMap":35},[39,2671,2672,2674,2677,2679],{"class":41,"line":42},[39,2673,46],{"class":45},[39,2675,2676],{"class":49}," account",[39,2678,53],{"class":45},[39,2680,95],{"class":59},[39,2682,2683,2686,2689],{"class":41,"line":63},[39,2684,2685],{"class":59},"  _balance: ",[39,2687,2688],{"class":49},"100",[39,2690,327],{"class":59},[39,2692,2693,2696,2699],{"class":41,"line":78},[39,2694,2695],{"class":45},"  get",[39,2697,2698],{"class":113}," balance",[39,2700,117],{"class":59},[39,2702,2703,2705,2707,2709,2711,2714,2716],{"class":41,"line":85},[39,2704,123],{"class":45},[39,2706,127],{"class":126},[39,2708,130],{"class":49},[39,2710,133],{"class":126},[39,2712,2713],{"class":59},"_balance",[39,2715,139],{"class":126},[39,2717,60],{"class":59},[39,2719,2720],{"class":41,"line":98},[39,2721,147],{"class":59},[39,2723,2724,2727,2729,2731,2735],{"class":41,"line":104},[39,2725,2726],{"class":45},"  set",[39,2728,2698],{"class":113},[39,2730,823],{"class":59},[39,2732,2734],{"class":2733},"sCrzJ","value",[39,2736,2737],{"class":59},") {\n",[39,2739,2740,2743,2746,2748],{"class":41,"line":110},[39,2741,2742],{"class":49},"    this",[39,2744,2745],{"class":59},"._balance ",[39,2747,474],{"class":45},[39,2749,2750],{"class":59}," value;\n",[39,2752,2753],{"class":41,"line":120},[39,2754,147],{"class":59},[39,2756,2757],{"class":41,"line":144},[39,2758,153],{"class":59},[39,2760,2761],{"class":41,"line":150},[39,2762,82],{"emptyLinePlaceholder":81},[39,2764,2765,2768,2770,2773],{"class":41,"line":156},[39,2766,2767],{"class":59},"account.balance ",[39,2769,474],{"class":45},[39,2771,2772],{"class":49}," 250",[39,2774,60],{"class":59},[39,2776,2777,2779,2781,2783,2785,2787,2789],{"class":41,"line":161},[39,2778,164],{"class":59},[39,2780,167],{"class":113},[39,2782,823],{"class":59},[39,2784,2375],{"class":49},[39,2786,133],{"class":59},[39,2788,2380],{"class":113},[39,2790,2791],{"class":59},"(account));\n",[178,2793,2795,2801,2807,2813],{"className":2794},[181],[183,2796,2798,2800],{"className":2797},[186],[188,2799],{"disabled":81,"type":190}," {\"_balance\":100,\"balance\":\"$100\"}",[183,2802,2804,2806],{"className":2803},[186],[188,2805],{"disabled":81,"type":190}," {\"balance\":\"$250\"}",[183,2808,2810,2812],{"className":2809},[186],[188,2811],{"disabled":81,"type":190}," {\"_balance\":250,\"balance\":\"$250\"}",[183,2814,2816,2818],{"className":2815},[186],[188,2817],{"disabled":81,"type":190}," {\"_balance\":250}",[218,2820,2821,2823,2828],{},[221,2822,223],{},[225,2824,2825,2827],{},[228,2826,230],{}," C — {\"_balance\":250,\"balance\":\"$250\"}",[225,2829,2830,191,2832,2834,2835,2838,2839,2466,2841,2843,2844,2847,2848,1046,2850,2853,2854,2857,2858,2861],{},[228,2831,238],{},[228,2833,2436],{}," assigning ",[23,2836,2837],{},"account.balance = 250"," invokes the setter, which stores the raw number into ",[23,2840,2713],{},[23,2842,1168],{}," serializes every own enumerable property — including accessor (getter) properties — and for a getter it ",[736,2845,2846],{},"calls"," it and embeds the returned value, so both the updated ",[23,2849,2713],{},[23,2851,2852],{},"250",") and the computed ",[23,2855,2856],{},"balance"," getter output (",[23,2859,2860],{},"\"$250\"",") end up in the JSON. It neither skips getters (ruling out B and D) nor uses a stale pre-assignment snapshot (ruling out A).",[14,2863,2864,2868,2990,3083],{"language":16},[18,2865,2867],{"id":2866},"q15-which-statement-correctly-describes-what-happens","Q15. Which statement correctly describes what happens?",[28,2869,2870],{"language":16},[31,2871,2873],{"className":33,"code":2872,"language":16,"meta":35,"style":35},"const original = {\n  createdAt: new Date(\"2024-01-01\"),\n  greet: function () {},\n  count: undefined,\n  tag: Symbol(\"x\"),\n};\n\nconst viaJson = JSON.parse(JSON.stringify(original));\nconst viaClone = structuredClone(original);\n",[23,2874,2875,2885,2903,2916,2925,2940,2944,2948,2975],{"__ignoreMap":35},[39,2876,2877,2879,2881,2883],{"class":41,"line":42},[39,2878,46],{"class":45},[39,2880,763],{"class":49},[39,2882,53],{"class":45},[39,2884,95],{"class":59},[39,2886,2887,2890,2893,2896,2898,2901],{"class":41,"line":63},[39,2888,2889],{"class":59},"  createdAt: ",[39,2891,2892],{"class":45},"new",[39,2894,2895],{"class":113}," Date",[39,2897,823],{"class":59},[39,2899,2900],{"class":126},"\"2024-01-01\"",[39,2902,1307],{"class":59},[39,2904,2905,2908,2911,2913],{"class":41,"line":78},[39,2906,2907],{"class":113},"  greet",[39,2909,2910],{"class":59},": ",[39,2912,1203],{"class":45},[39,2914,2915],{"class":59}," () {},\n",[39,2917,2918,2921,2923],{"class":41,"line":85},[39,2919,2920],{"class":59},"  count: ",[39,2922,1738],{"class":49},[39,2924,327],{"class":59},[39,2926,2927,2930,2933,2935,2938],{"class":41,"line":98},[39,2928,2929],{"class":59},"  tag: ",[39,2931,2932],{"class":113},"Symbol",[39,2934,823],{"class":59},[39,2936,2937],{"class":126},"\"x\"",[39,2939,1307],{"class":59},[39,2941,2942],{"class":41,"line":104},[39,2943,153],{"class":59},[39,2945,2946],{"class":41,"line":110},[39,2947,82],{"emptyLinePlaceholder":81},[39,2949,2950,2952,2955,2957,2959,2961,2964,2966,2968,2970,2972],{"class":41,"line":120},[39,2951,46],{"class":45},[39,2953,2954],{"class":49}," viaJson",[39,2956,53],{"class":45},[39,2958,2388],{"class":49},[39,2960,133],{"class":59},[39,2962,2963],{"class":113},"parse",[39,2965,823],{"class":59},[39,2967,2375],{"class":49},[39,2969,133],{"class":59},[39,2971,2380],{"class":113},[39,2973,2974],{"class":59},"(original));\n",[39,2976,2977,2979,2982,2984,2987],{"class":41,"line":144},[39,2978,46],{"class":45},[39,2980,2981],{"class":49}," viaClone",[39,2983,53],{"class":45},[39,2985,2986],{"class":113}," structuredClone",[39,2988,2989],{"class":59},"(original);\n",[178,2991,2993,3016,3043,3066],{"className":2992},[181],[183,2994,2996,191,2998,3001,3002,1155,3005,1165,3008,3011,3012,3015],{"className":2995},[186],[188,2997],{"disabled":81,"type":190},[23,2999,3000],{},"viaJson.createdAt"," becomes a string, and ",[23,3003,3004],{},"greet",[23,3006,3007],{},"count",[23,3009,3010],{},"tag"," are dropped entirely; ",[23,3013,3014],{},"structuredClone"," throws because it can't clone a function",[183,3017,3019,191,3021,3023,3024,3027,3028,3030,3031,3033,3034,3037,3038,3040,3041],{"className":3018},[186],[188,3020],{"disabled":81,"type":190},[23,3022,3000],{}," stays a ",[23,3025,3026],{},"Date"," but ",[23,3029,3004],{}," is dropped; ",[23,3032,3014],{}," also preserves ",[23,3035,3036],{},"createdAt"," as a ",[23,3039,3026],{}," and drops ",[23,3042,3004],{},[183,3044,3046,3048,3049,250,3052,3055,3056,3037,3058,1155,3060,3062,3063,3065],{"className":3045},[186],[188,3047],{"disabled":81,"type":190}," Both ",[23,3050,3051],{},"viaJson",[23,3053,3054],{},"viaClone"," preserve ",[23,3057,3036],{},[23,3059,3026],{},[23,3061,3004],{}," as a function, and ",[23,3064,3010],{}," as a Symbol",[183,3067,3069,191,3071,1752,3073,1383,3075,3077,3078,3080,3081],{"className":3068},[186],[188,3070],{"disabled":81,"type":190},[23,3072,1168],{},[23,3074,1755],{},[23,3076,3026],{}," isn't valid JSON; ",[23,3079,3014],{}," succeeds and preserves everything, including ",[23,3082,3004],{},[218,3084,3085,3087,3101],{},[221,3086,223],{},[225,3088,3089,2235,3091,3001,3093,1155,3095,1165,3097,3011,3099,3015],{},[228,3090,230],{},[23,3092,3000],{},[23,3094,3004],{},[23,3096,3007],{},[23,3098,3010],{},[23,3100,3014],{},[225,3102,3103,191,3105,191,3107,3109,3110,3112,3113,3116,3117,3120,3121,3123,3124,3126,3127,3130,3131,3133,3134,3136,3137,1616,3139,1161,3142,3145,3146,3148,3149,3152],{},[228,3104,238],{},[228,3106,715],{},[23,3108,1168],{}," calls ",[23,3111,3026],{},"'s ",[23,3114,3115],{},"toJSON",", converting it to an ISO string, so the round-trip through ",[23,3118,3119],{},"JSON.parse"," leaves ",[23,3122,3036],{}," as a plain string, not a ",[23,3125,3026],{},". It also ",[736,3128,3129],{},"silently"," omits any property whose value is ",[23,3132,1738],{},", a function, or a Symbol — no error, they simply vanish from the output. ",[23,3135,3014],{}," uses the structured clone algorithm, which correctly deep-clones ",[23,3138,3026],{},[23,3140,3141],{},"Map",[23,3143,3144],{},"Set","\u002Ftyped arrays\u002Fcircular references) as real ",[23,3147,3026],{}," objects — but functions (and Symbols) are explicitly unsupported and cause it to throw a ",[23,3150,3151],{},"DataCloneError",", so it can't be used as a drop-in replacement on objects that hold methods.",[14,3154,3155,3159,3231,3276],{"language":16},[18,3156,3158],{"id":3157},"q16-what-does-this-log","Q16. What does this log?",[28,3160,3161],{"language":16},[31,3162,3164],{"className":33,"code":3163,"language":16,"meta":35,"style":35},"const dict = Object.create(null);\ndict.apple = 1;\n\nconsole.log(dict.toString);\nconsole.log(dict.hasOwnProperty);\nconsole.log(Object.keys(dict));\n",[23,3165,3166,3185,3196,3200,3209,3218],{"__ignoreMap":35},[39,3167,3168,3170,3173,3175,3177,3179,3181,3183],{"class":41,"line":42},[39,3169,46],{"class":45},[39,3171,3172],{"class":49}," dict",[39,3174,53],{"class":45},[39,3176,599],{"class":59},[39,3178,1246],{"class":113},[39,3180,823],{"class":59},[39,3182,1667],{"class":49},[39,3184,524],{"class":59},[39,3186,3187,3190,3192,3194],{"class":41,"line":63},[39,3188,3189],{"class":59},"dict.apple ",[39,3191,474],{"class":45},[39,3193,2518],{"class":49},[39,3195,60],{"class":59},[39,3197,3198],{"class":41,"line":78},[39,3199,82],{"emptyLinePlaceholder":81},[39,3201,3202,3204,3206],{"class":41,"line":85},[39,3203,164],{"class":59},[39,3205,167],{"class":113},[39,3207,3208],{"class":59},"(dict.toString);\n",[39,3210,3211,3213,3215],{"class":41,"line":98},[39,3212,164],{"class":59},[39,3214,167],{"class":113},[39,3216,3217],{"class":59},"(dict.hasOwnProperty);\n",[39,3219,3220,3222,3224,3226,3228],{"class":41,"line":104},[39,3221,164],{"class":59},[39,3223,167],{"class":113},[39,3225,170],{"class":59},[39,3227,173],{"class":113},[39,3229,3230],{"class":59},"(dict));\n",[178,3232,3234,3250,3258,3268],{"className":3233},[181],[183,3235,3237,3239,3240,3243,3244,191,3247],{"className":3236},[186],[188,3238],{"disabled":81,"type":190}," \"",[39,3241,3242],{},"object Object","\" ",[39,3245,3246],{},"Function: hasOwnProperty",[39,3248,3249],{},"\"apple\"",[183,3251,3253,3255,3256],{"className":3252},[186],[188,3254],{"disabled":81,"type":190}," TypeError TypeError ",[39,3257,3249],{},[183,3259,3261,3263,3264,191,3266],{"className":3260},[186],[188,3262],{"disabled":81,"type":190}," undefined ",[39,3265,3246],{},[39,3267,3249],{},[183,3269,3271,3273,3274],{"className":3270},[186],[188,3272],{"disabled":81,"type":190}," undefined undefined ",[39,3275,3249],{},[218,3277,3278,3280,3287],{},[221,3279,223],{},[225,3281,3282,3284,3285],{},[228,3283,230],{}," D — undefined undefined ",[39,3286,3249],{},[225,3288,3289,191,3291,191,3293,3296,3297,3300,3301,3304,3305,1155,3308,1155,3310,3313,3314,3316,3317,2050,3320,3323,3324,3327,3328,3331,3332,133],{},[228,3290,238],{},[228,3292,715],{},[23,3294,3295],{},"Object.create(null)"," builds an object with ",[736,3298,3299],{},"no"," prototype at all — not even ",[23,3302,3303],{},"Object.prototype"," — so it inherits none of the usual built-ins: ",[23,3306,3307],{},"toString",[23,3309,1299],{},[23,3311,3312],{},"valueOf",", etc. all simply don't exist on it, and accessing them returns ",[23,3315,1738],{}," rather than throwing. This makes it a good \"pure dictionary\" that can safely use any string key — even ",[23,3318,3319],{},"\"toString\"",[23,3321,3322],{},"\"__proto__\""," — without colliding with inherited methods or enabling prototype pollution, but callers must use ",[23,3325,3326],{},"Object.hasOwn(dict, key)"," instead of ",[23,3329,3330],{},"dict.hasOwnProperty(key)",", since the latter would throw ",[23,3333,3334],{},"TypeError: dict.hasOwnProperty is not a function",[14,3336,3337,3341,3432,3459],{"language":16},[18,3338,3340],{"id":3339},"q17-what-does-this-log","Q17. What does this log?",[28,3342,3343],{"language":16},[31,3344,3346],{"className":33,"code":3345,"language":16,"meta":35,"style":35},"const original = { user: { name: \"Kim\" }, count: 1 };\nconst { user, ...rest } = original;\n\nuser.name = \"Lee\";\nrest.count = 99;\n\nconsole.log(original.user.name, original.count);\n",[23,3347,3348,3369,3392,3396,3407,3419,3423],{"__ignoreMap":35},[39,3349,3350,3352,3354,3356,3359,3362,3365,3367],{"class":41,"line":42},[39,3351,46],{"class":45},[39,3353,763],{"class":49},[39,3355,53],{"class":45},[39,3357,3358],{"class":59}," { user: { name: ",[39,3360,3361],{"class":126},"\"Kim\"",[39,3363,3364],{"class":59}," }, count: ",[39,3366,468],{"class":49},[39,3368,961],{"class":59},[39,3370,3371,3373,3375,3377,3379,3381,3384,3387,3389],{"class":41,"line":63},[39,3372,46],{"class":45},[39,3374,791],{"class":59},[39,3376,1394],{"class":49},[39,3378,1155],{"class":59},[39,3380,794],{"class":45},[39,3382,3383],{"class":49},"rest",[39,3385,3386],{"class":59}," } ",[39,3388,474],{"class":45},[39,3390,3391],{"class":59}," original;\n",[39,3393,3394],{"class":41,"line":78},[39,3395,82],{"emptyLinePlaceholder":81},[39,3397,3398,3400,3402,3405],{"class":41,"line":85},[39,3399,1261],{"class":59},[39,3401,474],{"class":45},[39,3403,3404],{"class":126}," \"Lee\"",[39,3406,60],{"class":59},[39,3408,3409,3412,3414,3417],{"class":41,"line":98},[39,3410,3411],{"class":59},"rest.count ",[39,3413,474],{"class":45},[39,3415,3416],{"class":49}," 99",[39,3418,60],{"class":59},[39,3420,3421],{"class":41,"line":104},[39,3422,82],{"emptyLinePlaceholder":81},[39,3424,3425,3427,3429],{"class":41,"line":110},[39,3426,164],{"class":59},[39,3428,167],{"class":113},[39,3430,3431],{"class":59},"(original.user.name, original.count);\n",[178,3433,3435,3441,3447,3453],{"className":3434},[181],[183,3436,3438,3440],{"className":3437},[186],[188,3439],{"disabled":81,"type":190}," \"Kim\" 1",[183,3442,3444,3446],{"className":3443},[186],[188,3445],{"disabled":81,"type":190}," \"Lee\" 1",[183,3448,3450,3452],{"className":3449},[186],[188,3451],{"disabled":81,"type":190}," \"Lee\" 99",[183,3454,3456,3458],{"className":3455},[186],[188,3457],{"disabled":81,"type":190}," \"Kim\" 99",[218,3460,3461,3463,3468],{},[221,3462,223],{},[225,3464,3465,3467],{},[228,3466,230],{}," B — \"Lee\" 1",[225,3469,3470,191,3472,3474,3475,3477,3478,3481,3482,3484,3485,3488,3489,3492,3493,3496,3497,3500,3501,3504,3505,3508,3509,3511,3512,3515,3516,3519,3520,3522],{},[228,3471,238],{},[228,3473,567],{}," destructuring ",[23,3476,1394],{}," out of ",[23,3479,3480],{},"original"," binds ",[23,3483,1394],{}," to the ",[736,3486,3487],{},"same"," object ",[23,3490,3491],{},"original.user"," already points to — no copy is made for nested objects — so mutating ",[23,3494,3495],{},"user.name"," mutates the shared object, and ",[23,3498,3499],{},"original.user.name"," reads back as ",[23,3502,3503],{},"\"Lee\"",". The rest pattern ",[23,3506,3507],{},"...rest",", however, builds a brand-new object whose ",[23,3510,3007],{}," is a freshly copied primitive value, so writing ",[23,3513,3514],{},"rest.count = 99"," only touches the new object and leaves ",[23,3517,3518],{},"original.count"," at ",[23,3521,468],{},". The trap: primitives are safely copied by destructuring\u002Fspread, but nested object references are shared, not cloned.",[14,3524,3525,3529,3630,3665],{"language":16},[18,3526,3528],{"id":3527},"q18-what-does-this-log","Q18. What does this log?",[28,3530,3531],{"language":16},[31,3532,3534],{"className":33,"code":3533,"language":16,"meta":35,"style":35},"const id = Symbol(\"id\");\nconst user = {\n  name: \"Ana\",\n  [id]: 42,\n};\n\nconsole.log(Object.keys(user));\nconsole.log(JSON.stringify(user));\nconsole.log(user[id]);\n",[23,3535,3536,3555,3565,3574,3584,3588,3592,3605,3621],{"__ignoreMap":35},[39,3537,3538,3540,3543,3545,3548,3550,3553],{"class":41,"line":42},[39,3539,46],{"class":45},[39,3541,3542],{"class":49}," id",[39,3544,53],{"class":45},[39,3546,3547],{"class":113}," Symbol",[39,3549,823],{"class":59},[39,3551,3552],{"class":126},"\"id\"",[39,3554,524],{"class":59},[39,3556,3557,3559,3561,3563],{"class":41,"line":63},[39,3558,46],{"class":45},[39,3560,312],{"class":49},[39,3562,53],{"class":45},[39,3564,95],{"class":59},[39,3566,3567,3569,3572],{"class":41,"line":78},[39,3568,610],{"class":59},[39,3570,3571],{"class":126},"\"Ana\"",[39,3573,327],{"class":59},[39,3575,3576,3579,3582],{"class":41,"line":85},[39,3577,3578],{"class":59},"  [id]: ",[39,3580,3581],{"class":49},"42",[39,3583,327],{"class":59},[39,3585,3586],{"class":41,"line":98},[39,3587,153],{"class":59},[39,3589,3590],{"class":41,"line":104},[39,3591,82],{"emptyLinePlaceholder":81},[39,3593,3594,3596,3598,3600,3602],{"class":41,"line":110},[39,3595,164],{"class":59},[39,3597,167],{"class":113},[39,3599,170],{"class":59},[39,3601,173],{"class":113},[39,3603,3604],{"class":59},"(user));\n",[39,3606,3607,3609,3611,3613,3615,3617,3619],{"class":41,"line":120},[39,3608,164],{"class":59},[39,3610,167],{"class":113},[39,3612,823],{"class":59},[39,3614,2375],{"class":49},[39,3616,133],{"class":59},[39,3618,2380],{"class":113},[39,3620,3604],{"class":59},[39,3622,3623,3625,3627],{"class":41,"line":144},[39,3624,164],{"class":59},[39,3626,167],{"class":113},[39,3628,3629],{"class":59},"(user[id]);\n",[178,3631,3633,3642,3651,3659],{"className":3632},[181],[183,3634,3636,191,3638,3641],{"className":3635},[186],[188,3637],{"disabled":81,"type":190},[39,3639,3640],{},"\"name\", \"id\""," {\"name\":\"Ana\",\"id\":42} 42",[183,3643,3645,191,3647,3650],{"className":3644},[186],[188,3646],{"disabled":81,"type":190},[39,3648,3649],{},"\"name\""," {\"name\":\"Ana\",\"id\":42} undefined",[183,3652,3654,191,3656,3658],{"className":3653},[186],[188,3655],{"disabled":81,"type":190},[39,3657,3649],{}," {\"name\":\"Ana\"} 42",[183,3660,3662,3664],{"className":3661},[186],[188,3663],{"disabled":81,"type":190}," TypeError: Symbol keys are not allowed in object literals",[218,3666,3667,3669,3675],{},[221,3668,223],{},[225,3670,3671,1131,3673,3658],{},[228,3672,230],{},[39,3674,3649],{},[225,3676,3677,191,3679,3681,3682,1161,3684,1161,3687,1155,3689,1165,3691,3693,3694,3697],{},[228,3678,238],{},[228,3680,2436],{}," Symbol-keyed properties are unconditionally excluded from ",[23,3683,246],{},[23,3685,3686],{},"values",[23,3688,1164],{},[23,3690,1154],{},[23,3692,1168],{}," — not because of an enumerable flag, but because Symbols are categorically skipped by all of those mechanisms. This makes Symbols useful for attaching metadata to an object that won't collide with string keys or accidentally leak into serialization or plain iteration. The property is still fully present and directly retrievable via ",[23,3695,3696],{},"user[id]",", since the caller holds a reference to the exact same Symbol.",[14,3699,3700,3720,3754],{},[18,3701,3703,3704,3707,3708,3710,3711,3713,3714,3716,3717,3719],{"id":3702},"q19-in-modern-js-es2022-which-is-the-most-robust-way-to-check-whether-obj-has-an-own-property-named-key-correct-even-when-obj-was-created-with-objectcreatenull","Q19. In modern JS (ES2022+), which is the most robust way to check whether ",[23,3705,3706],{},"obj"," has an ",[736,3709,1626],{}," property named ",[23,3712,417],{},", correct even when ",[23,3715,3706],{}," was created with ",[23,3718,3295],{},"?",[178,3721,3723,3730,3738,3746],{"className":3722},[181],[183,3724,3726,191,3728],{"className":3725},[186],[188,3727],{"disabled":81,"type":190},[23,3729,1407],{},[183,3731,3733,191,3735],{"className":3732},[186],[188,3734],{"disabled":81,"type":190},[23,3736,3737],{},"obj.hasOwnProperty(key)",[183,3739,3741,191,3743],{"className":3740},[186],[188,3742],{"disabled":81,"type":190},[23,3744,3745],{},"key in obj",[183,3747,3749,191,3751],{"className":3748},[186],[188,3750],{"disabled":81,"type":190},[23,3752,3753],{},"obj[key] !== undefined",[218,3755,3756,3758,3764],{},[221,3757,223],{},[225,3759,3760,2235,3762],{},[228,3761,230],{},[23,3763,1407],{},[225,3765,3766,191,3768,191,3770,3772,3773,3775,3776,3778,3779,2466,3781,3783,3784,3787,3788,3790,3791,3793,3794,3796,3797,3799,3800,3802],{},[228,3767,238],{},[228,3769,2436],{},[23,3771,1400],{}," is a static method — it doesn't rely on ",[23,3774,3706],{}," inheriting anything, so it works correctly even on prototype-less objects, objects that shadow their own ",[23,3777,1299],{},", or objects retrieved from ",[23,3780,3295],{},[23,3782,3737],{}," breaks in exactly those cases, throwing ",[23,3785,3786],{},"TypeError: obj.hasOwnProperty is not a function"," when no prototype provides it. ",[23,3789,3745],{}," checks the ",[736,3792,1375],{}," prototype chain, so it produces false positives for inherited properties. ",[23,3795,3753],{}," is unreliable both ways: a property can exist with the value ",[23,3798,1738],{}," (false negative) and a missing key also reads as ",[23,3801,1738],{}," (indistinguishable).",[14,3804,3805,3809,3948,3982],{"language":16},[18,3806,3808],{"id":3807},"q20-in-strict-mode-what-is-logged","Q20. In strict mode, what is logged?",[28,3810,3811],{"language":16},[31,3812,3814],{"className":33,"code":3813,"language":16,"meta":35,"style":35},"\"use strict\";\n\nconst user = Object.freeze({ name: \"Ana\", roles: [\"admin\"] });\n\ntry {\n  user.name = \"Zoe\";\n  console.log(\"assigned\");\n} catch (err) {\n  console.log(err.constructor.name);\n}\n\nuser.roles.push(\"editor\");\nconsole.log(user.roles);\n",[23,3815,3816,3823,3827,3852,3856,3863,3875,3889,3900,3915,3920,3924,3938],{"__ignoreMap":35},[39,3817,3818,3821],{"class":41,"line":42},[39,3819,3820],{"class":126},"\"use strict\"",[39,3822,60],{"class":59},[39,3824,3825],{"class":41,"line":63},[39,3826,82],{"emptyLinePlaceholder":81},[39,3828,3829,3831,3833,3835,3837,3839,3842,3844,3847,3849],{"class":41,"line":78},[39,3830,46],{"class":45},[39,3832,312],{"class":49},[39,3834,53],{"class":45},[39,3836,599],{"class":59},[39,3838,602],{"class":113},[39,3840,3841],{"class":59},"({ name: ",[39,3843,3571],{"class":126},[39,3845,3846],{"class":59},", roles: [",[39,3848,346],{"class":126},[39,3850,3851],{"class":59},"] });\n",[39,3853,3854],{"class":41,"line":85},[39,3855,82],{"emptyLinePlaceholder":81},[39,3857,3858,3861],{"class":41,"line":98},[39,3859,3860],{"class":45},"try",[39,3862,95],{"class":59},[39,3864,3865,3868,3870,3873],{"class":41,"line":104},[39,3866,3867],{"class":59},"  user.name ",[39,3869,474],{"class":45},[39,3871,3872],{"class":126}," \"Zoe\"",[39,3874,60],{"class":59},[39,3876,3877,3880,3882,3884,3887],{"class":41,"line":110},[39,3878,3879],{"class":59},"  console.",[39,3881,167],{"class":113},[39,3883,823],{"class":59},[39,3885,3886],{"class":126},"\"assigned\"",[39,3888,524],{"class":59},[39,3890,3891,3894,3897],{"class":41,"line":120},[39,3892,3893],{"class":59},"} ",[39,3895,3896],{"class":45},"catch",[39,3898,3899],{"class":59}," (err) {\n",[39,3901,3902,3904,3906,3909,3912],{"class":41,"line":144},[39,3903,3879],{"class":59},[39,3905,167],{"class":113},[39,3907,3908],{"class":59},"(err.",[39,3910,3911],{"class":49},"constructor",[39,3913,3914],{"class":59},".name);\n",[39,3916,3917],{"class":41,"line":150},[39,3918,3919],{"class":59},"}\n",[39,3921,3922],{"class":41,"line":156},[39,3923,82],{"emptyLinePlaceholder":81},[39,3925,3926,3929,3931,3933,3936],{"class":41,"line":161},[39,3927,3928],{"class":59},"user.roles.",[39,3930,820],{"class":113},[39,3932,823],{"class":59},[39,3934,3935],{"class":126},"\"editor\"",[39,3937,524],{"class":59},[39,3939,3941,3943,3945],{"class":41,"line":3940},13,[39,3942,164],{"class":59},[39,3944,167],{"class":113},[39,3946,3947],{"class":59},"(user.roles);\n",[178,3949,3951,3959,3967,3975],{"className":3950},[181],[183,3952,3954,3956,3957],{"className":3953},[186],[188,3955],{"disabled":81,"type":190}," \"assigned\" then ",[39,3958,346],{},[183,3960,3962,3964,3965],{"className":3961},[186],[188,3963],{"disabled":81,"type":190}," \"TypeError\" then ",[39,3966,346],{},[183,3968,3970,3956,3972],{"className":3969},[186],[188,3971],{"disabled":81,"type":190},[39,3973,3974],{},"\"admin\", \"editor\"",[183,3976,3978,3964,3980],{"className":3977},[186],[188,3979],{"disabled":81,"type":190},[39,3981,3974],{},[218,3983,3984,3986,3993],{},[221,3985,223],{},[225,3987,3988,3990,3991],{},[228,3989,230],{}," D — \"TypeError\" then ",[39,3992,3974],{},[225,3994,3995,191,3997,3999,4000,4002,4003,4005,4006,2466,4009,4011,4012,4014,4015,4017,4018,4020,4021,4024,4025,4028,4029,4032,4033,4036],{},[228,3996,238],{},[228,3998,715],{}," in strict mode, assigning to a non-writable property of a frozen object throws a ",[23,4001,1755],{}," instead of failing silently (as it would in sloppy mode), so the ",[23,4004,3896],{}," block runs and logs ",[23,4007,4008],{},"\"TypeError\"",[23,4010,718],{},", however, is shallow — it only locks ",[23,4013,1394],{},"'s own top-level slots (",[23,4016,722],{},", and the ",[736,4019,738],{}," stored in ",[23,4022,4023],{},"roles","), never the contents of objects those slots merely point to. ",[23,4026,4027],{},"user.roles"," is still a fully mutable array, so ",[23,4030,4031],{},"push(\"editor\")"," succeeds in place, producing ",[23,4034,4035],{},"[\"admin\", \"editor\"]",". Freezing an object never cascades into anything it references.",[4038,4039,4040],"style",{},"html pre.shiki code .svdQ7, html code.shiki .svdQ7{--shiki-default:#D73A49;--shiki-github-dark:#F97583}html pre.shiki code .snvgF, html code.shiki .snvgF{--shiki-default:#005CC5;--shiki-github-dark:#79B8FF}html pre.shiki code .ssxIu, html code.shiki .ssxIu{--shiki-default:#24292E;--shiki-github-dark:#E1E4E8}html pre.shiki code .sIsaT, html code.shiki .sIsaT{--shiki-default:#6F42C1;--shiki-github-dark:#B392F0}html pre.shiki code .sJ6F3, html code.shiki .sJ6F3{--shiki-default:#032F62;--shiki-github-dark:#9ECBFF}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .github-dark .shiki span {color: var(--shiki-github-dark);background: var(--shiki-github-dark-bg);font-style: var(--shiki-github-dark-font-style);font-weight: var(--shiki-github-dark-font-weight);text-decoration: var(--shiki-github-dark-text-decoration);}html.github-dark .shiki span {color: var(--shiki-github-dark);background: var(--shiki-github-dark-bg);font-style: var(--shiki-github-dark-font-style);font-weight: var(--shiki-github-dark-font-weight);text-decoration: var(--shiki-github-dark-text-decoration);}html pre.shiki code .sCrzJ, html code.shiki .sCrzJ{--shiki-default:#E36209;--shiki-github-dark:#FFAB70}",{"title":35,"searchDepth":63,"depth":63,"links":4042},[4043,4045,4046,4047,4048,4049,4050,4051,4052,4053,4054,4056,4057,4059,4061,4062,4063,4064,4065,4067],{"id":20,"depth":78,"text":4044},"Q1. What does Object.keys(product) log?",{"id":259,"depth":78,"text":260},{"id":440,"depth":78,"text":441},{"id":579,"depth":78,"text":580},{"id":748,"depth":78,"text":749},{"id":936,"depth":78,"text":937},{"id":1190,"depth":78,"text":1191},{"id":1421,"depth":78,"text":1422},{"id":1644,"depth":78,"text":1645},{"id":1852,"depth":78,"text":1853},{"id":2073,"depth":78,"text":4055},"Q11. What is logged, and what happens when delete total; runs afterward in non-strict mode?",{"id":2300,"depth":78,"text":2301},{"id":2487,"depth":78,"text":4058},"Q13. What does Object.keys(obj) log?",{"id":2658,"depth":78,"text":4060},"Q14. What does JSON.stringify(account) log?",{"id":2866,"depth":78,"text":2867},{"id":3157,"depth":78,"text":3158},{"id":3339,"depth":78,"text":3340},{"id":3527,"depth":78,"text":3528},{"id":3702,"depth":78,"text":4066},"Q19. In modern JS (ES2022+), which is the most robust way to check whether obj has an own property named key, correct even when obj was created with Object.create(null)?",{"id":3807,"depth":78,"text":3808},"md",{},"\u002Fjs\u002F07-objects-and-properties",{"title":5,"description":35},"js\u002F07-objects-and-properties","QvSYnAvJKzt2BdQrnIt-ve_ZvpLjcE4omZZBmjmA2CY",1787335397332]