├── README.md
├── img
└── diagrama.png
└── src
├── index.html
└── js
└── script.js
/README.md:
--------------------------------------------------------------------------------
1 | #  Aula JavaScript Funções Construtoras
2 |
3 | [DevSuperior - Escola de programação](https://devsuperior.com.br)
4 |
5 | [](https://instagram.com/devsuperior.ig)
6 | [](https://youtube.com/devsuperior)
7 |
8 | # Exemplo prático
9 |
10 | 
11 |
12 | # Funções Construtoras
13 |
14 | Funções construtoras instanciam objetos com uma estrutura pré-definida.
15 |
16 | Todos objetos herdam o prototype de Object.
17 |
18 | Depois do ES6 (2015), a estrutura dos objetos podem ser definida por classes.
19 |
20 | Boa prática: defina propriedades dentro do construtor, e métodos no prototype.
21 |
22 | ## new
23 |
24 | Objetos são instanciados por meio da chamada do construtor com a palavra chave `new`.
25 |
26 | ## this
27 |
28 | A palavra chave `this` é uma referência para o próprio objeto.
29 |
30 | Serve para acessar membros (propriedades e funções) do próprio objeto, ou então para referenciar o objeto de uma forma geral.
31 |
32 | Mesmo que não haja ambiguidade, é necessário usar o `this` para acessar um membro do objeto.
33 |
34 | ## propriedade constructor
35 |
36 | Maneira prática de se verificar o construtor de um objeto.
37 |
38 | ## prototype de uma função
39 |
40 | É um mecanismo pelo qual objetos JavaScript herdam recursos uns dos outros (Mozilla).
41 |
42 | O prototype de um construtor define uma estrutura de membros que são compartilhados pelas instâncias desse construtor.
43 |
44 | https://developer.mozilla.org/pt-BR/docs/Learn/JavaScript/Objects/Object_prototypes
45 |
46 |
--------------------------------------------------------------------------------
/img/diagrama.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/devsuperior/aula-js-construtores/30390ac4e966749a0e2855791a7d5bd46dd58f15/img/diagrama.png
--------------------------------------------------------------------------------
/src/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 | Aula
8 |
9 |
10 | Aula
11 | JavaScript Funções Construtoras
12 |
13 |
14 |
15 |
16 |
--------------------------------------------------------------------------------
/src/js/script.js:
--------------------------------------------------------------------------------
1 | const p1 = {
2 | name: "Computador",
3 | price: 3000.0,
4 | quantity: 2
5 | }
6 |
7 | const Product = function(name, price, quantity) {
8 | this.name = name;
9 | this.price = price;
10 | this.quantity = quantity;
11 | }
12 |
13 | Product.prototype.total = function() {
14 | return this.price * this.quantity;
15 | }
16 |
17 | Product.prototype.add = function(amount) {
18 | this.quantity += amount;
19 | }
20 |
21 | Product.prototype.remove = function(amount) {
22 | if (this.quantity >= amount) {
23 | this.quantity -= amount;
24 | }
25 | }
26 |
27 | Product.prototype.label = function() {
28 | return "Dados: " + this.name + ", " + this.price.toFixed(2);
29 | }
30 |
31 | const p2 = new Product("Monitor", 800.0, 10);
32 |
33 | const p3 = new Product("Mouse", 50.0, 4);
34 |
35 |
--------------------------------------------------------------------------------