Home
Button Mobile Webdesign em Foco
Newsletter Webdesign em Foco
Support Webdesign em Foco
Contribuition Webdesign em Foco
Doe para a Webdesign em Foco
Suporte da Webdesign em Foco
Fechar

Vanilla Javascript - #35 Herança através do Escopo Global

19/07/2019

Nessa aula aprenderemos a utilizar o escopo global como forma de herança de dados podendo repassar dados de um arquivo para outro.

Herança através do escopo global no JS

Utilizar o escopo global como forma de herança é interessante, pois permite que você divida seu código em vários arquivos e relacione os objetos entre esses arquivos.

Veja no exemplo abaixo, criaremos o arquivo javascript.js e o javascript2.js e faremos o relacionamento entre eles:

javascript.js

(function readyJS(win,doc){
    'use strict';

    function app(adiant,salario) {
        this.adiant=adiant;
        this.salario=salario;
    }
    app.prototype.percent=function () {
        return this.adiant*100/this.salario;
    };
    app.prototype.result=function () {
        return 'O funcionário recebeu '+this.percent()+ '% relativo ao adiantamento';
    };


    function test(){
        console.log('Função test');
    }

    win.app=app;
    win.teste=test;
})(window,document);

javascript2.js

(function (win,doc) {
    'use strict';

    let obj2=new app(500,2000);
    console.log(obj2.result());
})(window,document);

Repare no código acima que a variável obj2 é uma instância da função app que se encontra no escopo global.

index

Na index faremos o relacionamento utilizando o código inline através da variável obj3.

<body>
    <script src="javascript.js"></script>
    <script src="javascript2.js"></script>
    <script>
        let obj3=new app(100,200);
        console.log(obj3.result());
        console.log(window);
    </script>
</body>

Sucesso nos códigos e na vida!

Receba as aulas da Webdesign em Foco em Seu Email
Suporte Webdesign em Foco

Posts Relacionados

Vanilla Javascript - #34 Herança Prototípica
Nessa vídeo-aula vamos trabalhar com um dos temas mais complexos da linguagem de programação Javascript: a herança prototípica.
Saiba mais!
Vanilla Javascript - #36 Módulos
No tutorial de hoje trabalharemos com módulos no Javascript entendendo para que serve e como usá-lo, tanto no lado servidor quanto no lado cliente.
Saiba mais!
Javascript
Ensinaremos durante as aulas a codificação desta importante linguagem de programação.
Saiba mais!