Rysowanie choinki/piramidy za pomocą pętli w js

pytanie zadane 22 lutego 2018 w JavaScript przez Piotr50 Nowicjusz (240 p.)

Jak za pomocą pętli narysować choinkę/piramidę z gwiazdek w java script. Umiem narysować jeden wiersz gwiazdek lecz mam trudności z dodaniem kolejnych wierszy gwiazdek. Dodam, że dopiero zacząłem się uczyć java scriptu i jestem początkujący.

1 odpowiedź

odpowiedź 22 lutego 2018 przez Tomek Sochacki Ekspert (227,510 p.)
wybrane 27 lutego 2018 przez Piotr50

Najlepsza

Co prawda generalnie to nie prosimy tutaj na forum o gotowca, ale ostatnio bawiłem się w pewnym projekcie takimi własnie problemami aby na ich przykładzie pokazać kilka różnych elementów języka, więc mogę tutaj dać Ci jeden z nich, właśnie z choinką:

const tree = (n) => {
	const result = [];
	for (let i = 1; i <= n; i += 1) {
		result[i] = '';
		for (let j = i; j < n; j++) {
			result[i] += ' ';
		}
        const max = (2 * i - 1);
		for (let j = 1; j <= max; j++) {
			result[i] += '*';
		}
	}
	return result.join('\n');
};

i teraz trochę testów:

tree(5);
"
    *
   ***
  *****
 *******
*********"

tree(3);
"
  *
 ***
*****"
tree(2);
"
 *
***"
tree(1);
"
*"
tree(0);
""

Generalnie nie jest to najlepsze z rozwiązań, ale aby je zrozumieć musisz podjąć temat tablic (array) w JS, temat pętli i poznać operatory, w tym takie jak "+=", "++" itp. Zwróć np. uwagę na "i += 1" oraz "j++" w pętli for. Specjalnie tak zrobiłem, aby pokazać, że czasem warto korzystać np. z i+=1 jeśli chciałbyś np. iterować po co drugiej wartości "i+=2" itp. Popatrz też sobie na zagnieżdżone pętle.

Proponuję abyś na spokojnie rozpisał sobie wszystkie iteracje na kartce i ręcznie analizował co za znak będzie się kolejno pojawiał i dlaczego.

Natomiast wersję krótszą pewnie ktoś Ci poda, to taka wersja na pomyślenie :)

komentarz 23 lutego 2018 przez Piotr50 Nowicjusz (240 p.)

Dzięki za odpowiedź. Właśnie próbuję się pobawić z tworzeniem choinki, tylko teraz wyskakuje mi błąd "NaN".

<!DOCTYPE html>
<html lang="pl">
<head>
    <meta charset="UTF-8">
    <title>Skrypt</title>
</head>
<body>


    <script>

            var result = "";
            var liczba = 5;
            for (var i=0; i<=liczba; i++) {
                var result = "";
                for (var j=i; j<liczba; j++) {
                    var result = " ";
                }
                for (var j=0; j<=liczba; j++) {
                    var result =+ "*";
                }
            }

            alert(result);


    </script>
</body>
</html>

Nie wiem gdzie jest błąd.