자바 34

[node.js] 이벤트

이벤트Node.js 의 큰 특징 중 하나는 이벤트 기반 비동기 프로그래밍이 가능하다는 점이다. 자바스크립트는 다른 프로그래밍 언어와 비교했을 때 함수 생성과 이벤트 연결이 굉장히 쉬우므로 이벤트 기반 프로그래밍을 하기 좋다. 큰 개념on(eventName, eventHandler) - 이벤트를 연결하는 메서드.emit() - 이벤트를 실행할 때 사용.EventEmitter 객체 – 이벤트를 연결할 수 있는 모든 객체의 어머니. 기존의 자바스크립트 이벤트연결 load를 이벤트 이름 또는 이벤트 타입 이라고 한다. 또한 매개변수로 입력한 함수를 이벤트 리스너 또는 이벤트 핸들러라고 한다. node.js에서 이벤트 연결// process 객체에 exit 이벤트를 연결합니다.process.on('exit', f..

[자바스크립트 기초 ]이벤트의 종류와 개념 2

이벤트의 흐름HTML 요소는 다른 요소의 내부에 중첩된다. 그래서 링크에 마우스를 가져가거나 클릭하면 그 부모 요소에도 마우스를 가져가거나 클릭한 셈이 된다.이벤트 버블링이벤트가 사용자의 동작에 직접적으로 영향을 받은 특정 노드로부터 시작하여 가장 무관한 요소를 향해 바깥으로 전파되어 나가는 방식이다. 대부분의 브라우저가 기본적으로 지원하는 방식이다. => => => => 이벤트 캡쳐링이벤트가 가장 바깥쪽의 노드로부터 시작해서 안쪽으로 전파되어 들어오는 방식이다. => => => => 현재의 모든 브라우저들은 기본적으로 이벤트 캡쳐링 대신 이벤트 버블링을 사용한다. 리스너를 사용하는 경우 addEventListener () 메서드의 마지막 매개변수에 설정하는 값에 따라 발생한 이벤트의 전파 방향을 선택할..

[자바스크립트 기초]DOM 문서객체모델의 이해1

문서 객체 모델은 브라우저가 HTML 페이지의 모델을 생성하고 이 페이지가 브라우저 창에 보여지는 동안 자바스크립트를 이용하여 웹페이지의 내용에 접근하고 수정하기 위한 방법을 명시하고 있다. HTML 페이지에 대한 모델 구성하기브라우저는 웹 페이지를 로드한 후 , 이 페이지에 대한 모델을 메모리에 생성한다. HTML 페이지에 접근하고 수정하기DOM은 모델 내의 각 객체에 접근하고 내용을 수정하기 위한 속성과 메서드들을 정의하고 있다. 내용을 수정하면 브라우저에서 사용자가 보게 될 내용이 변경된다. DOM은 브라우저가 DOM트리를 이용하여 이 모델을 구성하는 방법을 명시한다.DOM이 객체 모델이라고 불리는 이유는 모델이 객체를 이용하여 구성되기 때문이다. 웹 페이지에 대한 모델로서의 DOM 트리브라우저는 ..

[자바스크립트 기초]함수 메서드 객체

함수와 메서드함수는 특정 작업을 수행하기 위해 필요한 일련의 구문으로 구성된다. 메서드는 함수와 동일하지만 객체 내에 만들어진다는 점이 다르다. 객체실제 세계를 모델화하기 위해 객체를 사용한다.객체는 속성과 메서드로 구성된다. 내장객체브라우저는 인터랙티브한 웹 페이지를 개발하기 위한 도구의 역할을 수행하는 다양한 종류의 객체들을 제공한다. 함수란 무엇인가?함수란 어떤 특정 작업을 수행하기 위해 필요한 일련의 구문들을 그룹화하기 위한 개념이다. 만일 스크립트의 다른 부분에서 동일한 작업을 반복적으로 수행해야 한다면 함수를 재사용할 수 있다. 기본적인 함수var msg = '안녕하세요'; //함수 생성function updateMessage() { var el = document.getElementById(..

[자바스크립트 기초] 자바스크립트의 기본 명령어

구문: 스크립트는 컴퓨터가 단계별로 수행할 수 있는 일련의 명령이다.이 중 각각의 명령이나 단계를 구문이라고 한다.구문은 세미콜론으로 끝나야 한다. //구문var today = new Date();var hourNow = today.getHours();var greeting; // { } 코드블록의 시작과 끝을 알려준다. 구문은 코드 블록 내에 작성한다. if (hourNow > 18) { greeting = 'Good evening!';} else if (hourNow > 12) { greeting = 'Good afternoon!';} else if (hourNow > 0) { greeting = 'Good morning!';} else { greeting = 'Welcome!';}document.w..

[자바스크립트 기초] 스크립트 왕기초 개념 2

자바스크립트 언어는 html과 css와 함께 사용된다. 콘텐츠 계층.html 파일페이지의 구조를 만들고 의미를 부여한다. {css}콘텐츠가 보여지는 방법을 서술한다.(배경, 테두리, 글꼴, 색상 등) javascript()페이지의 동작을 변경하며 역동성을 부여한다. * 기본적인 자바스크립트 코드 작성하기 지금은 몇시? 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687 인사 지금은 몇시? var today =new Date(); var hourNow=today.g..

[자바스크립트 기초] 스크립트 왕기초 개념 1

기초중의 기초 !! 컴퓨터는 데이터를 이용하여 세상을 표현하기 위한 모델을 만든다! 호텔, 자동차 같은 객체는 개발자가 데이터만 잘 만들고 전달해 주면 컴퓨터는 우리가 원하는 명령을 실행해서 작업을 수행할 수 있다. 객체와 속성컴퓨터에서 실제 세계에 존재하는 물리적인 물체는 다양한 종류(type)의 객체(object)로 표현된다. 개발자라면 그 객체들을 인스턴스라고 표현할 것이다.객체는 다음과 같은 정보를 가진다. 속성, 이벤트, 매서드 이 세 가지가 결합하여 객체를 표현하는 모델을 구성한다. 속성(특징): 자동차를 예를 들면 자동차의 속도, 색상, 크기 등이 속성이다. 속성은 이름과 값, 즉 name과 value로 구성된다. 예) 자동차의 속성이름 : 값제조사: 현대속도: 60km색상: 검정 실제 세계..

[자바기초] 2.식별자와 상수

식별자와 키워드, 변수와 상수, 자바의 자료형등과 같은 형변환을 위해 필요한 지식을 알아보자 학습목표*식별자와 키워드의 개념과 형식을 알고 식별자를 만드는 방법 공부*변수와 상수의 개념을 파악하고 변수를 선언하는 방법 알아보기*자바의 자료형 타입과 형식을 알고 선언하는 방법*demotion과 promotion을 사용하는 방법을 설명할 수 있다.*자바의 데이터형을 형 변환 하여 데이터 변수에 적용하는 방법을 설명할 수 있다. 공부내용식별자와 키워드변수와 상수자바의 자료형demotion과 promotion 자바의 형 변환 체크해보기1.식별자란 프로그래밍 언어에서 변수, 상수, 배열, 클래스, 메서드, 레이블 등을 식별하기 위하여 붙이는 이름을 말한다.2.키워드란 주요단어란 뜻으로 자바에서 미리 사용하기 위해..

코딩 노트/JAVA 2017.01.03

[자바기초] 1.java언어의 탄생 배경과 특징

자바는 누가 만들었나?자바는 월드 와이드 웹이 개발되기 시작하였던 1991년 썬 마이크로시스템즈에서 제임스 고슬링에 의해 탄생되었다. 자바의 특징- 자바 애플릿은 HTML에서 사용자와 서버 사이의 다이나믹 환경을 제공하는 작은 프로그램으로 애니메이션이나, 간단한 게임 그리고 사용자가 서버에 별도의 요청을 하지 않고서도 수행할 수 있는 단순한 작업들을 수행할 수 있어 빠르게 확산, 대중화를 이루게 된다.- 자바 컴파일러는 바이트 코드라는 중립적인 구조의 실행코드를 만들어 낸다.- 바이트 코드는 각 플랫폼에 있는 인터프리터를 통해 실제로 실행된다. 시대별 특징 1991년자바는 월드 와이드 웹이 개발되기 시작하였던 1991년 썬 마이크로시스템즈에서 제임스 고슬링에 의해 탄생되었다. (단순하고 버그가 없는 가전..

코딩 노트/JAVA 2017.01.02

왕 기초 자바스크립트 - 배열

======================= ======================================= var 무작위단어 = ["폭발", "동굴", "공주", "펜"];var 무작위색인 = Math.floor(Math.random() * 4);무작위단어[무작위색인];// "동굴" 무작위단어[Math.floor(Math.random()*4)];// "공주" =====================================var 색상목록 = ["푸른", "붉은", "검은", "하얀"];var 자연목록 = ["늑대", "태양", "독수리", "바람"];var 단어목록 = ["눈물", "환생", "기상", "일격", "유령"]; // 색상목록 배열에서 무작위 단어를 하나 고릅니다var 색상 = 색상..