A recursividade está ao nosso redor. Quando fazemos contas, nas árvores, nos cristais, quando jogamos damas ou xadrez e mesmo quando um ribossomo e DNA montam uma proteína.
Por exemplo:
<html> <head> <script> metodo = function(lugarImpressao, poda) { lugarImpressao.appendChild( document.createTextNode(" - ") ) if(poda>1) { // metodo chama a sí mesmo metodo(lugarImpressao, poda-1); } } load = function() { metodo( document.body, 4 ); } </script> </head> <body onload="load();"> </body> </html>Note que é importante a existência de uma variável poda. É isso mesmo! Podar a árvore. Sem essa variável para limitar o número de chamadas a sí mesmo, ela iria continuar sem parar.
Um exemplo visual:
Bonito não é? Seu código:
<html> <head> <script> manterLimites = function(angulo) { while(angulo>=360) { angulo=angulo-360; } while(angulo<0) { angulo=angulo+360; } return angulo; } getSenCos = function(angulo) { angulo = manterLimites(angulo); seno = Math.sin(angulo * Math.PI / 180); cose = Math.cos(angulo * Math.PI / 180); return [cose, seno]; } galho = function(ctx, x1, y1, tamanho, angulo, poda) { var senCos= getSenCos(angulo) var tx = x1+tamanho*senCos[0] var ty = y1+tamanho*senCos[1] ctx.lineWidth = poda*poda; ctx.beginPath(); ctx.strokeStyle="#FF0000"; ctx.moveTo(x1,y1); ctx.lineTo(tx,ty); ctx.stroke(); if( poda>1 ) { galho(ctx, tx, ty, tamanho*0.5, angulo+90,poda-1 ) galho(ctx, tx, ty, tamanho*0.5, angulo, poda-1 ) galho(ctx, tx, ty, tamanho*0.5, angulo-90,poda-1 ) } } load = function() { var c = document.getElementById("myCanvas"); var ctx = c.getContext("2d"); galho(ctx, 250, 250, 45, 0+45, 4); galho(ctx, 250, 250, 45, 90+45, 4); galho(ctx, 250, 250, 45, 180+45, 4); galho(ctx, 250, 250, 45, 270+45, 4); } </script> </head> <body onload="load();"> <canvas id="myCanvas" width="500" height="500" style="border:1px solid #000000;"> </canvas> </body> </html>
Nenhum comentário:
Postar um comentário