Вычисление формулы
★ Функция eval
Формула записана в скрипте
Формула вводится через поле ввода
★ Объект Math
★ Массив и цикл с выводом в таблицу
Вычисление формулы
Предположим, что мы хотим выполнить определенную математическую операцию
и вывести на экран монитора само математическое выражение и его результат.
Пусть нужно вычислить математического выражение ((23*7)-4)/10. Обозначим
это математическое выражение как переменную expr=((23*7)-4)/10.
Если мы хотим видеть на экране монитора эту формулу, то ее нужно записать
в виде строковой переменной (в кавычках) var expr="((23*7)-4)/10".
Если записать код вывода так: alert(expr+"="+expr)то в диалоговом окошке мы
вместо результата 15,7 имели бы сообщение:
((23*7)-4)/10=((23*7)-4)/10.
Функция eval
Для того, чтобы в диалоговом окне появилось сообщение
((23*7)-4)/10=15,7
нужно код вывода записать так: alert(expr+"="+eval(expr).В этом примере
мы встречаемся с использованием функции eval. Эта функция возвращает результат
выполненного математического действия в виде числа. Функция eval, содержит
в себе число, при этом еval(expr) остается строковой переменной.
Таким образом, переменная expr - это просто запись формулы. Результат же
вычисления будет содержаться в eval(expr), причем это число тоже будет иметь
смысл строковой переменной. Поэтому в alert знак равенства нужно заключить
в кавычки, а eval(expr) - не нужно: alert(expr+"="+eval(expr)).
В этом простом примере можно было бы обойтись без функции eval.
Для этого нужно было бы еще раз переписать формулу и объявить ее новой переменной
(например z). Тогда вывод имел бы следующий код: alert(expr+"="+z).
формула записана в скрипте.
<head>
<body>
<script>
function WW()
{
var expr=((23*7)-4)/10
alert(expr+"="+eval(expr))
q="<span style='font-size:30;color:green'>Вычисление математического выражения<BR></span>"
wr="<span style='font-size:50;color:red'>"+q+expr+"="+eval(expr)+"</span>"
document.write(wr)
}
</script>
<form>
</body>
</html>
А вот как скрипт РАБОТАЕТ в окне браузера (три строчки после alert относятся
к выводу по методу write).
Формула вводится через поле ввода.
Если в поле ввода записано число, а обращение к нему в скрипте
не будет содержать символа Number, то это число будет восприняты как строковая
переменная. Поэтому обращение к числам должно содержать символ Number. Более
сложный случай, когда в поле ввода записывается не одно число, а целое
математическое выражение, и нам нужно узнать результат вычисления.
Допустим, мы хотим узнать результат вычисления по формуле ((23*7)-4)/10
,
которая поступает в программу через поле ввода. Тогда мы обозначаем ее переменной
х и, обращаясь к ней, должны указать форму (form1)) и имя поля ввода (name) (num):
var x=document.form1.num.value. В такой записи (объяснение см. пример №1) х будет
строковой переменной и, чтобы перевести ее в число, мы используем функцию eval:
z=eval(x). Теперь х - это вид самой формулы, а z - численный результат вычисления
этой формулы.
<head>
<p id="my"></p>
<script>
function Show()
{
var x=document.form1.num.value
z=eval(x)
s1="<span style='font-size:25;color:blue'>Ответ<BR></span>"
q="<span style='font-size:30;color:green'>Вычисление математического выражения<BR></span>"
wr="<span style='font-size:50;color:red'>"+q+s1+x+"="+z+"</span>"
my.innerHTML=wr
}
</script>
<body>
<form name="form1" >
Введите формулу (num)<INPUT TYPE=text NAME="num" SIZE=20>
<INPUT TYPE="button" VALUE="Щелкни, чтобы получить результат" onClick="Show()">
</form>
</body>
</html>
А вот как скрипт РАБОТАЕТ в окне браузера.
Следует иметь в виду, что Вы смотрите представленный скрипт, дизайн которого
немного улучшен за счет CSS. Кроме того, окошко
с формулой и ответом закрывается само через 5 секунд.
Объект Math
Можно создать интерактивную программу, выполняющую математические
действия с числом, введенным в поле ввода. В частности можно создать
калькулятор, выполняющий операции, отсутствующие в бытовых микрокалькуляторах.
А именно, такие операции, как взятие логарифма, вычисление экспоненты и др.
При этом используются методы объекта Math.
Например, код вычисления натурального логарифма:
Math.log(x)
Вычисление экспоненты:
Math.pow(Math.E,x)
Теперь рассмотрим примеры.
Округление до нужного знака после запятой числа:
q.toFixed(1)
Здесь q округляемая величина.
Округление до нужного знака после запятой результата функции:
Math.log(x).toFixed(1)
Здесь х - аргумент функции.
А теперь посмотрите ПОСМОТРИТЕ на работу такого калькулятора.
Масств и цикл с выводом в таблицу
Если исходные данные для математических операций содержат фиксированный
набор чисел, но таких наборов с различными комбинациями чисел достаточно много,
работа с ними существенно усложняется. Придется задавать и обращаться к весьма
большому количеству переменных. В этом случае информацию о самих исходных данных
и результатах математических действий с ними можно получить всего одним кликом,
если указанную информацию оформить в виде массива.
Массив в JavaScript — это упорядоченный список элементов с указанным
индексом. Он предназначен для хранения совокупности определенных элементов и
получения доступа к ним с помощью одной переменной. Другими словами, массив –
это специальная переменная, которая может содержать более одного значения.
(обычные переменные, хранят только одно значение). Идексы массива начинаются
с 0 (ноль). Обозначение [0] - это первый элемент, [1] - это второй элемент.
Пара квадратных скобок [] с числами внутри их указывает на то, что мы имеем
дело с массивом. Если имя переменной а, то
код var a = 5;означает, что переменная сохраняет только одно значение - 5.
Если имя массива b, то код
var b = [2, 3, 5, 7]; означает, что переменная b - это массив, содержащий 4-е
переменные ( в данном случае 2, 3, 5, 7).
Пусть мы имеем дело с тремя масссивами из трех компонентов:
массив a: 2,1,2; массив b: 5,4,3; массив d: 2,1,0. Предположим (для простоты),
что мы хотим найти результат сложения и перемножения компонентов массивов.
Тогда скрипт (с выводом в таблицу) будет выглядеть так.
<script>
function opWin(){
var c = window.open("","","width=700,height=600,left=300, top=10" );
c.document.write("<FORM><INPUT TYPE=button VALUE='Закрыть окно' ONCLICK='window.close()'></FORM>")
massive_length=3; /*количество компонентов в массиве*/
a=[ 2, 1, 2 ]
b=[ 5, 4, 3 ]
d=[ 2, 1, 0 ]
sum= new Array(massive_length);
umn= new Array(massive_length);
rez= new Array(massive_length);
taba1="<p align='center'><TABLE style=' background-color:cfc; height:80px;'>"
tabaz1="</TABLE>"
td1="<TD style=' border:1 solid blue; background-color:yellow;
WIDTH:95px; height:50px;font-size:22;text-align:center'>"
tdz1="</TD>"
v1="<span style='font-size:15px;color:red;
font-weight:bold'>значения i оператора<BR>цикла for </span>"
v2="<span style='font-size:15px;color:red;
font-weight:bold'>компоненты<BR&массива<BR& a[i] </span>"
v3="<span style='font-size:15px;color:red;
font-weight:bold'>компоненты<BR&массива<BR& b[i] </span>"
v4="<span style='font-size:15px;color:red;
font-weight:bold'>компоненты<BR&массива<BR& d[i] </span>"
v5="<span style='font-size:15px;color:red;
font-weight:bold'>сложение<BR&sum=a[i]<BR&+b[i]+d[i]</span>"
v6="<span style='font-size:15px;color:red;
font-weight:bold'>умножение umn = a[i]<BR&*b[i]*d[i]</span>"
rt=taba1+td1+v1+tdz1+td1+v2+tdz1+td1+v3+tdz1+td1+v4+tdz1+td1+
v5+tdz1+td1+v6+tdz1+tabaz1
c.document.write(rt)
for (i=0; i<3; i++)
{
ir='i='
sum=a[i]+b[i]+d[i]
umn=a[i]*b[i]*d[i]
taba="<TABLE>"
tabaz="</TABLE>"
td="<TD style=' border:1 solid blue; background-color:yellow;
WIDTH:95px; height:50px;font-size:22;text-align:center'>"
tdz="</TD>"
rez=taba+td+ir+i+tdz+td+a[i]+tdz+td+b[i]+tdz+td+d[i]+tdz+
td+sum+tdz+td+umn+tdz+tabaz
c.document.write(rez)
}
}
</script>
<body>
<input type="button" value="смотреть" onclick="opWin()">
Краткие пояснения
Коды самих математических дествий (цикл и операции сложения и умножения)
занимают ничтожную часть скрипта
for (i=0; i<3; i++)
{
sum=a[i]+b[i]+d[i]
umn=a[i]*b[i]*d[i]
Большую часть скрипта занимают коды создания таблицы и вывода в нее компонентов массива и
результатов математических дествий.
Исходные массивы должны быть объявлены в начале скрипта. Массивы, соответствующие
последующим математическим действиям (sum[i] и umn[i]), также должны быть объявлены
кодом типа s= new Array(massive_length). Для исходного массива достаточно записать его длину
кодом (massive_length=3). Здесь massive_length=3 задает длину массива (количество элементов в массиве).
Если массив числовой, то при его задании числа нельзя ставить числа в кавычки. Иначе они становятся
строковой переменной и при сложении просто приставляются друг к другу. Наименования массива и
переменных в срипте не должны совпадать. Заметим, что переменные, обозначающие результат действий
с компонентами массивов, можно записывать без символа [i], если мы объявили их как массив. Т.е. вместо
rez[i] использовать обозначение rez, если выше записано rez= new Array(massive_length).
Если файл содержит только скрипт массива и цикла, то он срабатывает без кнопки и сохраняет
стиль CSS. Если массив и цикл находятся внутри функции, запускаемой кнопкой, то при нажатии кнопки
стиль CSS теряется, а результат появляется в новом окне. Для сохранения стиля его нужно указывать
внутри кода HTML.
Оглавление (простые скрипты для основных приложений JavaScript)
