Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Помогите упростить скрипт (https://javascript.ru/forum/dom-window/50533-pomogite-uprostit-skript.html)

Эдвард 30.09.2014 14:46

Помогите упростить скрипт
 
С целью уменьшения объёма кода хотелось бы использовать массивы и циклы. Но как это грамотно сделать, пока не понимаю, хотя перечитал массу учебников по теме.

function calculator(form)
{
k1 = form.k1.value;
k2 = form.k2.value;
k3 = form.k3.value;

x1 = k1;

switch (x1)
{ 
case "Игра 1 " : a1=1 , a2=1 , a3=""; break;
case "Игра 2 " : a1=1 , a2="" , a3=1; break;
case "Игра 3 " : a1="" , a2=1 , a3=1; break;
case "Резерв " : a1=0 , a2=0 , a3=0; break;
default:  a1="" , a2="" , a3="";
}

x2 = k2;

switch (x2)
{       
case "Игра 1 " : b1=1+a1 , b2=1+a2 , b3=""; break;
case "Игра 2 " : b1=1+a1 , b2="" , b3=1+a3; break;
case "Игра 3 " : b1="" , b2=1+a2 , b3=1+a3; break;
case "Резерв " : b1=0 , b2=0 , b3=0; break;
default:  b1="" , b2="" , b3="";
}

x3 = k3;

switch (x3)
{       
case "Игра 1 " : c1=1+Math.ceil(a1/100)+Math.ceil(b1/100) , c2=1+Math.ceil(a2/100)+Math.ceil(b2/100) , c3=""; break;
case "Игра 2 " : c1=1+Math.ceil(a1/100)+Math.ceil(b1/100) , c2="" , c3=1+Math.ceil(a3/100)+Math.ceil(b3/100); break;
case "Игра 3 " : c1="" , c2=1+Math.ceil(a2/100)+Math.ceil(b2/100) , c3=1+Math.ceil(a3/100)+Math.ceil(b3/100); break;
case "Резерв " : c1=0 , c2=0 , c3=0; break;
default:  c1="" , c2="" , c3="";
}

d1 = Math.ceil(a1/100)+Math.ceil(b1/100)+Math.ceil(c1/100);
d2 = Math.ceil(a2/100)+Math.ceil(b2/100)+Math.ceil(c2/100);
d3 = Math.ceil(a3/100)+Math.ceil(b3/100)+Math.ceil(c3/100);

if (a1=="0") {
var a1 = "Р";
}

if (a2=="0") {
var a2 = "Р";
}

if (a3=="0") {
var a3 = "Р";
}

if (b1=="0") {
var b1 = "Р";
}

if (b2=="0") {
var b2 = "Р";
}

if (b3=="0") {
var b3 = "Р";
}

if (c1=="0") {
var c1 = "Р";
}

if (c2=="0") {
var c2 = "Р";
}

if (c3=="0") {
var c3 = "Р";
}

form.total1.value = a1;
form.total2.value = a2;
form.total3.value = a3;
form.total4.value = b1;
form.total5.value = b2;
form.total6.value = b3;
form.total7.value = c1;
form.total8.value = c2;
form.total9.value = c3;
form.total10.value = d1;
form.total11.value = d2;
form.total12.value = d3;
}

ksa 30.09.2014 21:17

Цитата:

Сообщение от Эдвард
хотелось бы использовать массивы

Замени все свои переменные с цифрами на массивы
x1 ----> x[0]
x2 ----> x[1]
xN ----> x[N-1]


Особо в твой скрипт не вникал... Но.
Если все переменные с одинаковой цифрой - суть характеристики одного элемента - это можно оформить как объект...

{a: <значение_А>, b: <значение_Б>, ...}


Потом можно будет совместить "массив" с "объектом" - т.о. можно будет применять циклы.

Эдвард 30.09.2014 22:41

К сожалению, без конкретных примеров мне не разобраться.

kostyanet 01.10.2014 04:37

У меня младшая проходит переменные:

form.total1.value = a1;

form[1].value = a[1];

c=1;
form[c].value = a[c];

Safort 01.10.2014 12:31

Цитата:

Сообщение от Эдвард (Сообщение 332878)
К сожалению, без конкретных примеров мне не разобраться.

Например:

//твой код
x3 = k3;
switch (x3)
{      
case "Игра 1 " : c1=1+Math.ceil(a1/100)+Math.ceil(b1/100) , c2=1+Math.ceil(a2/100)+Math.ceil(b2/100) , c3=""; break;
case "Игра 2 " : c1=1+Math.ceil(a1/100)+Math.ceil(b1/100) , c2="" , c3=1+Math.ceil(a3/100)+Math.ceil(b3/100); break;
case "Игра 3 " : c1="" , c2=1+Math.ceil(a2/100)+Math.ceil(b2/100) , c3=1+Math.ceil(a3/100)+Math.ceil(b3/100); break;
case "Резерв " : c1=0 , c2=0 , c3=0; break;
default:  c1="" , c2="" , c3="";
}
 
d1 = Math.ceil(a1/100)+Math.ceil(b1/100)+Math.ceil(c1/100);
d2 = Math.ceil(a2/100)+Math.ceil(b2/100)+Math.ceil(c2/100);
d3 = Math.ceil(a3/100)+Math.ceil(b3/100)+Math.ceil(c3/100);


//укороченная версия

x3 = k3;

var one = Math.ceil(a1/100)+Math.ceil(b1/100);
var two = 1+Math.ceil(a2/100)+Math.ceil(b2/100);
var three = 1+Math.ceil(a3/100)+Math.ceil(b3/100);

switch (x3)
{      
case "Игра 1 " : c1=1+one , c2=two , c3=""; break;
case "Игра 2 " : c1=1+one , c2="" , c3=three; break;
case "Игра 3 " : c1="" , c2=two , c3=three; break;
case "Резерв " : c1=0 , c2=0 , c3=0; break;
default:  c1="" , c2="" , c3="";
}
 
d1 = one+Math.ceil(c1/100);
d2 = Math.ceil(a2/100)+Math.ceil(b2/100)+Math.ceil(c2/100);
d3 = Math.ceil(a3/100)+Math.ceil(b3/100)+Math.ceil(c3/100);


Писал второпях, по этому возможны логические ошибки, но суть, думаю, ты понял.

Как я понял, ты определяешь переменные без ключевого слова var. Если так, то это очень плохо.

Эдвард 01.10.2014 21:27

Цитата:

Сообщение от Safort
Например:

Такой метод уже пробовал использовать, и хоть он слегка сокращает скрипт, всё же это немного не то, т. к. отсутствуют массивы и циклы. Главная цель – сократить сами формулы за счёт объединения повторяющихся элементов.

Цитата:

Сообщение от Safort
определяешь переменные без ключевого слова var. Если так, то это очень плохо

Много где читал, что это плохо, но почему именно, так и не понял.

Эдвард 06.10.2014 21:04

Упростил свою задачу по-максимуму, но преобразовать в массив так и не получается: http://med-75.hol.es/1/8.html :

<html>
<meta charset="utf-8">

<head>
<script type="text/javascript">

function calculator(form) {

var e1 = form.e1.value;
var e2 = form.e2.value;
var e3 = form.e3.value;

switch (e1)
{	
case "ab" : a1=1 , b1=1 , c1=""; break;
case "ac" : a1=1 , b1="" , c1=1; break;
case "bc" : a1="" , b1=1 , c1=1; break;
default:  a1="" , b1="" , c1="";
}

switch (e2)
{	
case "ab" : a2=1 , b2=1 , c2=""; break;
case "ac" : a2=1 , b2="" , c2=1; break;
case "bc" : a2="" , b2=1 , c2=1; break;
default:  a2="" , b2="" , c2="";
}

switch (e3)
{	
case "ab" : a3=1 , b3=1 , c3=""; break;
case "ac" : a3=1 , b3="" , c3=1; break;
case "bc" : a3="" , b3=1 , c3=1; break;
default:  a3="" , b3="" , c3="";
}

form.a1.value = a1;
form.a2.value = a2;
form.a3.value = a3;

form.b1.value = b1;
form.b2.value = b2;
form.b3.value = b3;

form.c1.value = c1;
form.c2.value = c2;
form.c3.value = c3;
}

</script>
</head>

<style type="text/css">
    .s1 {
      text-align: center;
      font-weight: bold;
      width: 100px;
    }
</style>

<form name="f1">

<select name="e1" class="s1">
 <option>ab</option>
 <option>ac</option>
 <option>bc</option>
</select>
<select name="e2" class="s1">
 <option>ab</option>
 <option>ac</option>
 <option>bc</option>
</select>
<select name="e3" class="s1">
 <option>ab</option>
 <option>ac</option>
 <option>bc</option>
 </select>

<br>

<input name="a1" type="text" class="s1"> <input name="a2" type="text" class="s1"> <input name="a3" type="text" class="s1">

<br>

<input name="b1" type="text" class="s1"> <input name="b2" type="text" class="s1"> <input name="b3" type="text" class="s1">

<br>

<input name="c1" type="text" class="s1"> <input name="c2" type="text" class="s1"> <input name="c3" type="text" class="s1">

<br><br>

<input type="button" value="Калькуляция" onClick="calculator(this.form)">
<input type="reset" value="Сброс">

</form>
</html>


В идеале вместо трёх switch-ей должен быть один – например, такой:

switch (e[i])
{	
case "ab" : a[i]=1 , b[i]=1 , c[i]=""; break;
case "ac" : a[i]=1 , b[i]="" , c[i]=1; break;
case "bc" : a[i]="" , b[i]=1 , c[i]=1; break;
default:  a[i]="" , b[i]="" , c[i]="";
}


Но опять же встаёт вопрос, как грамотно заполнить массивы для переменных e, a, b, c и создать для них соответствующий цикл.

Rise 08.10.2014 11:32

Эдвард,
function calculator(form) {
	for (var i = 1, x = []; i < 4; i++) {
		switch (form['e'+i].value) {
			case 'ab':
				x = [1,1,''];
				break;
			case 'ac':
				x = [1,'',1];
				break;
			case 'bc':
				x = ['',1,1];
				break;
			default:
				x = ['','',''];
		}
		form['a'+i].value = x[0];
		form['b'+i].value = x[1];
		form['c'+i].value = x[2];
	}
}


Часовой пояс GMT +3, время: 16:33.