<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>
짜가계산기
</title>
<meta name="Generator" content="EditPlus">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<meta http-equiv="Content-Type" content="text/html; charset=ks_c_5601-1987">
</head>
<body>
<style>
.btn{width:40} .btn2{width:88}
</style>
<script>
old = new Array();
function init() {
document.f.t.value = "";
isOp = false;
str = 0;
oprt = "";
}
function putn(value) {
if (!isOp) {
document.f.t.value += value;
} else if (isOp) {
document.f.t.value = value;
isOp = false;
} else {
document.f.t.value += value;
}
}
function operator(value) {
str = document.f.t.value;
isOp = true;
oprt = value;
}
function calc() {
str2 = document.f.t.value;
if (str != "" && str2 != "") {
str = eval(str + oprt + str2);
document.f.t.value = str;
}
}
function reset() {
str = "";
document.f.t.value = "";
oprt = "";
isOp = false;
}
</script>
<body onload=init();>
<table border=6 width="247">
<tr>
<form name=f>
<td colspan=5>
<input type=text name=t value="" size=30>
</td>
</tr>
<tr>
<td width="40">
<input type=button onclick=putn(7) value=7 class=btn>
</td>
<td width="40">
<input type=button onclick=putn(8) value=8 class=btn>
</td>
<td width="41">
<input type=button onclick=putn(9) value=9 class=btn>
</td>
<td width="40">
<input type=button onclick=operator("/") value="/" class=btn>
</td>
<td width="40">
<input type=button value="pow" class=btn>
</td>
</tr>
<tr>
<Td width="40" height="25">
<input type=button onclick=putn(4) value=4 class=btn>
</td>
<td width="40" height="25">
<input type=button onclick=putn(5) value=5 class=btn>
</td>
<td width="41" height="25">
<input type=button onclick=putn(6) value=6 class=btn>
</td>
<td width="40" height="25">
<input type=button onclick=operator("*") value="*" class=btn>
</td>
<td width="40" height="25">
<input type=button value="sqrt" class=btn>
</td>
</tr>
<tr>
<td width="40">
<input type=button onclick=putn(1) value=1 class=btn>
</td>
<td width="40">
<input type=button onclick=putn(2) value=2 class=btn>
</td>
<td width="41">
<input type=button onclick=putn(3) value=3 class=btn>
</td>
<td width="40">
<input type=button onclick=operator("-") value="-" class=btn>
</td>
<td width="40">
<input type=button value="log" class=btn>
</td>
</tr>
<tr>
<td width="40">
<input type=button onclick=putn(0) value=0 class=btn>
</td>
<td width="40">
<input type=button onclick=putn('.') value="." class=btn>
</td>
<td width="41">
<input type=button onclick=operator("+") value="+" class=btn>
</td>
<td width="40">
<input type=button value="%" class=btn>
</td>
</td>
</tr>
<tr>
<td colspan=2>
<input type=button onclick=reset() value="지우기" class=btn2>
</td>
<td colspan=3>
<input type=button onclick="calc()" value="계산하기" class=btn2>
</td>
</form>
</table>
</body>
</html>
함수 ¶
- 중첩함수
function duple_test() {
function inner() {
/* body comes here */
}
} // good
- 내부 익명함수는 접근할 수 없기 때문에 안됨
function duple_test() {
function () {
/* body comes here */
} // anonymous inner class can't be reached
} // bad
- 이 방법은 된다
function duple_test() {
var one = function () {
} // anonymous but reachable
}
- 여러번 중첩되어도 된다
function one(){
function two() {
function three() {
/* body comes here */
}
}
} // good
- 함수 파라메터
/* Arguments 객체 테스트 */
function arg_test(one, two) {
document.write(one);
document.write(arguments[0]);
document.write(two);
document.write(arguments[1]);
document.write(arguments.length);
document.write(arguments[3]); // 존재하지 않는 배열을 참조한다면? -> undefined
arguments[3] = 5; // 내부에서 파라메터 삽입 가능!!
document.write(arguments[3]);
}
arg_test(3, 4);
- 클래스 생성
/* 클래스 만들기 */
function Class_test(one, two) {
this.one = one;
this.two = two;
}
/* 객체 생성 */
var instance = new Class_test(1, 2);
- 상속
- 자바스크립트의 상속은 객체지향언어의 상속과 다르다.
- 자바스크립트의 상속은 객체지향언어의 상속과 다르다.
function MyClass(id, name){
this.id = id;
this.name = name;
}
var class_test = new MyClass("1", "test");
MyClass.prototype.name1 = "name1";
class_test.name2 = "name2";
document.write(class_test.name1); // 여기서 상속이 일어나야함....
}
- 슈퍼클래스화, 서브클래스화
// 슈퍼클래스
function Parent(m, f) {
this.mother = m;
this.father = f;
}
- 서브클래스화 1
function Child(m, f, b, s) {
Parent.call(m, f); // 생성자 체이닝
this.brother = b;
this.sister = s;
}
Child.prototype = new Parent();
Child.prototype.constructor = Child;
- 서브클래스화 2
function Child(m, f, b, s) {
this.superclass(m, f); // 생성자 체이닝
this.brother = b;
this.sister = s;
}
Child.prototype.superclass = Parent;










