🍁키 관련 이벤트 키 관련 이벤트는 onkeyXXX 형태를 가진다. 보편적으로 keydown을 사용한다. keyup을 사용하는 경우는 방금 누른 문자가 필요한 업무를 할 때이다. onkeydown 키를 눌렀을 때 발생한다. 키 이벤트 키를 누르고 있으면 연속 입력된다. function m1() { //console.log('keydown'); console.log(event.keyCode); //입력한 문자 코드 } 입력된 (물리)키는 구분이 가능하지만, 입력된 문자(같은 키에 할당된 a와 A)는 구분할 수 없다. keydown은 입력된 문자는 중요하지 않을 때, 물리키를 구분하는 용도로 사용한다. 모든 키에 반응하므로 keypress보다 keydown을 많이 사용한다. keypress는 Shift, C..
🍁Event 이벤트는 사건을 의미한다. 객체(태그 포함)에서 발생하는 사건을 전부 이벤트라고 부른다. 이벤트는 언제 발생할지 예측이 불가능하다. 🍂Event Handling 이벤트 핸들링은 이벤트 처리/등록에 관한 기능이다. 언제 발생할지 예측 불가능한 사건에 대비해 처리할 코드를 미리 준비해서 언젠가 사건이 발생하면 코드를 자동으로 실행하도록 할 수 있다. Oracle의 Trigger와 비슷한 느낌의 기능을 한다. 이벤트 등록 onXXX 속성(프로퍼티)을 제공한다. 동적 방식을 사용하면 HTML에 JavaScript 코드를 적지 않아도 되기 때문에 보통 동적 방식을 많이 사용한다. 코드 관리 차원에서 동적 방식을 주로 사용하는 편이다. 정적 방식 Event 정적 방식은 HTML 태그에 적용한다. 사건이..
🍁BOM과 DOM CSS는 태그를 조작할 때 선택자(HTML 태그 검색)로 접근을 하고 나서 조작했다. 마찬가지로 JavaScript에서도 HTML 태그를 검색하여 접근한 뒤에 조작한다. 이는 HTML 계층 구조를 활용하여 JavaScript로 탐색하는, 즉 태그를 찾는 방법에 대한 얘기이다. BOM이란? 자바스크립트 BOM (브라우저 객체 모델)은 브라우저의 창, 프레임 등의 브라우저의 요소를 객체로서 제어할 수 있게 해준다. BOM으로 브라우저와 상호작용하여 브라우저의 창 크기, 위치, 히스토리, 쿠키, 알림 등을 다룰 수 있다. BOM 객체로는 window, screen, location, history, navigator, document 등이 있으며, 이러한 객체들을 사용하여 웹 페이지의 동적인..
🍁배열 Array 객체 자바스크립트의 배열의 외형은 Array와 닮았고, 성질은 ArrayList와 닮았다. 길이가 가변적이고, 자료형은 Object이므로 Array와 ArrayList와 섞은 듯한 느낌이 든다. Array 내장 객체를 사용한다. 자바스크립트의 배열은 방의 길이가 없다 var nums = new Array(); nums[0] = 100; nums[1] = 200; nums[2] = 300; //nums[3] = 400; //nums[4] = 500; nums[5] = 600; for (var i=0; i
🍁날짜/시간 함수 Date 객체 자바스크립트에는 클래스가 없다고 했다. 하지만 내장 객체를 제공하므로, 이를 이용하여 객체를 생성한다. 현재 시각 var now = new Date(); //new 생성자함수(); console.log(now); console.log(typeof now); //object console.log(now)는 사실 객체가 가지고 있는 now.toString()이 출력된 것이다. 즉, 덤프 된 데이터(Thu Oct 05 2023 10:13:47 GMT+0900 (한국 표준시))가 출력된다. 이 요소를 추출해서 사용하기 좋게 바꿔보도록 하자. 요소 추출 날짜/시간 요소를 추출하는 전용 함수가 존재한다. console.log(now.getYear()); console.log(now...
🍁변수의 스코프 변수의 스코프는 변수 생명주기 혹은 영역이라고 부른다. Java와 JavaScript의 변수 Java 멤버 변수: 클래스 전역에서 사용할 수 있다. 지역 변수: 메서드 또는 제어문 전역에서 사용할 수 있다. static 변수도 멤버 변수의 일종이므로 Java에는 멤버 변수와 지역 변수만 존재한다. JavaScript 전역 변수: 한 페이지 내에서 사용할 수 있다. 변수 선언문이 실행될 때 생성이 되었다가 브라우저의 페이지가 바뀌는 경우(종료되는 순간) 사라진다. 지역 변수: 함수 내에서만 사용할 수 있다. 자바스크립트의 지역 변수는 함수 단위 지역 변수이므로 함수만 자기 영역으로 인식하고, 제어문은 영역으로 인식하지 못한다. 지역 변수는 함수만 자기 영역으로 인식한다는 점에서 함수 스코프..
🍁Function Java Method 자바의 메서드는 아래의 양식으로 만들어진다. public [static] int m1 (int num) { return 10; } 자바스크립트는 접근 지정자 표현이 없으므로 public을 생략한다. static은 정적인지를 묻는 키워드인데, 이 또한 클래스가 있어야 작성하는 것이므로 클래스가 없는 자바스크립트에서는 생략한다. 자바스크립트에서는 자료형(number, string, boolean, object)을 명시적으로 표현이 불가능하다. 돌려주는 자료형을 선언하고 싶어도 명시적인 표현이 불가능하기 때문에 자바스크립트에서는 메서드 이름이 가장 처음에 나온다. JavaScript Function function m1(num) { return 10; } num 앞에 v..
🍁자료형 JavaScript에서 자료형은 메모리를 따지지 않는다. JavaScript는 Java보다 훨씬 단순한 자료형을 가지고 있다. number 숫자형(정수, 실수) var num; num = 10; var num2 = 3.14; var num3, num4; var num5 = 10, num6 = 20; string 문자/문자열 var name1 = 'Isaac'; var name2 = "Isaac"; 선언을 할 때 홑따옴표와 큰따옴표 둘 다 사용할 수 있다. boolean 논리형 var flag = true; object 객체형 var now = new Date(); JavaScript에는 클래스가 없지만 객체 개념은 있다. 그리고 JavaScript에는 이미 만들어진 클래스의 객체가 있다. 이 말..
