Сократить код

@a_tuz · Регистрация: 10.07.2015

Студворк — интернет-сервис помощи студентам

Доброго времени суток. Есть такое задание: по значениям из заполненной формы строится процентная диаграмма. Код у меня, хоть и довольно примитивно, но написан:

Java
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=windows-1251">
 
<title></title>
 
</head>
 
<body>
<form action=" " name="forma" method="get" onsubmit=" ">
<h2>Пожалуйста, заполните ведомость.</h2>
<p>Общее количество оценок "отлично": <input type="text" name="five" id="idfive"> </p>
<p>Общее количество оценок "хорошо": <input type="text" name="four" id="idfour"> </p>
<p>Общее количество оценок "удовлетворительно": <input type="text" name="three" id="idthree"> </p>
<p>Общее количество оценок "неудовлетворительно": <input type="text" name="two" id="idtwo"> </p>
 
<input type="button" onclick="ball()" value="Посчитать средний балл">
<input type="button" onclick="img_size()" value="Построить диаграмму">
<input type="reset" value="Стереть всё">
<p>
<table id='table1' border=1 bordercolor="white" width=400>
<caption> Диаграмма распределения процентного количества студентов в соответсвии с полученными оценками </caption>
<tr valign="bottom">
<td> <img src="1.jpg" alt="пятерки" title=" " width=20 height=0 id="img_1" onmouseover="f(this)"> </td>
<td> <img src="2.jpg" alt="четвёрки" title=" " width=20 height=0 id="img_2" onmouseover="f(this)"> </td>
<td> <img src="3.jpg" alt="тройки" title=" " width=20 height=0 id="img_3" onmouseover="f(this)"> </td>
<td> <img src="4.jpg" alt="двойки" title=" " width=20 height=0 id="img_4" onmouseover="f(this)"> </td>
</tr>
<tr>
<td>"5"</td>
<td>"4"</td>
<td>"3"</td>
<td>"2"</td>
</tr>
</table>
</p>
 
<script type="text/javascript">
 
function ball(){
//среднее значение
var a=1*document.forma.five.value;
var b=1*document.forma.four.value;
var c=1*document.forma.three.value;
var d=1*document.forma.two.value;
var val;
val1=(a*5+b*4+c*3+d*2);
val2=a+b+c+d;
val=val1/val2;
if (isNaN(val)==true) {alert("Неправильно! Введите значения в виде чисел.");}
else {
alert("Средний балл: "+val.toFixed(2));
}
}
 
//меняет высоту изображения
function img_size(){
var a=1*document.forma.five.value;
var b=1*document.forma.four.value;
var c=1*document.forma.three.value;
var d=1*document.forma.two.value;
val=a+b+c+d;
var h1=(a*100)/val; //высота столбца с пятерками
var h2=(b*100)/val; //высота столбца с четверками
var h3=(c*100)/val; //высота столбца с тройками
var h4=(d*100)/val; //высота столбца с двойками
document.getElementById('img_1').height=h1;
document.getElementById('img_2').height=h2;
document.getElementById('img_3').height=h3;
document.getElementById('img_4').height=h4;
}
//наведение мышки
function f(obj){
obj.title=obj.height+"%";
}
</script>
 
</body>
</html>

Всё работает. Но в нём очень много повторяющихся действий (в функциях), которые хотелось бы сократить. Что можете подсказать по этому поводу? Как лучше сделать?

@Михаил_96 · 10.05.2016, 21:48

Создай отдельный класс с соответствующими методами, сократит код в два раза + хоть какая-то читабельность

Добавлено через 2 часа 4 минуты
Или можно взять что-то вроде этого

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
function img_size () {
  this.list = new Array();
  ['five', 'four', 'three', 'two'].forEach(function(i, n){
    this.list[n] = parseInt(document.forma[i].value);
    this.sum = (this.sum ? this.sum + this.list[n] : this.list[n]);
  }.bind(this));
  this.list.forEach(function(i, n){
    document.getElementById('img_'+(n+1)).height = this.list[n]*100/this.sum;
  }.bind(this));
}
 
function f(obj){
 obj.title = obj.height+"%";
}
 
function ball(){
  //среднее значение
  this.list = new Array();
  ['five', 'four', 'three', 'two'].forEach(function(i, n, arr){
    this.list[n] = parseInt(document.forma[i].value);
    this.sum = (this.sum ? this.sum + this.list[n] : this.list[n]);
    this.op = (this.op ? this.op + (5-n)*this.list[n] : (5-n)*this.list[n]);
  }.bind(this));
  var val = this.op/this.sum;
  
  if (isNaN(val) == true) 
    alert("Неправильно! Введите значения в виде чисел.");
  else 
    alert("Средний балл: "+val.toFixed(2));
}

Новые блоги и статьи Все статьи Все блоги /
Контроль заполнения и очистка дат в зависимости от значения перечислений Maks 12.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "ПланированиеПерсонала", разработанного в конфигурации КА2. Задача: реализовать контроль корректности заполнения дат назначения. . .	Архитектура слоя интернета для сервера-слоя. Hrethgir 11.04.2026 В продолжение https:/ / www. cyberforum. ru/ blogs/ 223907/ 10860. html Знаешь что я подумал? Раз мы все источники пишем в голове ветки, то ничего не мешает добавить в голову такой источник, который сам. . .	Подстановка значения реквизита справочника в табличную часть документа Maks 10.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "ПланированиеПерсонала", разработанного в конфигурации КА2. Задача: при выборе сотрудника (справочник Сотрудники) в ТЧ документа. . .	Очистка реквизитов документа при копировании Maks 09.04.2026 Алгоритм из решения ниже применим как для типовых, так и для нетиповых документов на самых различных конфигурациях. Задача: при копировании документа очищать определенные реквизиты и табличную. . .
модель ЗдравоСохранения 8. Подготовка к разному выполнению заданий anaschu 08.04.2026 https:/ / github. com/ shumilovas/ med2. git main ветка * содержимое блока дэлэй из старой модели теперь внутри зайца новой модели 8ATzM_2aurI	Блокировка документа от изменений, если он открыт у другого пользователя Maks 08.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа, разработанного в конфигурации КА2. Задача: запретить редактирование документа, если он открыт у другого пользователя. / / . . .	Система безопасности+живучести для сервера-слоя интернета (сети). Двойная привязка. Hrethgir 08.04.2026 Далее были размышления о системе безопасности. Сообщения с наклонным текстом - мои. А как нам будет можно проверить, что ссылка наша, а не подделана хулиганами, которая выбросит на другую ветку и. . .	Модель ЗдрввоСохранения 7: больше работников, больше ресурсов. anaschu 08.04.2026 работников и заданий может быть сколько угодно, но настроено всё так, что используется пока что только 20% kYBz3eJf3jQ

Сократить код

Решение