Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Leer Object Spread Syntax | Modern Object Composition and Best Practices
Objects and Prototypes in JavaScript

bookObject Spread Syntax

12345678910111213
const baseUser = { name: "Alice", age: 30, role: "user" }; const adminUser = { ...baseUser, role: "admin", permissions: ["read", "write", "delete"] }; console.log(JSON.stringify(adminUser));
copy

The object spread syntax (...) offers a concise way to copy and extend objects. In the example above, adminUser is created by copying all properties from baseUser and then overriding the role property while adding a new permissions property. This approach is more readable and less error-prone than Object.assign. With Object.assign, you would write:

const adminUser = Object.assign({}, baseUser, {
  role: "admin",
  permissions: ["read", "write", "delete"]
});

Both patterns perform a shallow copy, but the spread syntax is more succinct and easier to use, especially when combining properties or extending objects with new values.

Note
Note

When extending objects, always use shallow copy techniques like the spread syntax (...) or Object.assign to avoid modifying the original object. This helps prevent bugs and keeps your data predictable. Avoid copying objects with properties that are themselves objects or arrays if you need deep copies, as both the spread operator and Object.assign only copy references for nested objects. To avoid prototype pollution, never spread or assign objects from untrusted sources directly into your application's main objects. Always validate and sanitize input before extending objects, and prefer creating new objects over mutating existing ones.

question mark

Consider the code snippet below. Which statements about the result of using the spread syntax to combine objA and objB are accurate?

Select the correct answer

Was alles duidelijk?

Hoe kunnen we het verbeteren?

Bedankt voor je feedback!

Sectie 3. Hoofdstuk 3

Vraag AI

expand

Vraag AI

ChatGPT

Vraag wat u wilt of probeer een van de voorgestelde vragen om onze chat te starten.

Awesome!

Completion rate improved to 7.69

bookObject Spread Syntax

Veeg om het menu te tonen

12345678910111213
const baseUser = { name: "Alice", age: 30, role: "user" }; const adminUser = { ...baseUser, role: "admin", permissions: ["read", "write", "delete"] }; console.log(JSON.stringify(adminUser));
copy

The object spread syntax (...) offers a concise way to copy and extend objects. In the example above, adminUser is created by copying all properties from baseUser and then overriding the role property while adding a new permissions property. This approach is more readable and less error-prone than Object.assign. With Object.assign, you would write:

const adminUser = Object.assign({}, baseUser, {
  role: "admin",
  permissions: ["read", "write", "delete"]
});

Both patterns perform a shallow copy, but the spread syntax is more succinct and easier to use, especially when combining properties or extending objects with new values.

Note
Note

When extending objects, always use shallow copy techniques like the spread syntax (...) or Object.assign to avoid modifying the original object. This helps prevent bugs and keeps your data predictable. Avoid copying objects with properties that are themselves objects or arrays if you need deep copies, as both the spread operator and Object.assign only copy references for nested objects. To avoid prototype pollution, never spread or assign objects from untrusted sources directly into your application's main objects. Always validate and sanitize input before extending objects, and prefer creating new objects over mutating existing ones.

question mark

Consider the code snippet below. Which statements about the result of using the spread syntax to combine objA and objB are accurate?

Select the correct answer

Was alles duidelijk?

Hoe kunnen we het verbeteren?

Bedankt voor je feedback!

Sectie 3. Hoofdstuk 3
some-alt