#7회차
할당 연산자, 함수 실행 순서, return문 이해, 변수의 scope(영역), 상수(const)
1) 할당 연산자
- 등호를 사용하면 좌측에 우측의 값을 할당해주게 된다. 즉, 등호는 같은 것을 뜻하는 '일치'와는 다르게 사용된다.
let x = 5; // x의 값은 5
x = x - 2 ; // x의 값은 5 - 2 = 3
x = x + 1; // x의 값은 3 + 1 = 4
console.log(x); // 따라서 콘솔에는 4가 출력이 된다.
- 복합 할당 연산자 : 자주 쓰이는 사칙연산(+, - , *, /, %, **)을 더 간략하게 쓸 수 있는 연산자.
| 동일한 값을 나타내는 연산자 ( let x = 8; ) | x에 할당되는 값 | |
| x = x + 2 | x += 2 | 9 |
| x = x - 3 | x -= 3 | 4 |
| x = x * 4 | x *= 4 | 28 |
| x = x / 2 | x /= 2 | 4 |
| x = x % 3 | x %= 3 | 2 |
| x = x * x * x | x **= 3 | 512 |
- 증가/감소 연산자: 간단하게 1씩 증가/감소하는 경우는 반복문 등에서 많이 쓰이기에 별도로 존재한다.
| x = x + 1 | x += 1 | x++ |
| x = x - 1 | x -= 1 | x-- |
후위 연산자(x++)로 사용한 경우 피연산자에 1을 더하기 전의 값을 반환합니다.
전위 연산자(++x)로 사용하면 피연산자에 1을 더한 값을 반환합니다.
let x = 3;
console.log(x++); // 3이 반환되고 x에 새로 3+1인 4가 할당됨
console.log(x); // X에 4가 할당돼서 4로 반환됨
let y = 3;
console.log(++y); // 3+1인 4가 할당되어 반환됨
console.log(y); // 위와 같이 4가 반환됨console 결과값
3
4
4
4
2) 함수 실행 순서
- 코드는 기본적으로 위에서부터 아래로 실행이 되며, 함수는 만든다고 실행되는게 아니라 호출해야 실행이 된다.
function square(x) {
return = x * x;
} // 함수는 선언한다고 실행 되지 않으므로 콘솔에 영향을 주지 않는다.
console.log('함수 실행 전'); // 콘솔에 '함수 실행 전'이라고 뜸
console.log(square(4)); // 콘솔에 함수 square을 파라미터에 4라는 값을 대입하여 실행한 값이 뜸
console.log('함수 실행 후'); // 콘솔에 '함수 실행 후'라고 뜸위와 같은 경우, 콘솔에서 아래와 같은 결과가 뜬다.
함수 실행 전
16
함수 실행 후
3) return문 제대로 이해하기
- 역할이 총 2가지이다.
1) 값을 반환한다.
2) return 문을 수행한 뒤, 그 아래에 있는 함수 내 코드들은 실행되지 않는다. (함수의 실행을 중단시킨다)
function square(x) {
console.log('return 전');
return x += 2;
console.log('return 후');
}
console.log('함수 호출 전');
console.log(square(5));
console.log('함수 호출 후');위와 같은 경우, 콘솔에서 아래와 같은 결과가 뜬다.
함수 호출 전
return 전
7
함수 호출 후'return 후'라는 코드는 return 선언 이후의 코드이기 때문에 'dead code'로 분류되어 실행되지 않는다.
function square(x) {
console.log('return 전'); // 콘솔에 'return 전'이라는 문자열 출력
return x += 2; // x에 2를 더한 값이 x에 할당되어 retrun
console.log('return 후'); // return 선언을 한 이후의 함수이기 때문에 출력되지 않음
} // 함수가 호출이 돼야 실행됨.
console.log('함수 호출 전'); // 콘솔에 '함수 호출 전'이라는 문자열 출력
console.log(square(5)); // 콘솔에 함수 square를 파라미터 값을 5로 하여 실행한 값을 출력
console.log('함수 호출 후'); // 콘솔에 '함수 호출 후'라는 문자열 출력
4) optional 파라미터
- 함수를 실행하면서 파라미터 값을 설정해주지 않을 때, 미리 파라미터에 값을 배정해주면 해당 값을 반환하게 되는데 이를 옵셔널 파라미터라고 한다.
function introduce(name, age = 18){
console.log(`제 이름은 ${name}이고, 나이는 ${age}살입니다.`)
}
introduce('킹지');
introduce('탱이', 10);
위에서 '킹지'가 들어간 경우에 파라미터 age에 해당하는 값을 쓰지 않았지만 아래와 같이 출력된다.
제 이름은 킹지이고, 나이는 18살입니다.
제 이름은 탱이이고, 나이는 10살입니다.
참고로 옵셔널 파라미터는 값을 생략할 수 있기 때문에 무조건 마지막에 위치해두어야 한다.
5) 변수의 scope(영역)
- 코드를 작성하다보면 중괄호({})를 사용하는 선언문들이 있는데, 이를 '블록문'이라고 하여 별도로 인식한다.
- 이러한 블록문 안에 있는 변수는 '로컬(지역) 변수'라고 하여 해당 블록문 안에서만 인식이 된다.
function square(){
let x = 10;
return x * x;
}
console.log(x); // x 변수가 블록문 안에서만 실행되므로 오류 발생
console.log(square());
반면, 블록문 밖에 있는 변수는 '글로벌(전역) 변수'라고 하여 모든 곳에서 인식이 된다.
let x = 10;
function square(){
return x * x;
}
console.log(x);
console.log(square());위와 같은 경우에는 블록문 안과 밖에서 모두 변수 x가 존재하므로 아래와 같이 값이 제대로 출력된다.
10
100
6) 상수 constant (const)
- 상수는 절대 값을 변경하지 않을 경우에 선언해주는 것. ex) 원주율(3.14)는 바꾸지 않는 수이기에 상수로 선언해주는 편이 편함
- 상수의 이름 규칙은 변수와 구분해주기 위해 대문자를 사용하는 경우가 많다. (ex. PI, MY_NUMBER)
하... 저번부터 조금 복잡해진다 싶더니 복습에 2배 이상의 시간이 걸리는 것 같닼ㅋㅋㅋ
그래도 확실히 내가 몰랐던 상세한 부분도 확실히 짚고 넘어갈 수 있게 되는 것 같아 은근 기분은 좋다ㅋㅋㅋ
