Вступ до шаблонів у JavaScript

Шаблони - це одна із поширених програм з моделями Java, яка широко використовується для вдосконалення логічного мислення та вдосконалення знань щодо управління потоком. Шаблони - це моделі багаторазового використання та взаємодії об'єкта. Кожен шаблон має назву і при обговоренні складних альтернатив дизайну стає складовою лексики. Кожен розробник прагне написати керований, читабельний та багаторазовий код. Код структуризації стає більш важливим при великих програмах. Шаблони дизайну мають важливе значення для вирішення цього завдання - надання організаційної структури для поширених проблем у конкретній ситуації. У цій статті ми обговоримо Шаблони в JavaScript.

Веб-розробники JavaScript зазвичай спілкуються з моделями дизайну, коли виробляють додатки, навіть несвідомо. Незважаючи на те, що в деяких ситуаціях використовуються різноманітні дизайнерські зразки, дизайнери JavaScript, як правило, використовують деякі візерунки більше, ніж інші. Шаблон дизайну - це багаторазове рішення для поширених проблем із програмним забезпеченням. Шаблони дизайну - найкращі практики, якими користуються досвідчені розробники програмного забезпечення. Шаблон дизайну можна розглядати як шаблон сценаріїв.

Навіщо використовувати шаблони?

Багато програмістів вважають, що моделі є марною тратою часу або вони не знають, як правильно їх застосовувати. Але використання відповідного шаблону дизайну може допомогти вам написати кращий і зрозуміліший код, а оскільки його зрозуміти простіше, код можна легко зберегти. Найголовніше, що ці шаблони забезпечують поширений словниковий запас для розробників програмного забезпечення. Вони одразу демонструють, що хтось вивчає код до мети вашого коду.

Шаблони в JavaScript (Шаблони чисел, Зірки, Шаблони символів)

Давайте детально обговоримо Шаблони в JavaScript.

1. Шаблони чисел

Програма 1


JavaScript Number Patterns
var num;
var no=prompt("Please provide a number for the no of rows to be print in a pattern…");
for(var m=1;m<=no;m++)
(
for(var n=1;n<=m;n++)
(
document.write("0"+n+" ");
)
document.write("
");
)

Збережіть назву файлу за вибором та двічі клацніть на цьому файлі. Він відкриється в браузері з підтримкою JavaScript і відобразить вихід, як показано нижче:

Програма 2


JavaScript Number Patterns
for(m=1; m <= 5; m++)
(
for(n=1; n<=m; n++)
(
document.write(n);
if(n == m)
continue;
else
document.write(' ');
)
document.write('
');
)

Запустіть програму в браузері, і ви побачите нижченаведений вихід:

Програма 3


JavaScript Star Patterns
var m, n;
for(m=1;m<=5;m++)
(
for(n=m;n<=5;n++)
(
document.write(""+n+" ");
)
document.write('
');
)

Запустіть програму в браузері, і ви побачите нижченаведений вихід:

Програма 4


JavaScript Number Patterns
var m, n, count = 5;
for (m = 1; m <= count; m++) (
for (n = 1; n <= m; n++) (
document.write(""+m+" ");
)
document.write('
');
)

Запустіть програму в браузері, і ви побачите нижченаведений вихід:

Програма 5


JavaScript Number Patterns
var num = 5;
var m, n;
for (m = 1; m < num; m++) (
for (n = 1; n <= m; n++)
document.write(""+n+" ");
document.write('
');
)
for (m = num; m >= 0; m--) (
for (n = 1; n <= m; n++)
document.write(""+n+" ");
document.write('
');
)
document.write('
');

Запустіть програму в браузері, і ви побачите нижченаведений вихід:

Програма 6


JavaScript Number Patterns
var num = 5;
var m, n;
for (m = num; m >= 0; m--) (
for (n = 1; n <= m; n++)
document.write(""+n+" ");
document.write('
');
)
for (m = 1; m <= num; m++) (
for (n = 1; n <= m; n++)
document.write(""+n+" ");
document.write('
');
)
document.write('
');

Запустіть програму в браузері, і ви побачите нижченаведений вихід:

Програма 7


JavaScript Number Patterns
var num, p, q, m, n;
num = 5;
for (m = 1; m <= num; m++) (
if (m % 2 == 0) (
p = 1;
q = 0;
) else (
p = 0;
q = 1;
)
for (n = 1; n <= m; n++)
if (n % 2 == 0)
document.write(""+p+" ");
else
document.write(""+q+" ");
document.write('
');
)

Виконайте вищевказаний код, і ви отримаєте вихід, як показано нижче:

Програма 8


JavaScript Number Patterns
var rows, m, n, num = 1;
rows = 5;
for (m = 1; m <= rows; m++) (
for (n = 1; n <= m; n++)
document.write(num++);
document.write('
');
)

Виконайте вищевказаний код, і ви отримаєте вихід, як показано нижче:

Програма 9


JavaScript Number Patterns
var i = 5;
while (i >= 1) (
var j = 5;
while (j >= i) (
document.write(""+j+" ");
j--;
)
i--;
document.write('
');
)

Виконайте вищевказаний код, і ви отримаєте вихід, як показано нижче:

Програма 10


JavaScript Number Patterns
var m, n, k;
for(m=1;m<=4;m++)
(
for(n=4;n>=(m-1)*2-1;n--)
document.write(" ");
document.write(m);
for(n=2;n<=(m-1)*4;n++)
document.write(" ");
if(m>1)
document.write(m);
document.write("
");
)
for(m=3;m>=1;m--)
(
for(n=4;n>=(m-1)*2-1;n--)
document.write(" ");
document.write(m);
for(n=2;n<=(m-1)*4;n++)
document.write(" ");
if(m>1)
document.write(m);
document.write("
");
)

Виконайте програму, і ви отримаєте нижченаведений вихід:

Програма 11


JavaScript Number Patterns
var m, n;
for(m=1;m<=5;m++)
(
for(n=5;n>=m;n--)
(
document.write(i);
)
document.write("
");
)

Виконайте програму, і ви отримаєте нижченаведений вихід:

Програма 12


JavaScript Number Patterns
var m, n, k;
for(m=4;m>=1;m--)
(
for(n=1;n<=4;n++)
(
if(n<=m)
document.write(n);
else
document.write(" ");
)
for(n=4;n>=1;n--)
(
if(n<=m)
document.write(n);
else
document.write(" ");
)
document.write("
");
)

Виконайте програму, і ви отримаєте нижченаведений вихід:

Програми 13


JavaScript Number Patterns
var m, n, k;
k=1;
for(m=1;m<=5;m+=2)
(
for(n=5;n>=1;n--)
(
if(n>m)
document.write(" ");
else
document.write(k++);
)
document.write("
");
)

Виконайте вищевказаний код, і ви отримаєте вихід, як показано нижче:

Програма 14


JavaScript Number Patterns
var i, j;
for(i=1;i<=4;i++)
(
for(j=1;j<=i;j++)
document.write(j);
for(j=i-1;j>=1;j--)
document.write(j);
document.write("
");
)

Виконайте програму, і ви отримаєте нижченаведений вихід:

Програма 15


JavaScript Number Patterns
var i, j, k;
for(i=1;i<=5;i++)
(
for(j=1;j<=5;j++)
(
if(j<=i)
document.write(j);
else
document.write(" ");
)
for(j=5;j>=1;j--)
(
if(j<=i)
document.write(j);
else
document.write(" ");
)
document.write("
");
)

Виконайте вищевказаний код, і ви отримаєте вихід, як показано нижче:

Програма 16


JavaScript Number Patterns
var m, n, k;
for (m=1;m<=5;m++)
(
for(k=m;k>1;k--)
document.write(k);
for(n=1;n<=6-m;n++)
document.write(n);
document.write(" ");
)



JavaScript Number Patterns
var m, n, k;
for (m=1;m<=5;m++)
(
for(k=m;k>1;k--)
document.write(k);
for(n=1;n<=6-m;n++)
document.write(n);
document.write(" ");
)

Виконайте вищевказаний код, і ви отримаєте вихід, як показано нижче:

Програма 17


JavaScript Number Patterns
var i, j;
for(i=1;i<=10;i++)
(
for(j=1;j<=i;j++)
(
document.write(i*j);
)
document.write("
");
)

Виконайте вищевказаний код, і ви отримаєте вихід, як показано нижче:

Програма 18


JavaScript Number Patterns
var m, n, num=5;
for(m=num; m>1; m--)
(
for(n=num;n>=1;n--)
(
if(n>m) document.write(n);
else document.write(m);
)
for(n=2;n<=num;n++)
(
if(n>m) document.write(n);
else document.write(m);
)
document.write("
");
)
for(m=1; m<=num; m++)
(
for(n=num;n>=1;n--)
(
if(n>m) document.write(n);
else document.write(m);
)
for(n=2;n<=num;n++)
(
if(n>m) document.write(n);
else document.write(m);
)
document.write("
");
)

Виконайте вищевказаний код, і ви отримаєте вихід, як показано нижче:

2. Зоряні візерунки

Програма 1


JavaScript Star Patterns
var m, n;
for(m=1; m <= 5; m++)
(
for(n=1; n<=m; n++)
(
document.write('*');
)
document.write('
');
)

Виконайте програму, і ви отримаєте нижченаведений вихід:

Програма 2


JavaScript Star Patterns
var m, n;
for(m=5;m>=1;m--)
(
for(n=1;n<=m;n++)
(
document.write('*');
)
document.write('
');
)

Виконайте програму, і ви отримаєте нижченаведений вихід:

Програма 3


JavaScript Number Patterns
var num = 5;
var m, n;
for (m = 1; m < num; m++) (
for (n = 1; n <= m; n++)
document.write(" * ");
document.write('
');
)
for (m = num; m >= 0; m--) (
for (n = 1; n <= m; n++)
document.write(" * ");
document.write('
');
)
document.write('
');

Виконайте вищевказаний код, і ви отримаєте вихід, як показано нижче:

Програма 4


JavaScript Star Patterns
var num = 5;
var m, n;
for (m = num; m >= 0; m--) (
for (n = 1; n <= m; n++)
document.write(" * ");
document.write('
');
)
for (m = 1; m <= num; m++) (
for (n = 1; n <= m; n++)
document.write(" * ");
document.write('
');
)
document.write('
');

Виконайте вищевказаний код, і ви отримаєте вихід, як показано нижче:

Програма 5


JavaScript Star Patterns
var i, j, k;
var n = 5;
for (i = 1; i <= n; i++) (
for (j = 1; j <= i; ++j)
document.write(j);
for (k = n - i; k >= 1; k--)
document.write("*");
document.write('
');
)

Виконайте вищевказаний код, і ви отримаєте вихід, як показано нижче:

Програма 6


JavaScript Star Patterns
function pyramid(n) (
for(var i=1; i<= n; i++)(
var myval = ' '.repeat(ni);
var myval1 = '*'. repeat(i*2 -1)
console.log(myval + myval1 + myval);
)
)
pyramid(5);

Виконайте вищевказаний код, і ви отримаєте вихід у консолі, як показано на зображенні нижче:

3. Шаблони персонажів

Програма 1


JavaScript Character Patterns
var m, n;
for(m=1; m <= 5; m++)
(
for(n=1; n<=m; n++)
(
document.write('A');
)
document.write('
');
)

Виконайте програму, і ви отримаєте нижченаведений вихід:

Програма 2


JavaScript Character Patterns
var m, n;
for(m=5;m>=1;m--)
(
for(n=1;n<=m;n++)
(
document.write('A');
)
document.write('
');
)

Виконайте вищевказаний код, і ви отримаєте вихід, як показано нижче:

Програма 3


JavaScript Character Patterns
var num = 5;
var m, n;
for (m = 1; m < num; m++) (
for (n = 1; n <= m; n++)
document.write(" # ");
document.write('
');
)
for (m = num; m >= 0; m--) (
for (n = 1; n <= m; n++)
document.write(" & ");
document.write('
');
)
document.write('
');

Виконайте програму, і ви отримаєте нижченаведений вихід:

Програма 4


JavaScript Character Patterns
var num = 5;
var m, n;
for (m = 1; m < num; m++) (
for (n = 1; n <= m; n++)
document.write("$");
document.write('
');
)
for (m = num; m >= 0; m--) (
for (n = 1; n <= m; n++)
document.write("#");
document.write('
');
)
document.write('
');

Виконайте вищевказаний код, і ви отримаєте вихід, як показано нижче:

Програма 5


JavaScript Character Patterns
var num = 5;
var m, n;
for (m = num; m >= 0; m--) (
for (n = 1; n <= m; n++)
document.write("A");
document.write('
');
)
for (m = 1; m <= num; m++) (
for (n = 1; n <= m; n++)
document.write("B");
document.write('
');
)
document.write('
');

Виконайте вищевказаний код, і ви отримаєте вихід, як показано нижче:

Програма 6


JavaScript Character Patterns
var i, j, k;
var n = 5;
for (i = 1; i <= n; i++) (
for (j = 1; j <= i; ++j)
document.write(j);
for (k = n - i; k >= 1; k--)
document.write("$");
document.write('
');
)

Виконайте вищевказаний код, і ви отримаєте вихід, як показано нижче:

Висновок - Шаблони JavaScript

У цій статті ми бачили різні типи візерунків, такі як число, зірка та символи. Шаблон - це слово, яке використовується в інженерії програмного забезпечення для вирішення конкретного питання програмного забезпечення для багаторазового використання. Для декількох цілей корисні конструкції. Їм продемонстровано рішення, які намагалися перевірити ветерани галузі. Це сильні методи, які вирішують проблеми загальноприйнятим способом і відображають досвід та ідеї провідного розробника в галузі, які допомогли їх визначити. Шаблони також підвищують багаторазове використання та читаність вашого програмного забезпечення, при цьому значно прискорюючи процес розробки. Шаблони цікаві для вивчення будь-якої мови програмування, а також переконливого предмета.

Рекомендовані статті

Це посібник із Шаблони в JavaScript. Тут ми обговорюємо різні типи візерунків у JavaScript із зразковим кодом докладно. Ви також можете ознайомитися з іншими запропонованими нами статтями -

  1. Шаблони в C ++
  2. Зоряні візерунки в С
  3. Шаблони в програмуванні на С
  4. Шаблони на Java
  5. 3 найкращі типи візерунків у C #
  6. Робота множення матричного програмування на С
  7. Вичерпний посібник із моделей чисел на Java