Java Script
function closure
- inner function에서 사용하는 로컬변수는 closure라는 별도의 메모리 영역에서 관리된다.
- 이 기능을 이용하여 OOP 캡슐화를 구현할 수 있다.
function closure를 활용한 캡슐화 구현.
function Calculator(){
var result = 0;
var expression = "0";
this.setResult = function(res){
result = res;
expression = res;
}
this.getResult = function(){
return result;
}
this.getExpression = function(){
return expression;
}
this.plus = function(v){
result += v;
expression += " + " + v;
};
this.minus = function(v){
result -= v;
expression -= " - " + v;
};
this.multiple = function(v){
result *= v;
expression *= " * " + v;
};
this.divide = function(v){
result /= v;
expression /= " / " + v;
};
}
var calc1 = new Calculator();
var calc2 = new Calculator();
calc1.plus(10); // 10
calc2.plus(20); // 20
calc1.multiple(2); // 20
calc2.minus(17); // 3
calc1.result=1000;
console.log(calc1.getExpression() + "=" + calc1.getResult());
console.log(calc2.getExpression() + "=" + calc2.getResult());
pulling 기법
- 일정 시간마다 서버에 요청해서 data를 받는 법.
Document Object Model (DOM tree)
- DOM API 는 표준이다.
==============================================================================
load 이벤트
- DOM tree 완료 -> 출력 완료 -> 이벤트 발생
- window.onload 함수가 있다면 호출
click 이벤트
- 사용자가 마우스를 클릭을 할때 이벤트 발생
- 클릭한 객체의 onclick 함수가 있다면 호출.
- 이벤트가 발생될 때 호출될 함수를 '리스너'라 부른다.
ex)
<!DOCTYPE html>
<html>
<head>
<script>
window.onload = function () {
// 변수를 선언합니다.
var header = document.getElementById('header');
// 이벤트를 연결합니다.
header.onclick = function () {
alert('클릭');
};
};
</script>
</head>
<body>
<h1 id="header">Click</h1>
</body>
</html>
