2015-05-30
752
В javascript определены некоторые стандартные объекты и функции. Рассмотрим объект math и его методы.
Объект math работает с математическими функциями, а его методы можно использовать для вызова этих функций. Ниже представлены некоторые методы объекта math:
abs абсолютное значение
sin, cos, tan тригонометрические функции
log натуральный логарифм
exp экспонента
pow показательная функция
sqrt квадратный корень
Предположим мы хотим написать сценарий, который будет вычислять площадь треугольника по трем его сторонам. Для этого нам потребуется использовать формулу Герона:
Напишем в html-странице код формы:
<html>
<head>
<title>math javascript</title>
<script type="text/javascript" src="script.js"></script>
</head>
<body>
<form name="forma3">
Сторона 1 <input type="text" size="8" name="st1">
Сторона 2 <input type="text" size="8" name="st2">
Сторона 3<input type="text" size="8" name="st3"><br><br>
<input type="button" value="Вычислить" onClick="areaOfTriangle(forma3);">
<input type="reset" value="Отменить">
|
|
|
Результат <input type="text" size="8" name="res">
</form>
</body>
</html>
Здесь нет ничего нового. Теперь на странице script.js напишем код функции:
function areaOfTriangle(obj){
var a=1*obj.st1.value;
var b=1*obj.st2.value;
var c=1*obj.st3.value;
var p=(a+b+c)/2;
var s=Math.sqrt(p*(p-a)*(p-b)*(p-c));
obj.res.value=s; }
Также обратите внимание на первые три строчки функции, они начинаются с 1*, т.е. наши переменные a, b, c мы умножили на единицу. Зачем? У каждой переменной есть тип, который определяется автоматически. Так как наши переменные приходят из текстового поля, то и тип они имеют string, т.е. они воспринимаются функцией не как числа, а как буквы.
Если бы мы перемножали эти переменные, то их тип автоматически переопределился бы к number, но мы их складываем, а знак операции + расценивается в данном случае, как конкатенация строк. Чтобы этого не происходило, мы и умножили наши переменные на единицу, преобразовав их таким образом к типу number.
Еще один пример.
Пусть у нас есть вот такая картинка. Ширина оригинала 302 пиксела. Мы же хотим, чтобы на странице картинка имела ширину 102 пиксела, а при наведении курсора, увеличивалась до 302 пикселов. С html-страницей все понятно:
<html>
<head>
<title>javascript if</title>
<script type="text/javascript" src="script.js"></script>
</head>
<body>
<img src="imk.jpg" name="tigr" width="102" onMouseOver="bigPict()">
</body>
</html>
А в нашей функции воспользуемся стандартной функцией javascript setTimeout, которая вызывает пользовательскую функцию с заданным промежутком времени:
function bigPict(){
var w=document.tigr.width;
if (w<302){
document.tigr.width=w+10;
document.tigr.src="imk.jpg "
setTimeout("bigPict()", 500)
}
}
Таким образом, функция проверяет ширину картинки (width) и, если она меньше 302 пикселов, то увеличивает эту ширину на 10 пикселов. Функция setTimeout вызывает нашу функцию bigPict каждые полсекунды, благодаря чему размер картинки будет увеличиваться до тех пор, пока условие w<302 не станет ложным.
