prototype

Prototype Design Pattern

Video Lecture

Section	Video Links
Prototype Pattern
Prototype Use Case

Book

Cover	Links
	https://www.amazon.com/dp/B0948BCH24    https://www.amazon.co.uk/dp/B0948BCH24    https://www.amazon.in/dp/B094716FD6    https://www.amazon.de/dp/B0948BCH24    https://www.amazon.fr/dp/B0948BCH24    https://www.amazon.es/dp/B0948BCH24    https://www.amazon.it/dp/B0948BCH24    https://www.amazon.co.jp/dp/B0948BCH24    https://www.amazon.ca/dp/B0948BCH24    https://www.amazon.com.au/dp/B0948BCH24

Overview

... Refer to Book or Design Patterns in TypeScript website to read textual content.

Terminology

... Refer to Book or Design Patterns in TypeScript website to read textual content.

Prototype UML Diagram

Output

When using the shallow copy approach. Changing the inner item of OBJECT2s array, also affected OBJECT1s array.

node ./dist/prototype/prototype-concept.js
OBJECT1: {"field":[1,2,3,4]}
OBJECT2: {"field":[1,2,3,4]}
OBJECT2: {"field":[1,101,3,4]}
OBJECT1: {"field":[1,101,3,4]}

When using the deep copy approach. Changing the inner item of OBJECT2s array, does not affect OBJECT1s array.

node ./dist/prototype/prototype-concept.js
OBJECT1: {"field":[1,2,3,4]}
OBJECT2: {"field":[1,2,3,4]}
OBJECT2: {"field":[1,101,3,4]}
OBJECT1: {"field":[1,2,3,4]}

Prototype Use Case

... Refer to Book or Design Patterns in TypeScript website to read textual content.

Example UML Diagram

Output

node ./dist/prototype/client.js
Document {
  name: 'Original',
  array: [ [ 1, 2, 3, 4 ], [ 5, 6, 7, 8 ] ]
}

Document {
  name: 'Copy 1',
  array: [ [ 1, 2, 3, 4 ], [ 5, 6, 200, 8 ] ]
}
Document {
  name: 'Original',
  array: [ [ 1, 2, 3, 4 ], [ 5, 6, 200, 8 ] ]
}

Document {
  name: 'Copy 2',
  array: [ [ 1, 2, 3, 4 ], [ 9, 10, 11, 12 ] ]
}
Document {
  name: 'Original',
  array: [ [ 1, 2, 3, 4 ], [ 5, 6, 200, 8 ] ]
}

Document {
  name: 'Copy 3',
  array: [ [ 1, 2, 3, 4 ], [ 1234, 6, 200, 8 ] ]
}
Document {
  name: 'Original',
  array: [ [ 1, 2, 3, 4 ], [ 5, 6, 200, 8 ] ]
}

Summary

... Refer to Book or Design Patterns in TypeScript website to read textual content.