Como enviar dados de e para funções em seu jogo html5

Funções fazer o seu código do jogo HTML5 seguro porque variáveis ​​criadas dentro de uma função são destruídos quando a função morre. Às vezes, porém, você quer que os dados para passar de uma função para outra. Uma solução é a variável global, mas é uma espécie de opção bruto. A melhor solução é permitir que a passagem de dados para dentro e para fora de funções.

Claro, este programa poderia ser escrito através da criação de uma variável de cadeia muito longa e, em seguida, copiá-lo para o innerHTML atributo do saída div, mas que seria muito ineficiente. Em vez disso, você pode usar funções para simplificar o trabalho. Começar por olhar sobre a função principal: makeSong ().

 funcionar makeSong () {// criar variável de saída a partir da saída // param.htmlvar = document.getElementById ("saída") = -output.innerHTML "-output.innerHTML + = verso (1) -output.innerHTML + = coro () - output.innerHTML + = verso (2) -output.innerHTML + = coro () -} // final makeSong

Este código demonstra uma das principais vantagens de funções-permitem que você quebrar um problema complexo em uma série de problemas menores. Uma série de coisas interessantes estão acontecendo aqui:

  • O programa grava em um div chamado saída. Você vai fazer uma variável chamada saída que corresponde a um div chamado saída na página.

  • Escreve texto saída. Isso não é surpreendente, mas é interessante porque não existem variáveis ​​de texto ou valores na makeSong () função.

  • Todo o texto é criada por outras funções. Há duas outras funções neste programa: versículo() e coro(). Ambas as funções criar valores de cadeia.

  • Verso pode ser “alimentado” um valor numérico. o versículo função é especialmente importante porque ele pode ser passado um valor. O comportamento mudanças verso com base no valor passado para ele.

Como retornar um valor de uma função em seu jogo

Para compreender verdadeiramente o que está acontecendo aqui, começar com o coro() função (porque é um pouco mais simples do que versículo()).

função coro () {// resultado de param.htmlvar = "-e todos eles vieram marchando, 
"-result + = "para o chão, para sair, da chuva.
"-result + = "boom boom boom boom
"-result + = "boom boom boom boom
"-result + = "
"-Retornar result-} // coro final

o coro() função é extremamente simples:

  1. Criar uma variável chamada resultado.

    Esta variável mantém o resultado do trabalho da função (que será um valor string contendo o refrão da música).

  2. Anexar o código HTML para o resultado variável.

    Este código tem várias linhas que se acumulam o resultado. Note-se que esta é a formatação HTML, porque este código será impressa em uma HTML div.

  3. Retorna resultado.



    A última declaração da função é especial. o Retorna declaração permite que você especifique um valor que a função retorna a qualquer código que chamou.

  4. Use a função como uma variável.

    Quando uma função tem um valor de retorno, você pode tratá-la como uma variável. Porque esta função retorna um string, você pode usar a função como uma variável de seqüência na makeSong () função. Nessa função, output.innerHTML + = coro ()é usado. Isso significa “executar o coro() função e, em seguida, adicionar o que sai dessa função para o innerHTML do saída elemento."

Como enviar argumentos para uma função em seu jogo

o versículo() função também retorna um valor, mas tem outro truque na manga. Embora o coro é sempre a mesma, o verso muda um pouco de cada vez. O pequeno (que parece ter problemas de atenção) se distrai de forma diferente em cada verso.

Video: Curso de HTML5 - 24 - Funções javascript

o versículo() função usa uma idéia importante chamada parâmetro de passagem para permitir essa variação de comportamento. Começar por olhar para o código para a função:

 função verso (verseNumber) {// da distração param.htmlvar = "-se (verseNumber == 1) {= distracção "chupar o dedo"-} else if (verseNumber == 2) {distração = "amarrar o sapato"-} else {distração = "há um problema aqui ..."-} // resultado IFVAR end = "As formigas vão marchar "-result + = + verseNumber " de " + + VerseNumber ", "-result + = "hurray, hurray 
"-result + = "As formigas vão marchar "-result + = + verseNumber " de " + + VerseNumber ", "-result + = "hurray, hurray
"-result + = "As formigas vão marchar "-result + = + verseNumber " de " + + VerseNumber "
"-result + = "O pequeno pára para "-result + = + distracção "

"-Retornar result-} // verso final

o versículo() função é muito semelhante à que se coro() função, exceto que é mais flexível porque pode aceitar um parâmetro.

  1. Chamar a função com um valor dentro dos parênteses.

    Quando uma função é destinada a aceitar um parâmetro, ele deve ser chamado com um valor dentro dos parênteses. Dentro makeSong (), você vê as chamadas para verso (1) e verso (2), mas nunca versículo(). Isso é porque versículo é projetado para aceitar sempre um único valor inteiro.

  2. Definir a função com um nome de variável dentro dos parênteses.

    Se você olhar para a definição da função para versículo(), você vê que contém a variável verseNumber entre os parênteses. sempre que o versículo() função é chamada, ele deve ser alimentado um valor, e esse valor é colocada na variável especial verseNumber.

  3. Usar verseNum para encontrar a distração.

    analisar o verseNumber variável e usá-lo para encontrar a distração apropriado. Colocar isso em uma variável chamada Distração.

  4. Construir o verso.

    incorporar o verseNumber e Distração variáveis ​​no resultado variável.

  5. Retornar o resultado.

    A principal função usa o valor retornado como uma string, imprimindo o verso.


Publicações relacionadas