01. Javascript 란
브라우저를 제어하기 위한 넷스케이프에서 개발한 언어
사용자의 클릭, 계산기 등의 이벤트 조작에 대응하기 위한 언어
자바스크립트의 확대
- Ajax 활용 (구글맵)
- 디버깅툴의 발전
- 파이어폭스의 콘솔로그
- 크롬의 V8 엔진 개발
- V8 엔진 기반의 서버 사이드 javascript 개발
- Node.js
- 여러 플랫폼에서 js 기반의 환경 조성
- Desktop, IOT 등에서
변수형
js는 동적언어이므로 자료형을 선언할 필요가 없음
기본 자료형과 객체(Object) 두가지로 나뉨
기본자료형 설명 Boolean 논리적 요소 (true / false) Null 객체 값이 존재하지 않는다는 의미 Undefined 값을 할당하지 않음 Number 숫자형 String 문자형 Symblo ECMAScript 6에서 추가, 유일하고 변경 불가
02. 배열
- 배열도 기본 자료형 중에 하나
- 예제:
['안녕', 'Node.js', 55, 'Hello']
- 위와 같이, 문자형과 숫자형이 섞여있든 요소에 대한 자료형이 통일되지 않아도 되는 구조
- 배열에는 인덱싱이라는게 있음
- 예제의
'안녕'
을 기준으로 인덱싱이0
이 되며 차례대로 1,2,3 ….
- 예제의
- 배열의 인덱싱을 통해 overwrite 가능
example[0] = 'Hi'
03. 반복문
대표적으로
for
,while
,do-while
문이 있음for 문
1
2
3for (var i = 0; i<10; i++) {
// .....
}
while 문
1
2
3
4
5var i = 0 // 초기화 조건
while (i < 10) {
// .....
i = i+1;
}do .. while 문
1
2
3
4
5var i = 0;
do {
// .....
i = i + 1;
} while (i < 5)while
문과do ... while
문의 차이는while
의 조건문을 언제 시작하느냐do ... while
의 경우 일단do { ... }
문을 실행한 뒤while
문을 실행
04. 함수
1 | // Car 라는 틀(prototype) 생성 |
05. 프로토타입
js는 프로토타입 기반 언어이다.
예제
1
2
3
4
5
6function Car (a, b, c) {
// function의 member 선언
// this는 public 변수
this.name = a;
this.color = b;
}1
2// 객체 생성 , 변수 a는 Car의 인스턴스
var a = new Car('현대', '노랑');
자바스크립트는
Car
에 프로토타입 이라는 것이 있음프로토타입을 기준으로 객체. 즉, 인스턴스를 생성
예제
1
2
3
4
5
6
7Car.prototype.move = function () {
// Car의 prototype에 접근해 함수를 추가
console.log(this.name + '차이고'+ this.name + '색이다')
}
a.move()
// 현대차이고 노랑색입니다.1
2
3
4
5
6
7Car.prototype.move = function () {
// Car의 prototype에 접근해 함수를 추가
console.log(this.name + '차이고'+ this.name + '색이다')
}
a.move()
// 현대차이고 노랑색입니다.
예제
1
2
3
4
5
6
7
8
9
10
11
12
13var a = [1, 3, 5, 7, 9]
// 배열의 prototype에 접근해 커스텀 함수 추가
Array.prototype.print = function () {
for (var i=0;i < this.length; i++) {
console.log(this[i])
}
}
a.print()
// 1
// 3
// 5
// 7
// 9
보충해서 볼것
- 변수형
- 프로토타입
- 함수 선언식과 표현식