Untitled

<!DOCTYPE html>
<html>
<head>
<meta name="description" content="Arrow Functions - Acessando propriedades de classes">
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>Arrow Functions - Acessando propriedades de classes</title>
</head>
<body>

<script id="jsbin-javascript">
// Um exemplo de classe problemática.
// Queremos continuar acessando propriedades e métodos "de fora",
// usando uma instância, mas os próprios métodos da classe tem
// dificuldade de acessar as próprias propriedades.
// Como resolver usando Arrow Functions () => {}, e porque funciona?
const ReqOperations = function() {

    this.airportList = { golAirportList: ['CWD', 'GRU'] };

    this.addDestinations = function(destinationList) {
        return destinationList.map(function(dest, index) {
            // esta linha dá erro
            return this.airportList.golAirportList[index]+' > '+dest;
        });
    };
};

let x = new ReqOperations();

 // deve exibir ["CWD", "GRU"]
console.log(x.airportList.golAirportList);

// deve exibir ["CWD > AMD", "GRU > GIG"], mas dá erro
console.log(x.addDestinations(['AMD', 'GIG']));
</script>


<script id="jsbin-source-javascript" type="text/javascript">// Um exemplo de classe problemática.
// Queremos continuar acessando propriedades e métodos "de fora",
// usando uma instância, mas os próprios métodos da classe tem
// dificuldade de acessar as próprias propriedades.
// Como resolver usando Arrow Functions () => {}, e porque funciona?
const ReqOperations = function() {

    this.airportList = { golAirportList: ['CWD', 'GRU'] };

    this.addDestinations = function(destinationList) {
        return destinationList.map(function(dest, index) {
            // esta linha dá erro
            return this.airportList.golAirportList[index]+' > '+dest;
        });
    };
};

let x = new ReqOperations();

 // deve exibir ["CWD", "GRU"]
console.log(x.airportList.golAirportList);

// deve exibir ["CWD > AMD", "GRU > GIG"], mas dá erro
console.log(x.addDestinations(['AMD', 'GIG'])); </script></body>
</html>