{"componentChunkName":"component---node-modules-rocketseat-gatsby-theme-docs-core-src-templates-docs-query-js","path":"/advanced-js/objects","result":{"data":{"mdx":{"id":"3beefee7-d349-5218-bf82-b0ff8fafc2e9","excerpt":"Objects in depth In the same way that functions abstract processes, objects abstract data. Objects can contain many values, and they are written as  property…","fields":{"slug":"/advanced-js/objects/"},"frontmatter":{"title":"","description":null,"image":null,"disableTableOfContents":null},"body":"function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }\n\nfunction _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\n/* @jsxRuntime classic */\n\n/* @jsx mdx */\nvar _frontmatter = {};\nvar layoutProps = {\n  _frontmatter: _frontmatter\n};\nvar MDXLayout = \"wrapper\";\nreturn function MDXContent(_ref) {\n  var components = _ref.components,\n      props = _objectWithoutProperties(_ref, [\"components\"]);\n\n  return mdx(MDXLayout, _extends({}, layoutProps, props, {\n    components: components,\n    mdxType: \"MDXLayout\"\n  }), mdx(\"h1\", {\n    \"id\": \"objects-in-depth\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h1\",\n    \"href\": \"#objects-in-depth\",\n    \"aria-label\": \"objects in depth permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), \"Objects in depth\"), mdx(\"p\", null, \"In the same way that functions abstract processes, objects abstract data. Objects can contain many values, and they are written as\\xA0\", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"property: value\"), \"\\xA0pairs.\"), mdx(\"p\", null, \"Let's see again how to define a simple object:\"), mdx(\"pre\", null, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-jsx\"\n  }, \"const p = {\\n    firstName: 'Ned',\\n    lastName: 'Stark',\\n    age: 40,\\n    isActive: false\\n};\\n\")), mdx(\"blockquote\", null, mdx(\"p\", {\n    parentName: \"blockquote\"\n  }, \"To access a property of an object we can use \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"http://p.name/\"\n  }, \"p.name\"), \" or p\", \"['firstName']\", \". We can also loop over the properties with for (x in p) { ... }.\")), mdx(\"p\", null, \"We already saw objects in the course. Now we are going to see some more advanced material related to them.\"), mdx(\"h3\", {\n    \"id\": \"the-this-keyword\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h3\",\n    \"href\": \"#the-this-keyword\",\n    \"aria-label\": \"the this keyword permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), \"The \", mdx(\"inlineCode\", {\n    parentName: \"h3\"\n  }, \"this\"), \" keyword\"), mdx(\"p\", null, \"Objects can contain any kind of values, and in particular they can contain functions. The functions defined inside an object are normally called\\xA0\", mdx(\"em\", {\n    parentName: \"p\"\n  }, \"object methods\"), \".\"), mdx(\"p\", null, \"Let's try to create a method that returns the full name:\"), mdx(\"pre\", null, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-jsx\"\n  }, \"const p = {\\n    firstName: 'Ned',\\n    lastName: 'Stark',\\n    fullName: function() { return this.firstName + ' ' + this.lastName; },\\n    age: 40,\\n    isActive: true\\n};\\n\")), mdx(\"p\", null, \"By using\\xA0\", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"this\"), \"\\xA0we are able to make the function defined inside the object to refer to other properties of the object.\"), mdx(\"p\", null, \"\\uD83D\\uDCD6 \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"https://web.dev/javascript-this/\"\n  }, \"Javascript: What is the meaning of this?\")), mdx(\"p\", null, \"\\uD83D\\uDCD6 \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"https://www.freecodecamp.org/news/javascript-this-keyword-binding-rules/\"\n  }, \"The JavaScript \", mdx(\"inlineCode\", {\n    parentName: \"a\"\n  }, \"this\"), \" Keyword + 5 Key Binding Rules Explained for JS Beginners\")), mdx(\"h3\", {\n    \"id\": \"constructor\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h3\",\n    \"href\": \"#constructor\",\n    \"aria-label\": \"constructor permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), \"Constructor\"), mdx(\"p\", null, \"If we are going to create many objects with a similar structure, we can define an object type. For example, suppose you want to create an object type for cars. You want this type of object to be called Car, and you want it to have properties for make, model, and year. To do this, you would write the following function:\"), mdx(\"pre\", null, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-jsx\"\n  }, \"function Car(make, model, year) {\\n  this.make = make;\\n  this.model = model;\\n  this.year = year;\\n}\\n\")), mdx(\"p\", null, \"Notice the use of\\xA0\", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"this\"), \"\\xA0to assign values to the object's properties based on the values passed to the function.\"), mdx(\"p\", null, \"Now you can create an object called mycar as follows:\"), mdx(\"pre\", null, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-jsx\"\n  }, \"var mycar = new Car('Eagle', 'Talon TSi', 1993);\\n\")), mdx(\"p\", null, \"This statement creates\\xA0\", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"mycar\"), \"\\xA0and assigns it the specified values for its properties. Then the value of\\xA0\", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"mycar.make\"), \"\\xA0is the string\\xA0\", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"\\\"Eagle\\\"\"), \",\\xA0\", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"mycar.year\"), \"\\xA0is the integer 1993, and so on.\"), mdx(\"p\", null, \"You can create any number of Car objects by calls to new. For example,\"), mdx(\"pre\", null, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-jsx\"\n  }, \"var kenscar = new Car('Nissan', '300ZX', 1992);\\nvar vpgscar = new Car('Mazda', 'Miata', 1990);\\n\")), mdx(\"p\", null, \"\\uD83D\\uDCD6 \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"https://www.educative.io/edpresso/what-is-a-constructor-in-javascript\"\n  }, \"What is a constructor in JavaScript?\")), mdx(\"p\", null, \"\\uD83D\\uDCD6 \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"https://css-tricks.com/understanding-javascript-constructors/\"\n  }, \"Understanding Javascript constructors\")), mdx(\"p\", null, \"\\uD83D\\uDCD6 \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"https://www.oreilly.com/library/view/learning-javascript-design/9781449334840/ch09s01.html\"\n  }, \"The constructor pattern\")), mdx(\"p\", null, \"\\uD83D\\uDCD6 \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"https://dmitripavlutin.com/understanding-constructor-property/\"\n  }, \"Inheritance in Javascript: Understanding the constructor Property\")), mdx(\"h3\", {\n    \"id\": \"spread-syntax\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h3\",\n    \"href\": \"#spread-syntax\",\n    \"aria-label\": \"spread syntax permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), \"Spread syntax\"), mdx(\"p\", null, \"We can use the so-called spread syntax (\", mdx(\"inlineCode\", {\n    parentName: \"p\"\n  }, \"...\"), \") for various purposes.\"), mdx(\"blockquote\", null, mdx(\"p\", {\n    parentName: \"blockquote\"\n  }, \"You can find a detailed reference in \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_syntax\"\n  }, \"MDN-Spread syntax\"), \", but we will mention briefly the different uses here.\")), mdx(\"h3\", {\n    \"id\": \"destructuring\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h3\",\n    \"href\": \"#destructuring\",\n    \"aria-label\": \"destructuring permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), \"Destructuring\"), mdx(\"p\", null, \"For function calls:\"), mdx(\"pre\", null, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-jsx\"\n  }, \"myFunction(...iterableObj);\\n\")), mdx(\"p\", null, \"For array literals or strings:\"), mdx(\"pre\", null, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-jsx\"\n  }, \"[...iterableObj, '4', 'five', 6];\\n\")), mdx(\"p\", null, \"For object literals:\"), mdx(\"pre\", null, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-jsx\"\n  }, \"let objClone = { ...obj };\\n\")), mdx(\"blockquote\", null, mdx(\"p\", {\n    parentName: \"blockquote\"\n  }, \"More details in \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment\"\n  }, \"MDN-Destructuring\"), \".\")), mdx(\"h3\", {\n    \"id\": \"assignment\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h3\",\n    \"href\": \"#assignment\",\n    \"aria-label\": \"assignment permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), \"Assignment\"), mdx(\"pre\", null, mdx(\"code\", {\n    parentName: \"pre\",\n    \"className\": \"language-jsx\"\n  }, \"[a, b] = [10, 20];\\n\\nconsole.log(a);  // 10\\nconsole.log(b);  // 20\\n\\n[a, b, ...rest] = [10, 20, 30, 40, 50];\\n\\nconsole.log(rest);  // [30, 40, 50]\\n\")), mdx(\"p\", null, \"\\uD83D\\uDCD6 \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"https://careerkarma.com/blog/javascript-spread-operator/\"\n  }, \"JavaScript Spread Operator: A Guide\")), mdx(\"p\", null, \"\\uD83D\\uDCD6 \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"https://www.samanthaming.com/tidbits/92-6-use-cases-of-spread-with-array/\"\n  }, \"6 Use Case of Spread with Array in JavaScript\")), mdx(\"p\", null, \"\\uD83D\\uDCD6 \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"https://dev.to/sheraz/spread-operator-vs-rest-operator-parameters-13gc\"\n  }, \"Spread operator vs Rest Operator (Parameters)\")), mdx(\"h2\", {\n    \"id\": \"exercises\",\n    \"style\": {\n      \"position\": \"relative\"\n    }\n  }, mdx(\"a\", {\n    parentName: \"h2\",\n    \"href\": \"#exercises\",\n    \"aria-label\": \"exercises permalink\",\n    \"className\": \"anchor before\"\n  }, mdx(\"svg\", {\n    parentName: \"a\",\n    \"aria-hidden\": \"true\",\n    \"focusable\": \"false\",\n    \"height\": \"16\",\n    \"version\": \"1.1\",\n    \"viewBox\": \"0 0 16 16\",\n    \"width\": \"16\"\n  }, mdx(\"path\", {\n    parentName: \"svg\",\n    \"fillRule\": \"evenodd\",\n    \"d\": \"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z\"\n  }))), \"Exercises\"), mdx(\"ol\", null, mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"a\", {\n    parentName: \"li\",\n    \"href\": \"https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures/object-oriented-programming/create-a-basic-javascript-object\"\n  }, \"Create a Basic JavaScript Object\")), mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"a\", {\n    parentName: \"li\",\n    \"href\": \"https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures/object-oriented-programming/use-dot-notation-to-access-the-properties-of-an-object\"\n  }, \"Use Dot Notation to Access the Properties of an Object\")), mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"a\", {\n    parentName: \"li\",\n    \"href\": \"https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures/object-oriented-programming/make-code-more-reusable-with-the-this-keyword\"\n  }, \"Make Code More Reusable with the this Keyword\")), mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"a\", {\n    parentName: \"li\",\n    \"href\": \"https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures/object-oriented-programming/define-a-constructor-function\"\n  }, \"Define a Constructor Function\")), mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"a\", {\n    parentName: \"li\",\n    \"href\": \"https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures/object-oriented-programming/use-a-constructor-to-create-objects\"\n  }, \"Use a Constructor to Create Objects\")), mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"a\", {\n    parentName: \"li\",\n    \"href\": \"https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures/object-oriented-programming/understand-the-constructor-property\"\n  }, \"Understand the Constructor Property\")), mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"a\", {\n    parentName: \"li\",\n    \"href\": \"https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures/object-oriented-programming/use-closure-to-protect-properties-within-an-object-from-being-modified-externally\"\n  }, \"Use Closure to Protect Properties Within an Object from Being Modified Externally\")), mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"a\", {\n    parentName: \"li\",\n    \"href\": \"https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures/es6/use-the-rest-parameter-with-function-parameters\"\n  }, \"Use the Rest Parameter with Function Parameters\")), mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"a\", {\n    parentName: \"li\",\n    \"href\": \"https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures/es6/use-the-spread-operator-to-evaluate-arrays-in-place\"\n  }, \"Use the Spread Operator to Evaluate Arrays In-Place\")), mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"a\", {\n    parentName: \"li\",\n    \"href\": \"https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-to-extract-values-from-objects\"\n  }, \"Use Destructuring Assignment to Extract Values from Objects\")), mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"a\", {\n    parentName: \"li\",\n    \"href\": \"https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-to-assign-variables-from-objects\"\n  }, \"Use Destructuring Assignment to Assign Variables from Objects\")), mdx(\"li\", {\n    parentName: \"ol\"\n  }, mdx(\"a\", {\n    parentName: \"li\",\n    \"href\": \"https://www.freecodecamp.org/learn/javascript-algorithms-and-data-structures/es6/use-destructuring-assignment-to-assign-variables-from-arrays\"\n  }, \"Use Destructuring Assignment to Assign Variables from Arrays\"))));\n}\n;\nMDXContent.isMDXComponent = true;","headings":[{"depth":1,"value":"Objects in depth"},{"depth":3,"value":"The this keyword"},{"depth":3,"value":"Constructor"},{"depth":3,"value":"Spread syntax"},{"depth":3,"value":"Destructuring"},{"depth":3,"value":"Assignment"},{"depth":2,"value":"Exercises"}]}},"pageContext":{"slug":"/advanced-js/objects/","prev":{"label":"Further reading","link":"/advanced-js/arrays-further-reading"},"next":{"label":"Asynchronous JavaScript","link":"/advanced-js/async"},"repositoryEditUrl":"https://github.com/rocketseat/gatsby-themes/tree/main/examples/gatsby-theme-docs/src/docs/advanced-js/objects.mdx","repositoryProvider":"GitHub"}},"staticQueryHashes":["1954253342","2328931024","2501019404","973074209"]}