[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"project-472":3},{"id":4,"name":5,"fullName":6,"owner":7,"repo":5,"description":8,"homepage":9,"htmlUrl":10,"language":10,"languages":10,"totalLinesOfCode":10,"stars":11,"forks":12,"watchers":13,"openIssues":14,"contributorsCount":15,"subscribersCount":15,"size":15,"stars1d":16,"stars7d":17,"stars30d":18,"stars90d":15,"forks30d":15,"starsTrendScore":19,"compositeScore":20,"rankGlobal":10,"rankLanguage":10,"license":21,"archived":22,"fork":22,"defaultBranch":23,"hasWiki":24,"hasPages":22,"topics":25,"createdAt":10,"pushedAt":10,"updatedAt":26,"readmeContent":27,"aiSummary":28,"trendingCount":15,"starSnapshotCount":15,"syncStatus":29,"lastSyncTime":30,"discoverSource":31},472,"javascript-questions","lydiahallie\u002Fjavascript-questions","lydiahallie","A long list of (advanced) JavaScript questions, and their explanations :sparkles:  ","",null,65325,9222,1263,20,0,3,10,23,13,45,"MIT License",false,"master",true,[],"2026-06-12 02:00:14","\u003Cdiv align=\"center\">\n  \u003Cimg height=\"60\" src=\"https:\u002F\u002Fimg.icons8.com\u002Fcolor\u002F344\u002Fjavascript.png\">\n  \u003Ch1>JavaScript Questions\u003C\u002Fh1>\n\u003C\u002Fdiv>\n\n> [!NOTE]  \n> This repo was created in 2019 and the questions provided here are therefore based on the JavaScript syntax and behavior at that time. Since JavaScript is a constantly evolving language, there are newer language features that are not covered by the questions here.\n\n---\n\n\u003Cp align=\"center\">\nFrom basic to advanced: test how well you know JavaScript, refresh your knowledge a bit or prepare for your coding interview! :muscle: :rocket: I update this repo regularly with new questions. I added the answers in the **collapsed sections** below the questions, simply click on them to expand it. It's just for fun, good luck! :heart:\u003C\u002Fp>\n\n\u003Cp align=\"center\">Feel free to reach out to me! 😊\u003C\u002Fp>\n\n\u003Cp align=\"center\">\n  \u003Ca href=\"https:\u002F\u002Fwww.instagram.com\u002Ftheavocoder\">Instagram\u003C\u002Fa> || \u003Ca href=\"https:\u002F\u002Fwww.twitter.com\u002Flydiahallie\">Twitter\u003C\u002Fa> || \u003Ca href=\"https:\u002F\u002Fwww.linkedin.com\u002Fin\u002Flydia-hallie\">LinkedIn\u003C\u002Fa> || \u003Ca href=\"https:\u002F\u002Fwww.lydiahallie.io\u002F\">Blog\u003C\u002Fa>\n\u003C\u002Fp>\n\n| Feel free to use them in a project! 😃 I would _really_ appreciate a reference to this repo, I create the questions and explanations (yes I'm sad lol) and the community helps me so much to maintain and improve it! 💪🏼 Thank you and have fun! |\n| ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |\n\n\u003Cdetails>\u003Csummary>\u003Cstrong> See 20 Available Translations 🇸🇦🇪🇬🇧🇦🇩🇪🇪🇸🇫🇷🇮🇩🇯🇵🇰🇷🇳🇱🇧🇷🇷🇺🇹🇭🇹🇷🇺🇦🇻🇳🇨🇳🇹🇼🇽🇰\u003C\u002Fstrong>\u003C\u002Fsummary>\n\u003Cp>\n\n- [🇸🇦 العربية](.\u002Far-AR\u002FREADME_AR.md)\n- [🇪🇬 اللغة العامية](.\u002Far-EG\u002FREADME_ar-EG.md)\n- [🇧🇦 Bosanski](.\u002Fbs-BS\u002FREADME-bs_BS.md)\n- [🇩🇪 Deutsch](.\u002Fde-DE\u002FREADME.md)\n- [🇪🇸 Español](.\u002Fes-ES\u002FREADME-ES.md)\n- [🇫🇷 Français](.\u002Ffr-FR\u002FREADME_fr-FR.md)\n- [🇮🇩 Indonesia](.\u002Fid-ID\u002FREADME.md)\n- [🇮🇹 Italiano](.\u002Fit-IT\u002FREADME.md)\n- [🇯🇵 日本語](.\u002Fja-JA\u002FREADME-ja_JA.md)\n- [🇰🇷 한국어](.\u002Fko-KR\u002FREADME-ko_KR.md)\n- [🇳🇱 Nederlands](.\u002Fnl-NL\u002FREADME.md)\n- [🇵🇱 Polski](.\u002Fpl-PL\u002FREADME.md)\n- [🇧🇷 Português Brasil](.\u002Fpt-BR\u002FREADME_pt_BR.md)\n- [🇷o Română](.\u002Fro-RO\u002FREADME.ro.md)\n- [🇷🇺 Русский](.\u002Fru-RU\u002FREADME.md)\n- [🇽🇰 Shqip](.\u002Fsq-KS\u002FREADME_sq_KS.md)\n- [🇹🇭 ไทย](.\u002Fth-TH\u002FREADME-th_TH.md)\n- [🇹🇷 Türkçe](.\u002Ftr-TR\u002FREADME-tr_TR.md)\n- [🇺🇦 Українська мова](.\u002Fuk-UA\u002FREADME.md)\n- [🇻🇳 Tiếng Việt](.\u002Fvi-VI\u002FREADME-vi.md)\n- [🇨🇳 简体中文](.\u002Fzh-CN\u002FREADME-zh_CN.md)\n- [🇹🇼 繁體中文](.\u002Fzh-TW\u002FREADME_zh-TW.md)\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 1. What's the output?\n\n```javascript\nfunction sayHi() {\n  console.log(name);\n  console.log(age);\n  var name = 'Lydia';\n  let age = 21;\n}\n\nsayHi();\n```\n\n- A: `Lydia` and `undefined`\n- B: `Lydia` and `ReferenceError`\n- C: `ReferenceError` and `21`\n- D: `undefined` and `ReferenceError`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: D\n\nWithin the function, we first declare the `name` variable with the `var` keyword. This means that the variable gets hoisted (memory space is set up during the creation phase) with the default value of `undefined`, until we actually get to the line where we define the variable. We haven't defined the variable yet on the line where we try to log the `name` variable, so it still holds the value of `undefined`.\n\nVariables with the `let` keyword (and `const`) are hoisted, but unlike `var`, don't get \u003Ci>initialized\u003C\u002Fi>. They are not accessible before the line we declare (initialize) them. This is called the \"temporal dead zone\". When we try to access the variables before they are declared, JavaScript throws a `ReferenceError`.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 2. What's the output?\n\n```javascript\nfor (var i = 0; i \u003C 3; i++) {\n  setTimeout(() => console.log(i), 1);\n}\n\nfor (let i = 0; i \u003C 3; i++) {\n  setTimeout(() => console.log(i), 1);\n}\n```\n\n- A: `0 1 2` and `0 1 2`\n- B: `0 1 2` and `3 3 3`\n- C: `3 3 3` and `0 1 2`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: C\n\nBecause of the event queue in JavaScript, the `setTimeout` callback function is called _after_ the loop has been executed. Since the variable `i` in the first loop was declared using the `var` keyword, this value was global. During the loop, we incremented the value of `i` by `1` each time, using the unary operator `++`. By the time the `setTimeout` callback function was invoked, `i` was equal to `3` in the first example.\n\nIn the second loop, the variable `i` was declared using the `let` keyword: variables declared with the `let` (and `const`) keyword are block-scoped (a block is anything between `{ }`). During each iteration, `i` will have a new value, and each value is scoped inside the loop.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 3. What's the output?\n\n```javascript\nconst shape = {\n  radius: 10,\n  diameter() {\n    return this.radius * 2;\n  },\n  perimeter: () => 2 * Math.PI * this.radius,\n};\n\nconsole.log(shape.diameter());\nconsole.log(shape.perimeter());\n```\n\n- A: `20` and `62.83185307179586`\n- B: `20` and `NaN`\n- C: `20` and `63`\n- D: `NaN` and `63`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: B\n\nNote that the value of `diameter` is a regular function, whereas the value of `perimeter` is an arrow function.\n\nWith arrow functions, the `this` keyword refers to its current surrounding scope, unlike regular functions! This means that when we call `perimeter`, it doesn't refer to the shape object, but to its surrounding scope (window for example).\n\nSince there is no value `radius` in the scope of the arrow function, `this.radius` returns `undefined` which, when multiplied by `2 * Math.PI`, results in `NaN`.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 4. What's the output?\n\n```javascript\n+true;\n!'Lydia';\n```\n\n- A: `1` and `false`\n- B: `false` and `NaN`\n- C: `false` and `false`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: A\n\nThe unary plus tries to convert an operand to a number. `true` is `1`, and `false` is `0`.\n\nThe string `'Lydia'` is a truthy value. What we're actually asking, is \"Is this truthy value falsy?\". This returns `false`.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 5. Which one is true?\n\n```javascript\nconst bird = {\n  size: 'small',\n};\n\nconst mouse = {\n  name: 'Mickey',\n  small: true,\n};\n```\n\n- A: `mouse.bird.size` is not valid\n- B: `mouse[bird.size]` is not valid\n- C: `mouse[bird[\"size\"]]` is not valid\n- D: All of them are valid\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: A\n\nIn JavaScript, all object keys are strings (unless it's a Symbol). Even though we might not _type_ them as strings, they are always converted into strings under the hood.\n\nJavaScript interprets (or unboxes) statements. When we use bracket notation, it sees the first opening bracket `[` and keeps going until it finds the closing bracket `]`. Only then, it will evaluate the statement.\n\n`mouse[bird.size]`: First it evaluates `bird.size`, which is `\"small\"`. `mouse[\"small\"]` returns `true`\n\nHowever, with dot notation, this doesn't happen. `mouse` does not have a key called `bird`, which means that `mouse.bird` is `undefined`. Then, we ask for the `size` using dot notation: `mouse.bird.size`. Since `mouse.bird` is `undefined`, we're actually asking `undefined.size`. This isn't valid, and will throw an error similar to `Cannot read property \"size\" of undefined`.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 6. What's the output?\n\n```javascript\nlet c = { greeting: 'Hey!' };\nlet d;\n\nd = c;\nc.greeting = 'Hello';\nconsole.log(d.greeting);\n```\n\n- A: `Hello`\n- B: `Hey!`\n- C: `undefined`\n- D: `ReferenceError`\n- E: `TypeError`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: A\n\nIn JavaScript, all objects interact by _reference_ when setting them equal to each other.\n\nFirst, variable `c` holds a value to an object. Later, we assign `d` with the same reference that `c` has to the object.\n\n\u003Cimg src=\"https:\u002F\u002Fi.imgur.com\u002Fko5k0fs.png\" width=\"200\">\n\nWhen you change one object, you change all of them.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 7. What's the output?\n\n```javascript\nlet a = 3;\nlet b = new Number(3);\nlet c = 3;\n\nconsole.log(a == b);\nconsole.log(a === b);\nconsole.log(b === c);\n```\n\n- A: `true` `false` `true`\n- B: `false` `false` `true`\n- C: `true` `false` `false`\n- D: `false` `true` `true`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: C\n\n`new Number()` is a built-in function constructor. Although it looks like a number, it's not really a number: it has a bunch of extra features and is an object.\n\nWhen we use the `==` operator (Equality operator), it only checks whether it has the same _value_. They both have the value of `3`, so it returns `true`.\n\nHowever, when we use the `===` operator (Strict equality operator), both value _and_ type should be the same. It's not: `new Number()` is not a number, it's an **object**. Both return `false.`\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 8. What's the output?\n\n```javascript\nclass Chameleon {\n  static colorChange(newColor) {\n    this.newColor = newColor;\n    return this.newColor;\n  }\n\n  constructor({ newColor = 'green' } = {}) {\n    this.newColor = newColor;\n  }\n}\n\nconst freddie = new Chameleon({ newColor: 'purple' });\nconsole.log(freddie.colorChange('orange'));\n```\n\n- A: `orange`\n- B: `purple`\n- C: `green`\n- D: `TypeError`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: D\n\nThe `colorChange` function is static. Static methods are designed to live only on the constructor in which they are created, and cannot be passed down to any children or called upon class instances. Since `freddie` is an instance of class Chameleon, the function cannot be called upon it. A `TypeError` is thrown.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 9. What's the output?\n\n```javascript\nlet greeting;\ngreetign = {}; \u002F\u002F Typo!\nconsole.log(greetign);\n```\n\n- A: `{}`\n- B: `ReferenceError: greetign is not defined`\n- C: `undefined`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: A\n\nIt logs the object, because we just created an empty object on the global object! When we mistyped `greeting` as `greetign`, the JS interpreter actually saw this as:\n\n1. `global.greetign = {}` in Node.js\n2. `window.greetign = {}`, `frames.greetign = {}` and `self.greetign` in browsers.\n3. `self.greetign` in web workers.\n4. `globalThis.greetign` in all environments.\n\nIn order to avoid this, we can use `\"use strict\"`. This makes sure that you have declared a variable before setting it equal to anything.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 10. What happens when we do this?\n\n```javascript\nfunction bark() {\n  console.log('Woof!');\n}\n\nbark.animal = 'dog';\n```\n\n- A: Nothing, this is totally fine!\n- B: `SyntaxError`. You cannot add properties to a function this way.\n- C: `\"Woof\"` gets logged.\n- D: `ReferenceError`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: A\n\nThis is possible in JavaScript, because functions are objects! (Everything besides primitive types are objects)\n\nA function is a special type of object. The code you write yourself isn't the actual function. The function is an object with properties. This property is invocable.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 11. What's the output?\n\n```javascript\nfunction Person(firstName, lastName) {\n  this.firstName = firstName;\n  this.lastName = lastName;\n}\n\nconst member = new Person('Lydia', 'Hallie');\nPerson.getFullName = function() {\n  return `${this.firstName} ${this.lastName}`;\n};\n\nconsole.log(member.getFullName());\n```\n\n- A: `TypeError`\n- B: `SyntaxError`\n- C: `Lydia Hallie`\n- D: `undefined` `undefined`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: A\n\nIn JavaScript, functions are objects, and therefore, the method `getFullName` gets added to the constructor function object itself. For that reason, we can call `Person.getFullName()`, but `member.getFullName` throws a `TypeError`. \n\nIf you want a method to be available to all object instances, you have to add it to the prototype property:\n\n```js\nPerson.prototype.getFullName = function() {\n  return `${this.firstName} ${this.lastName}`;\n};\n```\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 12. What's the output?\n\n```javascript\nfunction Person(firstName, lastName) {\n  this.firstName = firstName;\n  this.lastName = lastName;\n}\n\nconst lydia = new Person('Lydia', 'Hallie');\nconst sarah = Person('Sarah', 'Smith');\n\nconsole.log(lydia);\nconsole.log(sarah);\n```\n\n- A: `Person {firstName: \"Lydia\", lastName: \"Hallie\"}` and `undefined`\n- B: `Person {firstName: \"Lydia\", lastName: \"Hallie\"}` and `Person {firstName: \"Sarah\", lastName: \"Smith\"}`\n- C: `Person {firstName: \"Lydia\", lastName: \"Hallie\"}` and `{}`\n- D: `Person {firstName: \"Lydia\", lastName: \"Hallie\"}` and `ReferenceError`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: A\n\nFor `sarah`, we didn't use the `new` keyword. When using `new`, `this` refers to the new empty object we create. However, if you don't add `new`, `this` refers to the **global object**!\n\nWe said that `this.firstName` equals `\"Sarah\"` and `this.lastName` equals `\"Smith\"`. What we actually did, is defining `global.firstName = 'Sarah'` and `global.lastName = 'Smith'`. `sarah` itself is left `undefined`, since we don't return a value from the `Person` function.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 13. What are the three phases of event propagation?\n\n- A: Target > Capturing > Bubbling\n- B: Bubbling > Target > Capturing\n- C: Target > Bubbling > Capturing\n- D: Capturing > Target > Bubbling\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: D\n\nDuring the **capturing** phase, the event goes through the ancestor elements down to the target element. It then reaches the **target** element, and **bubbling** begins.\n\n\u003Cimg src=\"https:\u002F\u002Fi.imgur.com\u002FN18oRgd.png\" width=\"200\">\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 14. All object have prototypes.\n\n- A: true\n- B: false\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: B\n\nAll objects have prototypes, except for the **base object**. The base object is the object created by the user, or an object that is created using the `new` keyword. The base object has access to some methods and properties, such as `.toString`. This is the reason why you can use built-in JavaScript methods! All of such methods are available on the prototype. Although JavaScript can't find it directly on your object, it goes down the prototype chain and finds it there, which makes it accessible for you.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 15. What's the output?\n\n```javascript\nfunction sum(a, b) {\n  return a + b;\n}\n\nsum(1, '2');\n```\n\n- A: `NaN`\n- B: `TypeError`\n- C: `\"12\"`\n- D: `3`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: C\n\nJavaScript is a **dynamically typed language**: we don't specify what types certain variables are. Values can automatically be converted into another type without you knowing, which is called _implicit type coercion_. **Coercion** is converting from one type into another.\n\nIn this example, JavaScript converts the number `1` into a string, in order for the function to make sense and return a value. During the addition of a numeric type (`1`) and a string type (`'2'`), the number is treated as a string. We can concatenate strings like `\"Hello\" + \"World\"`, so what's happening here is `\"1\" + \"2\"` which returns `\"12\"`.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 16. What's the output?\n\n```javascript\nlet number = 0;\nconsole.log(number++);\nconsole.log(++number);\nconsole.log(number);\n```\n\n- A: `1` `1` `2`\n- B: `1` `2` `2`\n- C: `0` `2` `2`\n- D: `0` `1` `2`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: C\n\nThe **postfix** unary operator `++`:\n\n1. Returns the value (this returns `0`)\n2. Increments the value (number is now `1`)\n\nThe **prefix** unary operator `++`:\n\n1. Increments the value (number is now `2`)\n2. Returns the value (this returns `2`)\n\nThis returns `0 2 2`.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 17. What's the output?\n\n```javascript\nfunction getPersonInfo(one, two, three) {\n  console.log(one);\n  console.log(two);\n  console.log(three);\n}\n\nconst person = 'Lydia';\nconst age = 21;\n\ngetPersonInfo`${person} is ${age} years old`;\n```\n\n- A: `\"Lydia\"` `21` `[\"\", \" is \", \" years old\"]`\n- B: `[\"\", \" is \", \" years old\"]` `\"Lydia\"` `21`\n- C: `\"Lydia\"` `[\"\", \" is \", \" years old\"]` `21`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: B\n\nIf you use tagged template literals, the value of the first argument is always an array of the string values. The remaining arguments get the values of the passed expressions!\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 18. What's the output?\n\n```javascript\nfunction checkAge(data) {\n  if (data === { age: 18 }) {\n    console.log('You are an adult!');\n  } else if (data == { age: 18 }) {\n    console.log('You are still an adult.');\n  } else {\n    console.log(`Hmm.. You don't have an age I guess`);\n  }\n}\n\ncheckAge({ age: 18 });\n```\n\n- A: `You are an adult!`\n- B: `You are still an adult.`\n- C: `Hmm.. You don't have an age I guess`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: C\n\nWhen testing equality, primitives are compared by their _value_, while objects are compared by their _reference_. JavaScript checks if the objects have a reference to the same location in memory.\n\nThe two objects that we are comparing don't have that: the object we passed as a parameter refers to a different location in memory than the object we used in order to check equality.\n\nThis is why both `{ age: 18 } === { age: 18 }` and `{ age: 18 } == { age: 18 }` return `false`.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 19. What's the output?\n\n```javascript\nfunction getAge(...args) {\n  console.log(typeof args);\n}\n\ngetAge(21);\n```\n\n- A: `\"number\"`\n- B: `\"array\"`\n- C: `\"object\"`\n- D: `\"NaN\"`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: C\n\nThe rest parameter (`...args`) lets us \"collect\" all remaining arguments into an array. An array is an object, so `typeof args` returns `\"object\"`\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 20. What's the output?\n\n```javascript\nfunction getAge() {\n  'use strict';\n  age = 21;\n  console.log(age);\n}\n\ngetAge();\n```\n\n- A: `21`\n- B: `undefined`\n- C: `ReferenceError`\n- D: `TypeError`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: C\n\nWith `\"use strict\"`, you can make sure that you don't accidentally declare global variables. We never declared the variable `age`, and since we use `\"use strict\"`, it will throw a reference error. If we didn't use `\"use strict\"`, it would have worked, since the property `age` would have gotten added to the global object.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 21. What's the value of `sum`?\n\n```javascript\nconst sum = eval('10*10+5');\n```\n\n- A: `105`\n- B: `\"105\"`\n- C: `TypeError`\n- D: `\"10*10+5\"`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: A\n\n`eval` evaluates code that's passed as a string. If it's an expression, like in this case, it evaluates the expression. The expression is `10 * 10 + 5`. This returns the number `105`.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 22. How long is cool_secret accessible?\n\n```javascript\nsessionStorage.setItem('cool_secret', 123);\n```\n\n- A: Forever, the data doesn't get lost.\n- B: When the user closes the tab.\n- C: When the user closes the entire browser, not only the tab.\n- D: When the user shuts off their computer.\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: B\n\nThe data stored in `sessionStorage` is removed after closing the _tab_.\n\nIf you used `localStorage`, the data would've been there forever, unless for example `localStorage.clear()` is invoked.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 23. What's the output?\n\n```javascript\nvar num = 8;\nvar num = 10;\n\nconsole.log(num);\n```\n\n- A: `8`\n- B: `10`\n- C: `SyntaxError`\n- D: `ReferenceError`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: B\n\nWith the `var` keyword, you can declare multiple variables with the same name. The variable will then hold the latest value.\n\nYou cannot do this with `let` or `const` since they're block-scoped and therefore can't be redeclared.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 24. What's the output?\n\n```javascript\nconst obj = { 1: 'a', 2: 'b', 3: 'c' };\nconst set = new Set([1, 2, 3, 4, 5]);\n\nobj.hasOwnProperty('1');\nobj.hasOwnProperty(1);\nset.has('1');\nset.has(1);\n```\n\n- A: `false` `true` `false` `true`\n- B: `false` `true` `true` `true`\n- C: `true` `true` `false` `true`\n- D: `true` `true` `true` `true`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: C\n\nAll object keys (excluding Symbols) are strings under the hood, even if you don't type it yourself as a string. This is why `obj.hasOwnProperty('1')` also returns true.\n\nIt doesn't work that way for a set. There is no `'1'` in our set: `set.has('1')` returns `false`. It has the numeric type `1`, `set.has(1)` returns `true`.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 25. What's the output?\n\n```javascript\nconst obj = { a: 'one', b: 'two', a: 'three' };\nconsole.log(obj);\n```\n\n- A: `{ a: \"one\", b: \"two\" }`\n- B: `{ b: \"two\", a: \"three\" }`\n- C: `{ a: \"three\", b: \"two\" }`\n- D: `SyntaxError`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: C\n\nIf you have two keys with the same name, the key will be replaced. It will still be in its first position, but with the last specified value.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 26. The JavaScript global execution context creates two things for you: the global object, and the \"this\" keyword.\n\n- A: true\n- B: false\n- C: it depends\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: A\n\nThe base execution context is the global execution context: it's what's accessible everywhere in your code.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 27. What's the output?\n\n```javascript\nfor (let i = 1; i \u003C 5; i++) {\n  if (i === 3) continue;\n  console.log(i);\n}\n```\n\n- A: `1` `2`\n- B: `1` `2` `3`\n- C: `1` `2` `4`\n- D: `1` `3` `4`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: C\n\nThe `continue` statement skips an iteration if a certain condition returns `true`.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 28. What's the output?\n\n```javascript\nString.prototype.giveLydiaPizza = () => {\n  return 'Just give Lydia pizza already!';\n};\n\nconst name = 'Lydia';\n\nconsole.log(name.giveLydiaPizza())\n```\n\n- A: `\"Just give Lydia pizza already!\"`\n- B: `TypeError: not a function`\n- C: `SyntaxError`\n- D: `undefined`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: A\n\n`String` is a built-in constructor, that we can add properties to. I just added a method to its prototype. Primitive strings are automatically converted into a string object, generated by the string prototype function. So, all strings (string objects) have access to that method!\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 29. What's the output?\n\n```javascript\nconst a = {};\nconst b = { key: 'b' };\nconst c = { key: 'c' };\n\na[b] = 123;\na[c] = 456;\n\nconsole.log(a[b]);\n```\n\n- A: `123`\n- B: `456`\n- C: `undefined`\n- D: `ReferenceError`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: B\n\nObject keys are automatically converted into strings. We are trying to set an object as a key to object `a`, with the value of `123`.\n\nHowever, when we stringify an object, it becomes `\"[object Object]\"`. So what we are saying here, is that `a[\"[object Object]\"] = 123`. Then, we can try to do the same again. `c` is another object that we are implicitly stringifying. So then, `a[\"[object Object]\"] = 456`.\n\nThen, we log `a[b]`, which is actually `a[\"[object Object]\"]`. We just set that to `456`, so it returns `456`.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 30. What's the output?\n\n```javascript\nconst foo = () => console.log('First');\nconst bar = () => setTimeout(() => console.log('Second'));\nconst baz = () => console.log('Third');\n\nbar();\nfoo();\nbaz();\n```\n\n- A: `First` `Second` `Third`\n- B: `First` `Third` `Second`\n- C: `Second` `First` `Third`\n- D: `Second` `Third` `First`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: B\n\nWe have a `setTimeout` function and invoked it first. Yet, it was logged last.\n\nThis is because in browsers, we don't just have the runtime engine, we also have something called a `WebAPI`. The `WebAPI` gives us the `setTimeout` function to start with, and for example the DOM.\n\nAfter the _callback_ is pushed to the WebAPI, the `setTimeout` function itself (but not the callback!) is popped off the stack.\n\n\u003Cimg src=\"https:\u002F\u002Fi.imgur.com\u002FX5wsHOg.png\" width=\"200\">\n\nNow, `foo` gets invoked, and `\"First\"` is being logged.\n\n\u003Cimg src=\"https:\u002F\u002Fi.imgur.com\u002FPvc0dGq.png\" width=\"200\">\n\n`foo` is popped off the stack, and `baz` gets invoked. `\"Third\"` gets logged.\n\n\u003Cimg src=\"https:\u002F\u002Fi.imgur.com\u002FWhA2bCP.png\" width=\"200\">\n\nThe WebAPI can't just add stuff to the stack whenever it's ready. Instead, it pushes the callback function to something called the _queue_.\n\n\u003Cimg src=\"https:\u002F\u002Fi.imgur.com\u002FNSnDZmU.png\" width=\"200\">\n\nThis is where an event loop starts to work. An **event loop** looks at the stack and task queue. If the stack is empty, it takes the first thing on the queue and pushes it onto the stack.\n\n\u003Cimg src=\"https:\u002F\u002Fi.imgur.com\u002FuyiScAI.png\" width=\"200\">\n\n`bar` gets invoked, `\"Second\"` gets logged, and it's popped off the stack.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 31. What is the event.target when clicking the button?\n\n```html\n\u003Cdiv onclick=\"console.log('first div')\">\n  \u003Cdiv onclick=\"console.log('second div')\">\n    \u003Cbutton onclick=\"console.log('button')\">\n      Click!\n    \u003C\u002Fbutton>\n  \u003C\u002Fdiv>\n\u003C\u002Fdiv>\n```\n\n- A: Outer `div`\n- B: Inner `div`\n- C: `button`\n- D: An array of all nested elements.\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: C\n\nThe deepest nested element that caused the event is the target of the event. You can stop bubbling by `event.stopPropagation`\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 32. When you click the paragraph, what's the logged output?\n\n```html\n\u003Cdiv onclick=\"console.log('div')\">\n  \u003Cp onclick=\"console.log('p')\">\n    Click here!\n  \u003C\u002Fp>\n\u003C\u002Fdiv>\n```\n\n- A: `p` `div`\n- B: `div` `p`\n- C: `p`\n- D: `div`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: A\n\nIf we click `p`, we see two logs: `p` and `div`. During event propagation, there are 3 phases: capturing, targeting, and bubbling. By default, event handlers are executed in the bubbling phase (unless you set `useCapture` to `true`). It goes from the deepest nested element outwards.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 33. What's the output?\n\n```javascript\nconst person = { name: 'Lydia' };\n\nfunction sayHi(age) {\n  return `${this.name} is ${age}`;\n}\n\nconsole.log(sayHi.call(person, 21));\nconsole.log(sayHi.bind(person, 21));\n```\n\n- A: `undefined is 21` `Lydia is 21`\n- B: `function` `function`\n- C: `Lydia is 21` `Lydia is 21`\n- D: `Lydia is 21` `function`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: D\n\nWith both, we can pass the object to which we want the `this` keyword to refer to. However, `.call` is also _executed immediately_!\n\n`.bind.` returns a _copy_ of the function, but with a bound context! It is not executed immediately.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 34. What's the output?\n\n```javascript\nfunction sayHi() {\n  return (() => 0)();\n}\n\nconsole.log(typeof sayHi());\n```\n\n- A: `\"object\"`\n- B: `\"number\"`\n- C: `\"function\"`\n- D: `\"undefined\"`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: B\n\nThe `sayHi` function returns the returned value of the immediately invoked function expression (IIFE). This function returned `0`, which is type `\"number\"`.\n\t\nFYI: `typeof` can return the following list of values: `undefined`, `boolean`, `number`, `bigint`, `string`, `symbol`, `function` and `object`. Note that `typeof null` returns `\"object\"`.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 35. Which of these values are falsy?\n\n```javascript\n0;\nnew Number(0);\n('');\n(' ');\nnew Boolean(false);\nundefined;\n```\n\n- A: `0`, `''`, `undefined`\n- B: `0`, `new Number(0)`, `''`, `new Boolean(false)`, `undefined`\n- C: `0`, `''`, `new Boolean(false)`, `undefined`\n- D: All of them are falsy\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: A\n\nThere are 8 falsy values:\n\n- `undefined`\n- `null`\n- `NaN`\n- `false`\n- `''` (empty string)\n- `0`\n- `-0`\n- `0n` (BigInt(0))\n\nFunction constructors, like `new Number` and `new Boolean` are truthy.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 36. What's the output?\n\n```javascript\nconsole.log(typeof typeof 1);\n```\n\n- A: `\"number\"`\n- B: `\"string\"`\n- C: `\"object\"`\n- D: `\"undefined\"`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: B\n\n`typeof 1` returns `\"number\"`.\n`typeof \"number\"` returns `\"string\"`\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 37. What's the output?\n\n```javascript\nconst numbers = [1, 2, 3];\nnumbers[10] = 11;\nconsole.log(numbers);\n```\n\n- A: `[1, 2, 3, null x 7, 11]`\n- B: `[1, 2, 3, 11]`\n- C: `[1, 2, 3, empty x 7, 11]`\n- D: `SyntaxError`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: C\n\nWhen you set a value to an element in an array that exceeds the length of the array, JavaScript creates something called \"empty slots\". These actually have the value of `undefined`, but you will see something like:\n\n`[1, 2, 3, empty x 7, 11]`\n\ndepending on where you run it (it's different for every browser, node, etc.)\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 38. What's the output?\n\n```javascript\n(() => {\n  let x, y;\n  try {\n    throw new Error();\n  } catch (x) {\n    (x = 1), (y = 2);\n    console.log(x);\n  }\n  console.log(x);\n  console.log(y);\n})();\n```\n\n- A: `1` `undefined` `2`\n- B: `undefined` `undefined` `undefined`\n- C: `1` `1` `2`\n- D: `1` `undefined` `undefined`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: A\n\nThe `catch` block receives the argument `x`. This is not the same `x` as the variable when we pass arguments. This variable `x` is block-scoped.\n\nLater, we set this block-scoped variable equal to `1`, and set the value of the variable `y`. Now, we log the block-scoped variable `x`, which is equal to `1`.\n\nOutside of the `catch` block, `x` is still `undefined`, and `y` is `2`. When we want to `console.log(x)` outside of the `catch` block, it returns `undefined`, and `y` returns `2`.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 39. Everything in JavaScript is either a...\n\n- A: primitive or object\n- B: function or object\n- C: trick question! only objects\n- D: number or object\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: A\n\nJavaScript only has primitive types and objects.\n\nPrimitive types are `boolean`, `null`, `undefined`, `bigint`, `number`, `string`, and `symbol`.\n\nWhat differentiates a primitive from an object is that primitives do not have any properties or methods; however, you'll note that `'foo'.toUpperCase()` evaluates to `'FOO'` and does not result in a `TypeError`. This is because when you try to access a property or method on a primitive like a string, JavaScript will implicitly wrap the primitive type using one of the wrapper classes, i.e. `String`, and then immediately discard the wrapper after the expression evaluates. All primitives except for `null` and `undefined` exhibit this behavior.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 40. What's the output?\n\n```javascript\n[[0, 1], [2, 3]].reduce(\n  (acc, cur) => {\n    return acc.concat(cur);\n  },\n  [1, 2],\n);\n```\n\n- A: `[0, 1, 2, 3, 1, 2]`\n- B: `[6, 1, 2]`\n- C: `[1, 2, 0, 1, 2, 3]`\n- D: `[1, 2, 6]`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: C\n\n`[1, 2]` is our initial value. This is the value we start with, and the value of the very first `acc`. During the first round, `acc` is `[1,2]`, and `cur` is `[0, 1]`. We concatenate them, which results in `[1, 2, 0, 1]`.\n\nThen, `[1, 2, 0, 1]` is `acc` and `[2, 3]` is `cur`. We concatenate them, and get `[1, 2, 0, 1, 2, 3]`\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 41. What's the output?\n\n```javascript\n!!null;\n!!'';\n!!1;\n```\n\n- A: `false` `true` `false`\n- B: `false` `false` `true`\n- C: `false` `true` `true`\n- D: `true` `true` `false`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: B\n\n`null` is falsy. `!null` returns `true`. `!true` returns `false`.\n\n`\"\"` is falsy. `!\"\"` returns `true`. `!true` returns `false`.\n\n`1` is truthy. `!1` returns `false`. `!false` returns `true`.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 42. What does the `setInterval` method return in the browser?\n\n```javascript\nsetInterval(() => console.log('Hi'), 1000);\n```\n\n- A: a unique id\n- B: the amount of milliseconds specified\n- C: the passed function\n- D: `undefined`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: A\n\nIt returns a unique id. This id can be used to clear that interval with the `clearInterval()` function.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 43. What does this return?\n\n```javascript\n[...'Lydia'];\n```\n\n- A: `[\"L\", \"y\", \"d\", \"i\", \"a\"]`\n- B: `[\"Lydia\"]`\n- C: `[[], \"Lydia\"]`\n- D: `[[\"L\", \"y\", \"d\", \"i\", \"a\"]]`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: A\n\nA string is an iterable. The spread operator maps every character of an iterable to one element.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 44. What's the output?\n\n```javascript\nfunction* generator(i) {\n  yield i;\n  yield i * 2;\n}\n\nconst gen = generator(10);\n\nconsole.log(gen.next().value);\nconsole.log(gen.next().value);\n```\n\n- A: `[0, 10], [10, 20]`\n- B: `20, 20`\n- C: `10, 20`\n- D: `0, 10 and 10, 20`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: C\n\nRegular functions cannot be stopped mid-way after invocation. However, a generator function can be \"stopped\" midway, and later continue from where it stopped. Every time a generator function encounters a `yield` keyword, the function yields the value specified after it. Note that the generator function in that case doesn’t _return_ the value, it _yields_ the value.\n\nFirst, we initialize the generator function with `i` equal to `10`. We invoke the generator function using the `next()` method. The first time we invoke the generator function, `i` is equal to `10`. It encounters the first `yield` keyword: it yields the value of `i`. The generator is now \"paused\", and `10` gets logged.\n\nThen, we invoke the function again with the `next()` method. It starts to continue where it stopped previously, still with `i` equal to `10`. Now, it encounters the next `yield` keyword, and yields `i * 2`. `i` is equal to `10`, so it returns `10 * 2`, which is `20`. This results in `10, 20`.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 45. What does this return?\n\n```javascript\nconst firstPromise = new Promise((res, rej) => {\n  setTimeout(res, 500, 'one');\n});\n\nconst secondPromise = new Promise((res, rej) => {\n  setTimeout(res, 100, 'two');\n});\n\nPromise.race([firstPromise, secondPromise]).then(res => console.log(res));\n```\n\n- A: `\"one\"`\n- B: `\"two\"`\n- C: `\"two\" \"one\"`\n- D: `\"one\" \"two\"`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: B\n\nWhen we pass multiple promises to the `Promise.race` method, it resolves\u002Frejects the _first_ promise that resolves\u002Frejects. To the `setTimeout` method, we pass a timer: 500ms for the first promise (`firstPromise`), and 100ms for the second promise (`secondPromise`). This means that the `secondPromise` resolves first with the value of `'two'`. `res` now holds the value of `'two'`, which gets logged.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 46. What's the output?\n\n```javascript\nlet person = { name: 'Lydia' };\nconst members = [person];\nperson = null;\n\nconsole.log(members);\n```\n\n- A: `null`\n- B: `[null]`\n- C: `[{}]`\n- D: `[{ name: \"Lydia\" }]`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: D\n\nFirst, we declare a variable `person` with the value of an object that has a `name` property.\n\n\u003Cimg src=\"https:\u002F\u002Fi.imgur.com\u002FTML1MbS.png\" width=\"200\">\n\nThen, we declare a variable called `members`. We set the first element of that array equal to the value of the `person` variable. Objects interact by _reference_ when setting them equal to each other. When you assign a reference from one variable to another, you make a _copy_ of that reference. (note that they don't have the _same_ reference!)\n\n\u003Cimg src=\"https:\u002F\u002Fi.imgur.com\u002FFSG5K3F.png\" width=\"300\">\n\nThen, we set the variable `person` equal to `null`.\n\n\u003Cimg src=\"https:\u002F\u002Fi.imgur.com\u002FsYjcsMT.png\" width=\"300\">\n\nWe are only modifying the value of the `person` variable, and not the first element in the array, since that element has a different (copied) reference to the object. The first element in `members` still holds its reference to the original object. When we log the `members` array, the first element still holds the value of the object, which gets logged.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 47. What's the output?\n\n```javascript\nconst person = {\n  name: 'Lydia',\n  age: 21,\n};\n\nfor (const item in person) {\n  console.log(item);\n}\n```\n\n- A: `{ name: \"Lydia\" }, { age: 21 }`\n- B: `\"name\", \"age\"`\n- C: `\"Lydia\", 21`\n- D: `[\"name\", \"Lydia\"], [\"age\", 21]`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: B\n\nWith a `for-in` loop, we can iterate through object keys, in this case `name` and `age`. Under the hood, object keys are strings (if they're not a Symbol). On every loop, we set the value of `item` equal to the current key it’s iterating over. First, `item` is equal to `name`, and gets logged. Then, `item` is equal to `age`, which gets logged.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 48. What's the output?\n\n```javascript\nconsole.log(3 + 4 + '5');\n```\n\n- A: `\"345\"`\n- B: `\"75\"`\n- C: `12`\n- D: `\"12\"`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: B\n\nOperator associativity is the order in which the compiler evaluates the expressions, either left-to-right or right-to-left. This only happens if all operators have the _same_ precedence. We only have one type of operator: `+`. For addition, the associativity is left-to-right.\n\n`3 + 4` gets evaluated first. This results in the number `7`.\n\n`7 + '5'` results in `\"75\"` because of coercion. JavaScript converts the number `7` into a string, see question 15. We can concatenate two strings using the `+`operator. `\"7\" + \"5\"` results in `\"75\"`.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 49. What's the value of `num`?\n\n```javascript\nconst num = parseInt('7*6', 10);\n```\n\n- A: `42`\n- B: `\"42\"`\n- C: `7`\n- D: `NaN`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: C\n\nOnly the first number in the string is returned. Based on the _radix_ (the second argument in order to specify what type of number we want to parse it to: base 10, hexadecimal, octal, binary, etc.), the `parseInt` checks whether the characters in the string are valid. Once it encounters a character that isn't a valid number in the radix, it stops parsing and ignores the following characters.\n\n`*` is not a valid number. It only parses `\"7\"` into the decimal `7`. `num` now holds the value of `7`.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 50. What's the output?\n\n```javascript\n[1, 2, 3].map(num => {\n  if (typeof num === 'number') return;\n  return num * 2;\n});\n```\n\n- A: `[]`\n- B: `[null, null, null]`\n- C: `[undefined, undefined, undefined]`\n- D: `[ 3 x empty ]`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: C\n\nWhen mapping over the array, the value of `num` is equal to the element it’s currently looping over. In this case, the elements are numbers, so the condition of the if statement `typeof num === \"number\"` returns `true`. The map function creates a new array and inserts the values returned from the function.\n\nHowever, we don’t return a value. When we don’t return a value from the function, the function returns `undefined`. For every element in the array, the function block gets called, so for each element we return `undefined`.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 51. What's the output?\n\n```javascript\nfunction getInfo(member, year) {\n  member.name = 'Lydia';\n  year = '1998';\n}\n\nconst person = { name: 'Sarah' };\nconst birthYear = '1997';\n\ngetInfo(person, birthYear);\n\nconsole.log(person, birthYear);\n```\n\n- A: `{ name: \"Lydia\" }, \"1997\"`\n- B: `{ name: \"Sarah\" }, \"1998\"`\n- C: `{ name: \"Lydia\" }, \"1998\"`\n- D: `{ name: \"Sarah\" }, \"1997\"`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: A\n\nArguments are passed by _value_, unless their value is an object, then they're passed by _reference_. `birthYear` is passed by value, since it's a string, not an object. When we pass arguments by value, a _copy_ of that value is created (see question 46).\n\nThe variable `birthYear` has a reference to the value `\"1997\"`. The argument `year` also has a reference to the value `\"1997\"`, but it's not the same value as `birthYear` has a reference to. When we update the value of `year` by setting `year` equal to `\"1998\"`, we are only updating the value of `year`. `birthYear` is still equal to `\"1997\"`.\n\nThe value of `person` is an object. The argument `member` has a (copied) reference to the _same_ object. When we modify a property of the object `member` has a reference to, the value of `person` will also be modified, since they both have a reference to the same object. `person`'s `name` property is now equal to the value `\"Lydia\"`\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 52. What's the output?\n\n```javascript\nfunction greeting() {\n  throw 'Hello world!';\n}\n\nfunction sayHi() {\n  try {\n    const data = greeting();\n    console.log('It worked!', data);\n  } catch (e) {\n    console.log('Oh no an error:', e);\n  }\n}\n\nsayHi();\n```\n\n- A: `It worked! Hello world!`\n- B: `Oh no an error: undefined`\n- C: `SyntaxError: can only throw Error objects`\n- D: `Oh no an error: Hello world!`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: D\n\nWith the `throw` statement, we can create custom errors. With this statement, you can throw exceptions. An exception can be a \u003Cb>string\u003C\u002Fb>, a \u003Cb>number\u003C\u002Fb>, a \u003Cb>boolean\u003C\u002Fb> or an \u003Cb>object\u003C\u002Fb>. In this case, our exception is the string `'Hello world!'`.\n\nWith the `catch` statement, we can specify what to do if an exception is thrown in the `try` block. An exception is thrown: the string `'Hello world!'`. `e` is now equal to that string, which we log. This results in `'Oh an error: Hello world!'`.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 53. What's the output?\n\n```javascript\nfunction Car() {\n  this.make = 'Lamborghini';\n  return { make: 'Maserati' };\n}\n\nconst myCar = new Car();\nconsole.log(myCar.make);\n```\n\n- A: `\"Lamborghini\"`\n- B: `\"Maserati\"`\n- C: `ReferenceError`\n- D: `TypeError`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: B\n\nWhen a constructor function is called with the `new` keyword, it creates an object and sets the `this` keyword to refer to that object. By default, if the constructor function doesn't explicitly return anything, it will return the newly created object.\n\nIn this case, the constructor function `Car` explicitly returns a new object with `make` set to `\"Maserati\"`, which overrides the default behavior. Therefore, when `new Car()` is called, the _returned_ object is assigned to `myCar`, resulting in the output being `\"Maserati\"` when `myCar.make` is accessed.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 54. What's the output?\n\n```javascript\n(() => {\n  let x = (y = 10);\n})();\n\nconsole.log(typeof x);\nconsole.log(typeof y);\n```\n\n- A: `\"undefined\", \"number\"`\n- B: `\"number\", \"number\"`\n- C: `\"object\", \"number\"`\n- D: `\"number\", \"undefined\"`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: A\n\n`let x = (y = 10);` is actually shorthand for:\n\n```javascript\ny = 10;\nlet x = y;\n```\n\nWhen we set `y` equal to `10`, we actually add a property `y` to the global object (`window` in the browser, `global` in Node). In a browser, `window.y` is now equal to `10`.\n\nThen, we declare a variable `x` with the value of `y`, which is `10`. Variables declared with the `let` keyword are _block scoped_, they are only defined within the block they're declared in; the immediately invoked function expression (IIFE) in this case. When we use the `typeof` operator, the operand `x` is not defined: we are trying to access `x` outside of the block it's declared in. This means that `x` is not defined. Values who haven't been assigned a value or declared are of type `\"undefined\"`. `console.log(typeof x)` returns `\"undefined\"`.\n\nHowever, we created a global variable `y` when setting `y` equal to `10`. This value is accessible anywhere in our code. `y` is defined, and holds a value of type `\"number\"`. `console.log(typeof y)` returns `\"number\"`.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 55. What's the output?\n\n```javascript\nclass Dog {\n  constructor(name) {\n    this.name = name;\n  }\n}\n\nDog.prototype.bark = function() {\n  console.log(`Woof I am ${this.name}`);\n};\n\nconst pet = new Dog('Mara');\n\npet.bark();\n\ndelete Dog.prototype.bark;\n\npet.bark();\n```\n\n- A: `\"Woof I am Mara\"`, `TypeError`\n- B: `\"Woof I am Mara\"`, `\"Woof I am Mara\"`\n- C: `\"Woof I am Mara\"`, `undefined`\n- D: `TypeError`, `TypeError`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: A\n\nWe can delete properties from objects using the `delete` keyword, also on the prototype. By deleting a property on the prototype, it is not available anymore in the prototype chain. In this case, the `bark` function is not available anymore on the prototype after `delete Dog.prototype.bark`, yet we still try to access it.\n\nWhen we try to invoke something that is not a function, a `TypeError` is thrown. In this case `TypeError: pet.bark is not a function`, since `pet.bark` is `undefined`.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 56. What's the output?\n\n```javascript\nconst set = new Set([1, 1, 2, 3, 4]);\n\nconsole.log(set);\n```\n\n- A: `[1, 1, 2, 3, 4]`\n- B: `[1, 2, 3, 4]`\n- C: `{1, 1, 2, 3, 4}`\n- D: `{1, 2, 3, 4}`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: D\n\nThe `Set` object is a collection of _unique_ values: a value can only occur once in a set.\n\nWe passed the iterable `[1, 1, 2, 3, 4]` with a duplicate value `1`. Since we cannot have two of the same values in a set, one of them is removed. This results in `{1, 2, 3, 4}`.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 57. What's the output?\n\n```javascript\n\u002F\u002F counter.js\nlet counter = 10;\nexport default counter;\n```\n\n```javascript\n\u002F\u002F index.js\nimport myCounter from '.\u002Fcounter';\n\nmyCounter += 1;\n\nconsole.log(myCounter);\n```\n\n- A: `10`\n- B: `11`\n- C: `Error`\n- D: `NaN`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: C\n\nAn imported module is _read-only_: you cannot modify the imported module. Only the module that exports them can change its value.\n\nWhen we try to increment the value of `myCounter`, it throws an error: `myCounter` is read-only and cannot be modified.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 58. What's the output?\n\n```javascript\nconst name = 'Lydia';\nage = 21;\n\nconsole.log(delete name);\nconsole.log(delete age);\n```\n\n- A: `false`, `true`\n- B: `\"Lydia\"`, `21`\n- C: `true`, `true`\n- D: `undefined`, `undefined`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: A\n\nThe `delete` operator returns a boolean value: `true` on a successful deletion, else it'll return `false`. However, variables declared with the `var`, `const`, or `let` keywords cannot be deleted using the `delete` operator.\n\nThe `name` variable was declared with a `const` keyword, so its deletion is not successful: `false` is returned. When we set `age` equal to `21`, we actually added a property called `age` to the global object. You can successfully delete properties from objects this way, also the global object, so `delete age` returns `true`.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 59. What's the output?\n\n```javascript\nconst numbers = [1, 2, 3, 4, 5];\nconst [y] = numbers;\n\nconsole.log(y);\n```\n\n- A: `[[1, 2, 3, 4, 5]]`\n- B: `[1, 2, 3, 4, 5]`\n- C: `1`\n- D: `[1]`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: C\n\nWe can unpack values from arrays or properties from objects through destructuring. For example:\n\n```javascript\n[a, b] = [1, 2];\n```\n\n\u003Cimg src=\"https:\u002F\u002Fi.imgur.com\u002FADFpVop.png\" width=\"200\">\n\nThe value of `a` is now `1`, and the value of `b` is now `2`. What we actually did in the question, is:\n\n```javascript\n[y] = [1, 2, 3, 4, 5];\n```\n\n\u003Cimg src=\"https:\u002F\u002Fi.imgur.com\u002FNzGkMNk.png\" width=\"200\">\n\nThis means that the value of `y` is equal to the first value in the array, which is the number `1`. When we log `y`, `1` is returned.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 60. What's the output?\n\n```javascript\nconst user = { name: 'Lydia', age: 21 };\nconst admin = { admin: true, ...user };\n\nconsole.log(admin);\n```\n\n- A: `{ admin: true, user: { name: \"Lydia\", age: 21 } }`\n- B: `{ admin: true, name: \"Lydia\", age: 21 }`\n- C: `{ admin: true, user: [\"Lydia\", 21] }`\n- D: `{ admin: true }`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: B\n\nIt's possible to combine objects using the spread operator `...`. It lets you create copies of the key\u002Fvalue pairs of one object, and add them to another object. In this case, we create copies of the `user` object, and add them to the `admin` object. The `admin` object now contains the copied key\u002Fvalue pairs, which results in `{ admin: true, name: \"Lydia\", age: 21 }`.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 61. What's the output?\n\n```javascript\nconst person = { name: 'Lydia' };\n\nObject.defineProperty(person, 'age', { value: 21 });\n\nconsole.log(person);\nconsole.log(Object.keys(person));\n```\n\n- A: `{ name: \"Lydia\", age: 21 }`, `[\"name\", \"age\"]`\n- B: `{ name: \"Lydia\", age: 21 }`, `[\"name\"]`\n- C: `{ name: \"Lydia\"}`, `[\"name\", \"age\"]`\n- D: `{ name: \"Lydia\"}`, `[\"age\"]`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: B\n\nWith the `defineProperty` method, we can add new properties to an object, or modify existing ones. When we add a property to an object using the `defineProperty` method, they are by default _not enumerable_. The `Object.keys` method returns all _enumerable_ property names from an object, in this case only `\"name\"`.\n\nProperties added using the `defineProperty` method are immutable by default. You can override this behavior using the `writable`, `configurable` and `enumerable` properties. This way, the `defineProperty` method gives you a lot more control over the properties you're adding to an object.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 62. What's the output?\n\n```javascript\nconst settings = {\n  username: 'lydiahallie',\n  level: 19,\n  health: 90,\n};\n\nconst data = JSON.stringify(settings, ['level', 'health']);\nconsole.log(data);\n```\n\n- A: `\"{\"level\":19, \"health\":90}\"`\n- B: `\"{\"username\": \"lydiahallie\"}\"`\n- C: `\"[\"level\", \"health\"]\"`\n- D: `\"{\"username\": \"lydiahallie\", \"level\":19, \"health\":90}\"`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: A\n\nThe second argument of `JSON.stringify` is the _replacer_. The replacer can either be a function or an array, and lets you control what and how the values should be stringified.\n\nIf the replacer is an _array_, only the property names included in the array will be added to the JSON string. In this case, only the properties with the names `\"level\"` and `\"health\"` are included, `\"username\"` is excluded. `data` is now equal to `\"{\"level\":19, \"health\":90}\"`.\n\nIf the replacer is a _function_, this function gets called on every property in the object you're stringifying. The value returned from this function will be the value of the property when it's added to the JSON string. If the value is `undefined`, this property is excluded from the JSON string.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 63. What's the output?\n\n```javascript\nlet num = 10;\n\nconst increaseNumber = () => num++;\nconst increasePassedNumber = number => number++;\n\nconst num1 = increaseNumber();\nconst num2 = increasePassedNumber(num1);\n\nconsole.log(num1);\nconsole.log(num2);\n```\n\n- A: `10`, `10`\n- B: `10`, `11`\n- C: `11`, `11`\n- D: `11`, `12`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: A\n\nThe unary operator `++` _first returns_ the value of the operand, _then increments_ the value of the operand. The value of `num1` is `10`, since the `increaseNumber` function first returns the value of `num`, which is `10`, and only increments the value of `num` afterward.\n\n`num2` is `10`, since we passed `num1` to the `increasePassedNumber`. `number` is equal to `10`(the value of `num1`). Again, the unary operator `++` _first returns_ the value of the operand, _then increments_ the value of the operand. The value of `number` is `10`, so `num2` is equal to `10`.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 64. What's the output?\n\n```javascript\nconst value = { number: 10 };\n\nconst multiply = (x = { ...value }) => {\n  console.log((x.number *= 2));\n};\n\nmultiply();\nmultiply();\nmultiply(value);\nmultiply(value);\n```\n\n- A: `20`, `40`, `80`, `160`\n- B: `20`, `40`, `20`, `40`\n- C: `20`, `20`, `20`, `40`\n- D: `NaN`, `NaN`, `20`, `40`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: C\n\nIn ES6, we can initialize parameters with a default value. The value of the parameter will be the default value, if no other value has been passed to the function, or if the value of the parameter is `\"undefined\"`. In this case, we spread the properties of the `value` object into a new object, so `x` has the default value of `{ number: 10 }`.\n\nThe default argument is evaluated at _call time_! Every time we call the function, a _new_ object is created. We invoke the `multiply` function the first two times without passing a value: `x` has the default value of `{ number: 10 }`. We then log the multiplied value of that number, which is `20`.\n\nThe third time we invoke multiply, we do pass an argument: the object called `value`. The `*=` operator is actually shorthand for `x.number = x.number * 2`: we modify the value of `x.number`, and log the multiplied value `20`.\n\nThe fourth time, we pass the `value` object again. `x.number` was previously modified to `20`, so `x.number *= 2` logs `40`.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 65. What's the output?\n\n```javascript\n[1, 2, 3, 4].reduce((x, y) => console.log(x, y));\n```\n\n- A: `1` `2` and `3` `3` and `6` `4`\n- B: `1` `2` and `2` `3` and `3` `4`\n- C: `1` `undefined` and `2` `undefined` and `3` `undefined` and `4` `undefined`\n- D: `1` `2` and `undefined` `3` and `undefined` `4`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: D\n\nThe first argument that the `reduce` method receives is the _accumulator_, `x` in this case. The second argument is the _current value_, `y`. With the reduce method, we execute a callback function on every element in the array, which could ultimately result in one single value.\n\nIn this example, we are not returning any values, we are simply logging the values of the accumulator and the current value.\n\nThe value of the accumulator is equal to the previously returned value of the callback function. If you don't pass the optional `initialValue` argument to the `reduce` method, the accumulator is equal to the first element on the first call.\n\nOn the first call, the accumulator (`x`) is `1`, and the current value (`y`) is `2`. We don't return from the callback function, we log the accumulator, and the current values: `1` and `2` get logged.\n\nIf you don't return a value from a function, it returns `undefined`. On the next call, the accumulator is `undefined`, and the current value is `3`. `undefined` and `3` get logged.\n\nOn the fourth call, we again don't return from the callback function. The accumulator is again `undefined`, and the current value is `4`. `undefined` and `4` get logged.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n  \n---\n\n###### 66. With which constructor can we successfully extend the `Dog` class?\n\n```javascript\nclass Dog {\n  constructor(name) {\n    this.name = name;\n  }\n};\n\nclass Labrador extends Dog {\n  \u002F\u002F 1\n  constructor(name, size) {\n    this.size = size;\n  }\n  \u002F\u002F 2\n  constructor(name, size) {\n    super(name);\n    this.size = size;\n  }\n  \u002F\u002F 3\n  constructor(size) {\n    super(name);\n    this.size = size;\n  }\n  \u002F\u002F 4\n  constructor(name, size) {\n    this.name = name;\n    this.size = size;\n  }\n\n};\n```\n\n- A: 1\n- B: 2\n- C: 3\n- D: 4\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: B\n\nIn a derived class, you cannot access the `this` keyword before calling `super`. If you try to do that, it will throw a ReferenceError: 1 and 4 would throw a reference error.\n\nWith the `super` keyword, we call that parent class's constructor with the given arguments. The parent's constructor receives the `name` argument, so we need to pass `name` to `super`.\n\nThe `Labrador` class receives two arguments, `name` since it extends `Dog`, and `size` as an extra property on the `Labrador` class. They both need to be passed to the constructor function on `Labrador`, which is done correctly using constructor 2.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 67. What's the output?\n\n```javascript\n\u002F\u002F index.js\nconsole.log('running index.js');\nimport { sum } from '.\u002Fsum.js';\nconsole.log(sum(1, 2));\n\n\u002F\u002F sum.js\nconsole.log('running sum.js');\nexport const sum = (a, b) => a + b;\n```\n\n- A: `running index.js`, `running sum.js`, `3`\n- B: `running sum.js`, `running index.js`, `3`\n- C: `running sum.js`, `3`, `running index.js`\n- D: `running index.js`, `undefined`, `running sum.js`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: B\n\nWith the `import` keyword, all imported modules are _pre-parsed_. This means that the imported modules get run _first_, and the code in the file that imports the module gets executed _after_.\n\nThis is a difference between `require()` in CommonJS and `import`! With `require()`, you can load dependencies on demand while the code is being run. If we had used `require` instead of `import`, `running index.js`, `running sum.js`, `3` would have been logged to the console.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 68. What's the output?\n\n```javascript\nconsole.log(Number(2) === Number(2));\nconsole.log(Boolean(false) === Boolean(false));\nconsole.log(Symbol('foo') === Symbol('foo'));\n```\n\n- A: `true`, `true`, `false`\n- B: `false`, `true`, `false`\n- C: `true`, `false`, `true`\n- D: `true`, `true`, `true`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: A\n\nEvery Symbol is entirely unique. The purpose of the argument passed to the Symbol is to give the Symbol a description. The value of the Symbol is not dependent on the passed argument. As we test equality, we are creating two entirely new symbols: the first `Symbol('foo')`, and the second `Symbol('foo')`. These two values are unique and not equal to each other, `Symbol('foo') === Symbol('foo')` returns `false`.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 69. What's the output?\n\n```javascript\nconst name = 'Lydia Hallie';\nconsole.log(name.padStart(13));\nconsole.log(name.padStart(2));\n```\n\n- A: `\"Lydia Hallie\"`, `\"Lydia Hallie\"`\n- B: `\" Lydia Hallie\"`, `\" Lydia Hallie\"` (`\"[13x whitespace]Lydia Hallie\"`, `\"[2x whitespace]Lydia Hallie\"`)\n- C: `\" Lydia Hallie\"`, `\"Lydia Hallie\"` (`\"[1x whitespace]Lydia Hallie\"`, `\"Lydia Hallie\"`)\n- D: `\"Lydia Hallie\"`, `\"Lyd\"`,\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: C\n\nWith the `padStart` method, we can add padding to the beginning of a string. The value passed to this method is the _total_ length of the string together with the padding. The string `\"Lydia Hallie\"` has a length of `12`. `name.padStart(13)` inserts 1 space at the start of the string, because 12 + 1 is 13.\n\nIf the argument passed to the `padStart` method is smaller than the length of the array, no padding will be added.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 70. What's the output?\n\n```javascript\nconsole.log('🥑' + '💻');\n```\n\n- A: `\"🥑💻\"`\n- B: `257548`\n- C: A string containing their code points\n- D: Error\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: A\n\nWith the `+` operator, you can concatenate strings. In this case, we are concatenating the string `\"🥑\"` with the string `\"💻\"`, resulting in `\"🥑💻\"`.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 71. How can we log the values that are commented out after the console.log statement?\n\n```javascript\nfunction* startGame() {\n  const answer = yield 'Do you love JavaScript?';\n  if (answer !== 'Yes') {\n    return \"Oh wow... Guess we're done here\";\n  }\n  return 'JavaScript loves you back ❤️';\n}\n\nconst game = startGame();\nconsole.log(\u002F* 1 *\u002F); \u002F\u002F Do you love JavaScript?\nconsole.log(\u002F* 2 *\u002F); \u002F\u002F JavaScript loves you back ❤️\n```\n\n- A: `game.next(\"Yes\").value` and `game.next().value`\n- B: `game.next.value(\"Yes\")` and `game.next.value()`\n- C: `game.next().value` and `game.next(\"Yes\").value`\n- D: `game.next.value()` and `game.next.value(\"Yes\")`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: C\n\nA generator function \"pauses\" its execution when it sees the `yield` keyword. First, we have to let the function yield the string \"Do you love JavaScript?\", which can be done by calling `game.next().value`.\n\nEvery line is executed, until it finds the first `yield` keyword. There is a `yield` keyword on the first line within the function: the execution stops with the first yield! _This means that the variable `answer` is not defined yet!_\n\nWhen we call `game.next(\"Yes\").value`, the previous `yield` is replaced with the value of the parameters passed to the `next()` function, `\"Yes\"` in this case. The value of the variable `answer` is now equal to `\"Yes\"`. The condition of the if-statement returns `false`, and `JavaScript loves you back ❤️` gets logged.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 72. What's the output?\n\n```javascript\nconsole.log(String.raw`Hello\\nworld`);\n```\n\n- A: `Hello world!`\n- B: `Hello` \u003Cbr \u002F>     `world`\n- C: `Hello\\nworld`\n- D: `Hello\\n` \u003Cbr \u002F>      `world`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: C\n\n`String.raw` returns a string where the escapes (`\\n`, `\\v`, `\\t` etc.) are ignored! Backslashes can be an issue since you could end up with something like:\n\n`` const path = `C:\\Documents\\Projects\\table.html` ``\n\nWhich would result in:\n\n`\"C:DocumentsProjects able.html\"`\n\nWith `String.raw`, it would simply ignore the escape and print:\n\n`C:\\Documents\\Projects\\table.html`\n\nIn this case, the string is `Hello\\nworld`, which gets logged.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 73. What's the output?\n\n```javascript\nasync function getData() {\n  return await Promise.resolve('I made it!');\n}\n\nconst data = getData();\nconsole.log(data);\n```\n\n- A: `\"I made it!\"`\n- B: `Promise {\u003Cresolved>: \"I made it!\"}`\n- C: `Promise {\u003Cpending>}`\n- D: `undefined`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: C\n\nAn async function always returns a promise. The `await` still has to wait for the promise to resolve: a pending promise gets returned when we call `getData()` in order to set `data` equal to it.\n\nIf we wanted to get access to the resolved value `\"I made it\"`, we could have used the `.then()` method on `data`:\n\n`data.then(res => console.log(res))`\n\nThis would've logged `\"I made it!\"`\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 74. What's the output?\n\n```javascript\nfunction addToList(item, list) {\n  return list.push(item);\n}\n\nconst result = addToList('apple', ['banana']);\nconsole.log(result);\n```\n\n- A: `['apple', 'banana']`\n- B: `2`\n- C: `true`\n- D: `undefined`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: B\n\nThe `.push()` method returns the _length_ of the new array! Previously, the array contained one element (the string `\"banana\"`) and had a length of `1`. After adding the string `\"apple\"` to the array, the array contains two elements, and has a length of `2`. This gets returned from the `addToList` function.\n\nThe `push` method modifies the original array. If you wanted to return the _array_ from the function rather than the _length of the array_, you should have returned `list` after pushing `item` to it.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 75. What's the output?\n\n```javascript\nconst box = { x: 10, y: 20 };\n\nObject.freeze(box);\n\nconst shape = box;\nshape.x = 100;\n\nconsole.log(shape);\n```\n\n- A: `{ x: 100, y: 20 }`\n- B: `{ x: 10, y: 20 }`\n- C: `{ x: 100 }`\n- D: `ReferenceError`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: B\n\n`Object.freeze` makes it impossible to add, remove, or modify properties of an object (unless the property's value is another object).\n\nWhen we create the variable `shape` and set it equal to the frozen object `box`, `shape` also refers to a frozen object. You can check whether an object is frozen by using `Object.isFrozen`. In this case, `Object.isFrozen(shape)` would return true, since the variable `shape` has a reference to a frozen object.\n\nSince `shape` is frozen, and since the value of `x` is not an object, we cannot modify the property `x`. `x` is still equal to `10`, and `{ x: 10, y: 20 }` gets logged.\n\n\u003C\u002Fp>\n\u003C\u002Fdetails>\n\n---\n\n###### 76. What's the output?\n\n```javascript\nconst { firstName: myName } = { firstName: 'Lydia' };\n\nconsole.log(firstName);\n```\n\n- A: `\"Lydia\"`\n- B: `\"myName\"`\n- C: `undefined`\n- D: `ReferenceError`\n\n\u003Cdetails>\u003Csummary>\u003Cb>Answer\u003C\u002Fb>\u003C\u002Fsummary>\n\u003Cp>\n\n#### Answer: D\n\nBy using [destructuring assignment](https:\u002F\u002Fdeveloper.mozilla.org\u002Fen-US\u002Fdocs\u002FWeb\u002FJavaScript\u002FReference\u002FOperators\u002FDestructuring_assignment) syntax we can unpack values from arrays, or properties from objects, into distinct variables:\n\n```javascript\nconst { firstName } = { firstName: 'Lydia' };\n\u002F\u002F ES5 version:\n\u002F\u002F var firstName = { firstName: 'Lydia' }.firstName;\n\nconsole.log(firstName); \u002F\u002F \"Lydia\"\n```\n\nAlso, a property can be unpacked from an object and assigned to a variable with a different name than the object property:\n\n```javascript\nconst { firstName: myName } = { firstName: 'Lydia' };\n\u002F\u002F ES5 version:\n\u002F\u002F var myName = { firstName: 'Lydia' }.firstName;\n\nconsole.log(myName); \u002F\u002F \"Lydia\"\nconsole.log(firstName); \u002F\u002F Uncaught ReferenceError: firstName is not defined\n```\n\nTherefore, `firstName` does not exist as a variable, thus attempting to access its value will raise a `ReferenceError`.\n\n**Note:** Be aware of the `global scope` properties:\n\n```javascript\nconst { name: myName } = { name: 'Lydia' };\n\nconsole.log(myName); \u002F\u002F \"lydia\"\nconsole.log(name); \u002F\u002F \"\" ----- Browser e.g. Chrome\nconsole.log(name); \u002F\u002F ReferenceError: name is not defined  ----- NodeJS\n\n```\n\nWhenever Javascript is unable to find a variable within the _current scope_, it climbs up the [Scope chain](https:\u002F\u002Fgithub.com\u002Fgetify\u002FYou-Dont-Know-JS\u002Fblob\u002F2nd-ed\u002Fscope-closures\u002Fch3.md) and searches for it and ","该项目是一个包含大量（高级）JavaScript问题及其解释的列表，旨在帮助开发者测试和提升他们的JavaScript知识。核心功能包括从基础到高级的各种JavaScript问题，并附有详细的解答说明，所有答案都隐藏在可展开的部分中，便于学习者自我检测。技术特点上，项目基于2019年的JavaScript语法和行为，尽管未覆盖最新的语言特性，但仍为准备编码面试或复习JavaScript提供了宝贵的资源。适合场景包括个人自学、面试准备以及作为教学材料使用。",2,"2026-06-11 02:36:13","top_all"]