1. 배열이란?
1) 배열 (Array) : 변수(저장 공간)들의 집합
- 같은 유형의 여러 값들을 저장하기 위해 배열을 사용한다.
- 여섯 가지 자료형 중 배열은 객체 자료형에 해당한다.
- 배열의 원소 (item) : 배열의 각 저장 공간.
- 배열의 인덱스 (index) : 배열의 원소에 접근할 때 사용하는, 0부터 시작하는 정수.
- 배열을 생성하는 방법 : 배열 리터럴([]), 대괄호로 생성한 다음 대괄호 안에 값을 쉼표로 구분해 입력한다.
- 배열에 접근하는 방법 : 변수의 식별자와 배열의 인덱스를 이용해 각 배열의 원소에 접근할 수 있다.
ex) 예시
<script>
// 1. 식별자 이름이 numbers인 배열 생성
var numbers = [ 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 ];
// 2. 배열의 원소에 접근
// 인덱스는 숫자 0부터 시작한다는 것을 주의해야한다.
document.writeln(numbers[3]); // 4 : 배열 numbers의 네 번째 원소의 값 출력
document.writeln(numbers[7]); // 8 : 배열 numbers의 여덟 번째 원소의 값 출력
// 3. 배열의 원소에 새로운 값을 대입
// 배열 numbers의 네 번째 원소에 값 11을 대입
numbers[3] = 11;
document.writeln(numbers[3]); // 11 : 배열 numbers의 네 번째 원소의 값 출력
// 4. 배열에 새로운 원소를 추가
// 배열 numbers의 11번째 원소를 추가
numbers[10] = 11;
// 5. 배열 numbers를 출력하면 배열의 모든 원소들이 쉼표로 구분되어 출력된다.
document.writeln(numbers); // 1,2,3,11,5,6,7,8,9,10,11
</script>
2. 연산자
1) 연산자와 피연산자
- 표현식(수식, Expression)은 연산자와 피연산자로 이루어지는데
- 연산자(Operator)는 특정한 연산을 나타내는 기호이고
- 피연산자(Operand)는 연산의 대상이다.
- 예를 들면 x = 2;라는 수식에서 x와 2는 피연산자, =는 연산자(대입 연산자)에 해당한다.
2) 대입 연산자 (할당 연산자, 배정 연산자)
- 변수에 값을 저장하는 연산자
- 좌변에 있는 변수에 우변에 있는 값을 대입
- 대입 연산자에는 좌변에는 반드시 값을 저장할 수 있는 변수나 배열의 원소 등이 나와야 한다.
예시)
<script>
var num = 3;
var hello = "Hello World!";
num = 5;
hello = "Hello JavaScript!";
</script>
3) 산술 연산자
| 연산 | 연산자 | JavaScript 표현식 | 수학 수식 |
| 덧셈 | + | x + y | x + y |
| 뺄셈 | - | x - y | x - y |
| 곱셈 | * | x * y | x × y |
| 나눗셈 | / | x / y | x ÷ y |
| 나머지 | % | x % y | x mod y |
산술 연산의 과정을 예시를 들어 설명해보자면 이러하다.
sum = x + y;라는 수식이 있다고 가정해보면 변수 sum과 x, y는 선언되면서 서로 각각 다른 메모리 공간에 할당된다.
그러므로 먼저 변수 x와 변수 y의 메모리 공간에서 값을 가져와 덧셈 연산을 하고 그 결과 값이 다시 변수 sum에 저장(할당)된다.
4) 복합 대입 연산자
| 연산자 | 설명 | 수식 |
| x += y | x의 값에 y의 값을 더한다. | x = x + y |
| x -= y | x의 값에 y의 값을 뺀다. | x = x - y |
| x *= y | x의 값에 y의 값을 곱한다. | x = x * y |
| x /= y | x의 값에 y의 값을 나눈다. | x = x / y |
| x %= y | x의 값에 y의 값에 대한 나머지를 구한다. | x = x % y |
5) 증가 & 감소 연산자
| 연산자 | 설명 |
| num++ | 변수의 값에 1을 더함 (후위) |
| ++num | 변수의 값에 1을 더함 (전위) |
| num-- | 변수의 값에 1을 뺌 (후위) |
| --num | 변수의 값에 1을 뺌 (전위) |
ex)
- num++; = num += 1 = num = num + 1;
- ++num; = num += 1 = num = num + 1;
- num-- = num -= 1 = num = num - 1;
- --num = num -= 1 = num = num - 1;
◎ 전위 연산과 후위 연산
① 전위 연산
: 증가, 감소 연산자가 피연산자 앞에 오는 경우
문장 내에서 증가, 감소 연산자가 전위 연산으로 사용된 경우에는 전위 연산을 먼저 수행한 후 전위 연산을 제외한 나머지 기능을 수행한다.
② 후위 연산
: 증가, 감소 연산자가 피연산자 뒤에 오는 경우
문장 내에서 증가, 감소 연산자가 후위 연산으로 사용된 경우에는 후위 연산을 제외한 나머지 기능을 먼저 수행한 후 후위 연산을 수행한다.
<script>
var num = 10;
document.writeln("num = " + num); // num = 10
// 전위 연산
document.writeln("num = " + ++num); // num = 11
// → ++num; 먼저 수행
// 그 다음 document.writeIn("num = " + num); 수행
// 후위 연산
document.writeln("num = " + num++); // num = 11
// → document.writeIn("num = " + num); 먼저 수행
// 그 다음 num++; 수행
document.writeln("num = " + num); // num = 12
</script>
6) 비교 연산자
- 연산자 양변에 오는 값을 비교하는 연산자
- 연산 결과는 true 혹은 false이다.
| 연산자 | 설명 | 표현식 |
| == | x와 y의 값이 같은지 비교 | x == y |
| != | x와 y의 값이 다른지 비교 | x != y |
| > | x가 y보다 큰지 비교 | x > y |
| < | x가 y보다 작은지 비교 | x < y |
| >= | x가 y보다 크거나 같은지 비교 | x >= y |
| <= | x가 y보다 작거나 같은지 비교 | x <= y |
7) 논리 연산자
- 연산자의 양변에 오는 값을 불린 자료형으로 변환해서 연산
| 논리 연산자 | 의미 |
| ! | 논리 부정 연산자 |
| && | 논리곱(AND) 연산자 |
| || | 논리합(OR) 연산자 |
① 논리 부정 연산자
- !true > false
- !false > true
② 논리곱 연산자
| 논리곱 (&&) | true | false |
| true | true | false |
| false | false | false |
- true && true > true
- true && false > false
- false && true > false
- false && false > false
③ 논리합 연산자
| 논리합 (||) | true | false |
| true | true | true |
| false | true | false |
- true || true > true
- true || false > true
- false || true > true
- false || false > false
8) 조건 연산자
- 조건에 따라 다른 표현식을 취하는 연산자
- 연산자 중에 유일하게 피연산자가 세 개인 연산자 (삼항 연산자)
- 첫 번째 피연산자의 값에 따라, 참이면 두번째 피연산자가 연산 결과가 되고 거짓이면 세 번째 피연산자가 연산의 결과가 된다.
- 즉, 이 연산의 결과는 두 번째 피연산자 또는 세 번째 피연산자이다.
| condition ? expression_true : expression_false |
- condition : 참과 거짓을 판단할 표현식
- expression_true : 첫 번째 피연산자의 값이 참일 때 연산의 결과가 될 표현식
- expression_false : 첫 번째 피연산자의 값이 거짓일 때 연산의 결과가 될 표현식
ex) max = (x > y) ? x : y;
9) 연산자 우선순위의 일반 규칙 (중요)
- 산술 연산자 > 비교 연산자 > 논리 연산자 > 대입 연산자
- 단항 연산자 > 이항 연산자 > 삼항 연산자
| 연산자 | 설명 |
| . [ ] ( ) | 속성 접근 연산자, 배열 리터럴, 함수 호출, 표현식 묶기 |
| ++ -- - ~ ! delete new typeof | 단항 연산자, 자료형 변환, 객체 생성 연산자 등 |
| * / % | 곱하기, 나누기, 나머지 연산자 |
| + - + | 더하기, 빼기, 문자열 연결 연산자 |
| << >> >>> | 비트 시프트 연산자 |
| < <= > >= instanceof | 비교 연산자, 객체 확인 연산자 |
| == != === !== | 비교 연산자, 일치 연산자 |
| & ^ | | 비트 AND, XOR, OR 연산자 |
| && || | 논리 합, 논리 곱 연산자 |
| ?: = += -= *= /= %= | 조건 연산자, 대입 연산자, 복합 대입 연산자 |
그러나 우선 순위가 같은 연산자들이 여러개 있는 경우 어떤 것을 먼저 수행할 것인가?
- 대부분의 연산자는 왼쪽에서 오른쪽으로 수행되지만, 어떤 연산자들은 오른쪽에서 왼쪽으로 연산이 진행되기도 한다. 대입 연산자가 대표적이다.