4^th Practical Class:
Spread and Rest Operators

• ... is spread or rest operator
• ... on right side of = is spread operator
• ... on left side of = is rest operator

JavaScript Spread Operator

Combine multiple objects or arrays together.

Spread is when ... is on the right side of = operator.

JavaScript Rest Operator

Get the remainder of object or array after getting specific elements.

Rest is when ... is on the left side of = operator.

React Spread

• see more about React spread operator

App1 and App2 are equvivalent:

Spread and Rest in React

Combination of JavaScript Rest and React Spread is often used.

Notes for example below:

• isRed should not be passed to <button />
• className is taken from props and combined with Button specific classes
  • for example: <Button isRed className="big-button" /> will be: <button className="red big-button" />
• everything except of isRed that we pass to <Button /> will be applied to <button />
  • e.g. disabled and type="submit"
• <Button isRed /> is shorthand notation for <Button isRed={true} />