0

Tenho um script e gostaria apenas de coloca-lo dentro de uma function porque não é boa prática deixar scripts "soltos", então gostaria de uma função que não modifique em nada o meu script, apenas sirva de "deposito" e que meu script continue funcionando e sendo reconhecido perfeitamente pelo HTML.

var ctx = document.getElementById('myChart').getContext('2d');
var chart = new Chart(ctx, {
    // The type of chart we want to create
    type: 'line',

    // The data for our dataset
    data: {
        labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July'],
        datasets: [{
            label: 'My First dataset',
            backgroundColor: 'rgb(255, 99, 132)',
            borderColor: 'rgb(255, 99, 132)',
            data: [0, 10, 5, 2, 20, 30, 45]
        }]
    },    
    options: {}
});
<html>
<head>
<title></title>
</head>
<body>

<canvas id="myChart"></canvas>

<script src="https://cdn.jsdelivr.net/npm/[email protected]"></script>
</body>
</html>

1 Resposta 1

0

Você pode definir funções de várias formas dentro do javaScript e fazer a chamada depois, primeiramente usando a declaração de função, que é carregado antes de executar

function soma(a, b){
    return a + b
}

Também pode utilizar uma function expression que só executa depois da declaração

const sub = function(x,y){
    return x - y
}

Também temos funções arrow

let dobro = (a) => {
    return 2*a;
}

Podemos inclusive atribuir funções a variáveis, normalmente utilizamos const, para que elas não sejam alteradas. Você pode deixar seu código em algo equivalente á:

function myChart(){
 var ctx = document.getElementById('myChart').getContext('2d');
 var chart = new Chart(ctx, {
    // The type of chart we want to create
    type: 'line',

    // The data for our dataset
    data: {
        labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July'],
        datasets: [{
            label: 'My First dataset',
            backgroundColor: 'rgb(255, 99, 132)',
            borderColor: 'rgb(255, 99, 132)',
            data: [0, 10, 5, 2, 20, 30, 45]
        }]
    },    
    options: {}
 });
}

myChart(); //chamada de função dentro do script
1
  • 1
    Obrigado, era isso que procurava!
    – user198468
    23/12/2020 às 12:29

Você deve fazer log-in para responder a esta pergunta.