[{"data":1,"prerenderedAt":322},["ShallowReactive",2],{"term-p\u002Fprototype":3,"related-p\u002Fprototype":310},{"id":4,"title":5,"acronym":6,"body":7,"category":294,"description":295,"difficulty":296,"extension":297,"letter":16,"meta":298,"navigation":98,"path":299,"related":300,"seo":304,"sitemap":305,"stem":308,"subcategory":6,"__hash__":309},"terms\u002Fterms\u002Fp\u002Fprototype.md","Prototype",null,{"type":8,"value":9,"toc":288},"minimark",[10,15,19,23,31,35,277,281,284],[11,12,14],"h2",{"id":13},"eli5-the-vibe-check","ELI5 — The Vibe Check",[16,17,18],"p",{},"Every object in JavaScript secretly has a parent object called its prototype. When you look for a property on an object and it's not there, JavaScript looks at the prototype, then the prototype's prototype, all the way up. This is the prototype chain — how JavaScript does inheritance. Modern classes are just fancy syntax on top of this.",[11,20,22],{"id":21},"real-talk","Real Talk",[16,24,25,26,30],{},"The prototype is an object from which other objects inherit properties and methods via the prototype chain. Every JavaScript object has an internal [[Prototype]] link (accessible via Object.getPrototypeOf() or ",[27,28,29],"strong",{},"proto","). ES6 class syntax is syntactic sugar over prototype-based inheritance — classes don't change the underlying prototype mechanism.",[11,32,34],{"id":33},"show-me-the-code","Show Me The Code",[36,37,42],"pre",{"className":38,"code":39,"language":40,"meta":41,"style":41},"language-javascript shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","function Animal(name) {\n  this.name = name\n}\n\nAnimal.prototype.speak = function() {\n  return `${this.name} makes a noise.`\n}\n\nconst dog = new Animal('Rex')\nconsole.log(dog.speak()) \u002F\u002F 'Rex makes a noise.'\nconsole.log(dog.hasOwnProperty('name'))  \u002F\u002F true\nconsole.log(dog.hasOwnProperty('speak')) \u002F\u002F false (it's on prototype)\n","javascript","",[43,44,45,72,87,93,100,128,153,158,163,193,218,248],"code",{"__ignoreMap":41},[46,47,50,54,58,62,66,69],"span",{"class":48,"line":49},"line",1,[46,51,53],{"class":52},"spNyl","function",[46,55,57],{"class":56},"s2Zo4"," Animal",[46,59,61],{"class":60},"sMK4o","(",[46,63,65],{"class":64},"sHdIc","name",[46,67,68],{"class":60},")",[46,70,71],{"class":60}," {\n",[46,73,75,78,81,84],{"class":48,"line":74},2,[46,76,77],{"class":60},"  this.",[46,79,65],{"class":80},"sTEyZ",[46,82,83],{"class":60}," =",[46,85,86],{"class":80}," name\n",[46,88,90],{"class":48,"line":89},3,[46,91,92],{"class":60},"}\n",[46,94,96],{"class":48,"line":95},4,[46,97,99],{"emptyLinePlaceholder":98},true,"\n",[46,101,103,107,110,113,115,118,120,123,126],{"class":48,"line":102},5,[46,104,106],{"class":105},"sBMFI","Animal",[46,108,109],{"class":60},".",[46,111,112],{"class":80},"prototype",[46,114,109],{"class":60},[46,116,117],{"class":56},"speak",[46,119,83],{"class":60},[46,121,122],{"class":52}," function",[46,124,125],{"class":60},"()",[46,127,71],{"class":60},[46,129,131,135,138,141,143,146,150],{"class":48,"line":130},6,[46,132,134],{"class":133},"s7zQu","  return",[46,136,137],{"class":60}," `${",[46,139,140],{"class":60},"this.",[46,142,65],{"class":80},[46,144,145],{"class":60},"}",[46,147,149],{"class":148},"sfazB"," makes a noise.",[46,151,152],{"class":60},"`\n",[46,154,156],{"class":48,"line":155},7,[46,157,92],{"class":60},[46,159,161],{"class":48,"line":160},8,[46,162,99],{"emptyLinePlaceholder":98},[46,164,166,169,172,175,178,180,182,185,188,190],{"class":48,"line":165},9,[46,167,168],{"class":52},"const",[46,170,171],{"class":80}," dog ",[46,173,174],{"class":60},"=",[46,176,177],{"class":60}," new",[46,179,57],{"class":56},[46,181,61],{"class":80},[46,183,184],{"class":60},"'",[46,186,187],{"class":148},"Rex",[46,189,184],{"class":60},[46,191,192],{"class":80},")\n",[46,194,196,199,201,204,207,209,211,214],{"class":48,"line":195},10,[46,197,198],{"class":80},"console",[46,200,109],{"class":60},[46,202,203],{"class":56},"log",[46,205,206],{"class":80},"(dog",[46,208,109],{"class":60},[46,210,117],{"class":56},[46,212,213],{"class":80},"()) ",[46,215,217],{"class":216},"sHwdD","\u002F\u002F 'Rex makes a noise.'\n",[46,219,221,223,225,227,229,231,234,236,238,240,242,245],{"class":48,"line":220},11,[46,222,198],{"class":80},[46,224,109],{"class":60},[46,226,203],{"class":56},[46,228,206],{"class":80},[46,230,109],{"class":60},[46,232,233],{"class":56},"hasOwnProperty",[46,235,61],{"class":80},[46,237,184],{"class":60},[46,239,65],{"class":148},[46,241,184],{"class":60},[46,243,244],{"class":80},"))  ",[46,246,247],{"class":216},"\u002F\u002F true\n",[46,249,251,253,255,257,259,261,263,265,267,269,271,274],{"class":48,"line":250},12,[46,252,198],{"class":80},[46,254,109],{"class":60},[46,256,203],{"class":56},[46,258,206],{"class":80},[46,260,109],{"class":60},[46,262,233],{"class":56},[46,264,61],{"class":80},[46,266,184],{"class":60},[46,268,117],{"class":148},[46,270,184],{"class":60},[46,272,273],{"class":80},")) ",[46,275,276],{"class":216},"\u002F\u002F false (it's on prototype)\n",[11,278,280],{"id":279},"when-youll-hear-this","When You'll Hear This",[16,282,283],{},"Adding methods to Array.prototype is possible but considered bad practice.,ES6 classes compile down to prototype-based code in older environments.,The prototype chain ends at Object.prototype, whose prototype is null.",[285,286,287],"style",{},"html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .sHdIc, html code.shiki .sHdIc{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#EEFFFF;--shiki-default-font-style:italic;--shiki-dark:#BABED8;--shiki-dark-font-style:italic}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .sBMFI, html code.shiki .sBMFI{--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B}html pre.shiki code .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html pre.shiki code .sHwdD, html code.shiki .sHwdD{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#546E7A;--shiki-default-font-style:italic;--shiki-dark:#676E95;--shiki-dark-font-style:italic}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}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 .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"title":41,"searchDepth":74,"depth":74,"links":289},[290,291,292,293],{"id":13,"depth":74,"text":14},{"id":21,"depth":74,"text":22},{"id":33,"depth":74,"text":34},{"id":279,"depth":74,"text":280},"frontend","Every object in JavaScript secretly has a parent object called its prototype.","advanced","md",{},"\u002Fterms\u002Fp\u002Fprototype",[301,302,303],"Scope","Closure","Arrow Function",{"title":5,"description":295},{"changefreq":306,"priority":307},"weekly",0.7,"terms\u002Fp\u002Fprototype","17nCeP6xxcmffQ8weiQsx2k2NaQ57SHBb8h2_e4OXh4",[311,315,318],{"title":303,"path":312,"acronym":6,"category":294,"difficulty":313,"description":314},"\u002Fterms\u002Fa\u002Farrow-function","beginner","Arrow functions are a shorter way to write functions in JavaScript. Instead of writing 'function(x) { return x * 2 }' you write '(x) => x * 2'.",{"title":302,"path":316,"acronym":6,"category":294,"difficulty":296,"description":317},"\u002Fterms\u002Fc\u002Fclosure","A closure is when a function remembers the variables from the scope it was created in, even after that scope is gone.",{"title":301,"path":319,"acronym":6,"category":294,"difficulty":320,"description":321},"\u002Fterms\u002Fs\u002Fscope","intermediate","Scope is about where your variables are visible. Variables defined inside a function can't be seen outside it (that's function scope).",1776518304342]