[내가 보려고 만든] javascript 문법 정리

기본적인 javascript 문법에 대한 정리이다.

​

- document.write() : html 문서에 콘텐츠를 추가하는 명령어로 화면 출력 명령어이다. html 태그를 추가할 시 태그가 해석되어 출력된다.

​

<자바스크립트 기본 변수>

- 대부분의 자바스크립트 변수는 사용 전에 선언할 필요가 없고, 타입 또한 지정할 필요가 없다.

기본 변수 타입은 다음과 같다.

​

Number, String, Boolean, Undefined, Null

​

*Number는 모든 숫자를 실수로 저장한다.

*숫자와 문자열 타입 간의 비교 시에는 숫자에서 문자열로 자동 형변환을 제공한다.

*typeof()연산자로 변수 타입 확인이 가능하다.

​

​

<자바스크립트 변수 선언>

- 변수 이름은 대소문자를 구분한다.

​

ex) var 변수명;

var 변수명 = 변수값;

- 전역 변수로 사용 시 미리 선언되어 있어야 하지만 이외에는 사전 선언 없이 변수 사용이 가능하다.

- 변수에 저장되는 값에 따라 변수의 타입이 결정된다.

- 실행 중에 변수 타입 변경이 가능하다.

​

​

<자바스크립트 기본 연산자>

* === , !== : 양쪽 값의 타입 비교

* ==, != : 양쪽 값 비교

​

<숫자와 문자열의 크기 비교>

- 문자열이 숫자라면 숫자로 변환하여 비교한다. 만약 숫자가 아니라면 false.

- 문자열과 숫자를 더하면 숫자를 문자열로 변환

​

<변수 형변환>

- 문자열 -> 숫자 : parseInt(), parseFloat() 함수 사용

- 숫자 -> 문자 : toString() 사용

​

<입출력 대화상자>

1. alert() : 대화상자로 메시지를 출력한다.

- 경고사항이나 메시지 전달

- [확인] 버튼을 클릭 시 창 닫힘

​

2. confirm() : 확인 입력 받기

- 대화상자 내에 메시지를 표시하고 [확인],[취소] 버튼을 표시한다.

- [확인] : true, [취소] : false 반환

​

3. prompt() : 문자열 입력 받기

- 사용자로부터 문자열을 입력받는 대화상자

- 메시지와 입력상자(초기 입력 값)가 표시된다.

- [확인] : 입력된 문자열, [취소] : null 반환

​

​

<제어문>

1. if-then-else : 실행될 문장이 한 개인 경우는 {} 생략

2. switch : 정수형 이외의 타입도 사용 가능 (문자열 형식도 가능)

​

<반복문>

1. while

2. for

3. do-while

​

<내장 함수>

- eval() : 문자열 입력을 계산하여 결과 반환

- setTimeout() : 일정시간의 지연시간 발생. 지정된 시간 후에 매개변수로 지정된 함수를 호출

(지연시간은 millisecond 단위)

​

<사용자 정의 함수>

- 매개변수와 인수의 자료형, 개수가 같은지 확인 x

​

<자바스크립트 객체>

1. 내장 객체 (제공)

- Array, Date, Math, String, window, navigator

​

1) Date 메소드 : 사용자 컴퓨터의 현재 시간을 구함

- getFullYear() : 연도

- getMonth() : 월

- getDate() : 일

- geteDay() : 요일

- getHours() : 시

- getMinutes() : 분

- getSeconds() : 초

- getTime() : 1970년 1월 1일 이후 현재까지의 시간을 millisecond 단위 리턴

- getTimezoneOffset() : 표준시와 현지 시간의 차이를 분 단위로 리턴

​

- get - >set으로 바꾸면 사용자 컴퓨터의 시간 설정

​

2) Math객체 : 수학 계산 객체 (생성, 선언 없이 바로 사용 가능)

* 상수 값은 객체의 속성으로 제공

- E : Euler 상수 값 (약 2.718)

- LN2 : 자연로그2 (약 0.693)

- LOG2E : 약 1.442

- PI : 원주율

- SQRT2: 루트2 (약1.414)

​

*메소드

- cos(), sin(), tan() :삼각함수

- acos(), asin(), atan() : 삼각함수의 역함수

- ceil(), floor(), round() : 올림, 내림, 반올림

- max(), min(), abs() : 최대, 최소, 절대값

- sqrt(x), pow(x,y) : 루트x, x의 y승

- log(x), exp(x) : 로그식

​

​

3) navigator : 브라우저 정보를 가지고 있음 (종류, 버전)

- userAgent, appName, appVersion, appCodeName, platform

 

​

4) window : 브라우저 창에 대한 객체

- open() : 새로운 창을 엶

- close() : 열려 있는 창을 닫음

- alert(), confirm(), prompt() : 입출력 함수

​

​

5) document : html 문서에 대한 객체

​

​

2. 사용자 정의 객체

- new 명령어로 객체 생성 - 처음에는 빈 객체

- 메소드와 속성을 동적으로 추가

- 다양한 변수형 속성 가능

- 객체의 속성으로 객체 가능

- [],','로 접근

- delete 로 삭제

- 개선된 for 문으로 모든 속성 접근 가능

ex) for (var p in 객체 이름)

- this : 객체 자신을 지칭

- 객체의 속성값으로 함수를 저장하면 객체의 메소드가 된다.

​

​

​

3. 배열 객체 : 여러 개의 데이터 요소를 처리할 경우

- 각 요소가 동일한 자료형이 아니어도 됨

- 배열 크기를 언제라도 늘리거나 줄일 수 있음

- reverse() : 요소들의 순서를 반대로 바꿈

- sort() : 오름차순 정렬 (숫자도 문자열로 변환)

- concat() : 배열의 뒤에 요소를 붙여서 내용 추가(쉼표로 연결해서 여러 요소 추가 가능)

- slice() : 요소의 일부를 새로운 배열로

- join(" ") : ""안의 요소로 배열 안의 요소들을 연결

​

​

​

<Dom(document Object Model)>

- 자바스크립트로 웹문서를 객체 형태로 다루는 모델

- 계층적 구조 (트리)

- html의 태그 요소가 dom의 하나의 객체로 표현된다.