티스토리 뷰
반응형
* 문자열 내에서 원하는 문자열 검색
- String 객체에는 문자열과 관련된 메소드가 여럿 있다. 그 중에서도 문자열의 위치와 관련된 메소드들을 소개하겠다.
- 중요 메소드
1. Indexof : 지정한 문자열의 첫번째 인덱스 위치를 알아냄
2. lastIndexOf : 지정한 문자열의 마지막 인덱스 위치를 알아냄
3. charAt() : 지정한 위치의 문자가 무엇인지 알아냄
4. charCodeAt() : 지정한 위치의 문자를 유니코드로 변환
5. formcharCode() : 유니코드를 문자로 변환
* Math 객체
- Math 객체는 수학적인 계산과 관련된 객체이다.
- Math 객체는 따로 인스턴스를 만들지 않는다.
* Math 메소드
* 배열
- 변수를 배열로 사용하려면 new 를 이용해서 Array 객체의 인스턴스를 만들어야 한다.
- 배열의 크기를 처음부터 지정하기 힘들 경우에는 따로 크기를 입력하지 않아도 된다. 그 대신 나중에 배열에 초기값을 할당하면 그 개수만큼의 배열이 만들어진다.
ex) arr = new Array();
arr[0] = "일요일";
arr[1] = "월요일";
...
- 배열 선언 방법
1. var objArray = [];
2. var objArray = new Array();
3. var objArray = new Array(10);
4. var objArray = new Array([1,2,3]);
5. var objArray = [1,2,3];
* 배열 중요 메소드
* 계산기를 만들어 봅시다 !
|
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
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124 |
<!DOCTYPE html>
<html>
<head>
<title>계산기</title>
<script type="text/javascript">
var flag=false;//0이 있는 상태
function operation(num){//값 받기
if (flag==false) {//초기화//0이 없는 상태로 만들기
//flag=false;
cal.result.value="";//값 초기화
flag= true;//0이 없는 상태가 됨
}
cal.result.value+=num;
}
function output(){//result에 출력 함수
var str = cal.result.value;
var strArray = str.split('^');//문자열 자르는 기준 : ^
var findValue = "^";
cal.result.value = eval(cal.result.value);//문자열 연산
if (str.indexOf(findValue) != -1) {
//만약 내 출력 값에 ^ 가 들어간다면
cal.result.value = Math.pow(strArray[0],strArray[1]);
}
}
function cle(){//clear버튼
if (flag==true) {//0이 없는 상태
flag=false;//0이 있는 상태
cal.result.value = "0";
}
}
function backSpace() {//지우기 함수
cal.result.value =
cal.result.value.substring(0, cal.result.value.length-1);
// substring 으로 0부터 value 길이에서 -1 한 만큼의 길이를 출력한다
}
function sa(){//sin함수
cal.result.value = Math.sin((cal.result.value*3.14159265359)/180);
}
function co(){//cos함수
cal.result.value = Math.cos((cal.result.value*3.14159265359)/180);
}
function ta(){//tan함수
cal.result.value = Math.tan((cal.result.value*3.14159265359)/180);
}
function posinag(){//양수 음수 바꾸기
output();//먼저 계산한 다음 양수 음수 바꾸기
cal.result.value = cal.result.value * -1;
}
</script>
</head>
<body>
<div align="center">
<h3>★Jerry 계산기★</h3>
<br>
<form name="cal">
<table >
<!-- 첫번째 줄 -->
<tr>
<td colspan="6">
<input style="text-align: right;" type="result" name="result" value="0" ></td>
</tr>
<!-- 두번째 줄 -->
<tr>
<td align="center" colspan="3">
<input type="button" name="clear" value="Clear" onclick="cle()"></td>
<td align="center">
<input type="button" value="=" onclick="output()"></td>
<td align="center" colspan="2">
<input type="button" value="<--" onclick="backSpace()"></td>
</tr>
<!-- 세번째 줄 -->
<tr>
<td>
<input type="button" value="1" onclick="operation(value)"></td>
<td align="center">
<input type="button" value="2" onclick="operation(value)"></td>
<td><input type="button" value="3" onclick="operation(value)"></td>
<td colspan="2" align="center">
<input type="button" value="+" onclick="operation(value)"></td>
<td align="center">
<input type="button" value="^" onclick="operation(value)"></td>
</tr>
<!-- 네번째 줄 -->
<tr>
<td><input type="button" value="4" onclick="operation(value)"></td>
<td align="center">
<input type="button" value="5" onclick="operation(value)"></td>
<td><input type="button" value="6" onclick="operation(value)"></td>
<td colspan="2" align="center">
<input type="button" value="-" onclick="operation(value)"></td>
<td align="center">
<input type="button" value="sin" onclick="sa()"></td>
</tr>
<!-- 다섯번째 줄 -->
<tr>
<td><input type="button" value="7" onclick="operation(value)"></td>
<td align="center">
<input type="button" value="8" onclick="operation(value)"></td>
<td><input type="button" value="9" onclick="operation(value)"></td>
<td colspan="2" align="center">
<input type="button" value="*" onclick="operation(value)"></td>
<td align="center">
<input type="button" value="cos" onclick="co()"></td>
</tr>
<tr>
<td><input type="button" value="0" onclick="operation(value)"></td>
<td><input type="button" value="+/-" onclick="posinag()"></td>
<td align="center">
<input type="button" value="." onclick="operation(value)"></td>
<td colspan="2" align="center">
<input type="button" value="/" onclick="operation(value)"></td>
<td align="center">
<input type="button" value="tan" onclick="ta()"></td>
</tr>
</table>
</form>
</div>
</body>
</html> |
cs |
* 완성 모습
반응형
'Web > JavaScript & JQuery' 카테고리의 다른 글
| [JavaScript] 뒤로가기 버튼 막기 (3) | 2018.05.11 |
|---|---|
| [JavaScript]회원가입 유효성 만들기 (0) | 2018.04.06 |
| [JavaScript]달력 만들기, Date 객체 (12) | 2018.04.06 |
| [JavaScript]HTML 에서 JavaScript 호출하기 (0) | 2018.04.04 |
| [JavaScript]글자 변경 폼 만들기 (0) | 2018.04.04 |
댓글
공지사항