.png)
[JavaScript] 주석
주석
- 주석은 해석기(parser)가 무시하고 실행되지 않는다.
- //로 주석을 표시할 수 있다.
// 주석, comment줄바꿈 전까지 주석 처리 된다.
- 여러 줄을 주석 처리할 때는 /* */로 주석을 표시할 수 있다.
/*
여러줄
여러줄
여러줄
여러줄
*/
주석의 역할
- 코드의 도움말을 작성한다.
- 좋은 주석이 있는 코드가 좋은 코드이다. 타인과 미래의 나를 위해 설명해야 한다.
- 과도한 주석은 가독성을 해친다. 최선의 코드는 주석이 필요 없는 코드이다.
- 어떤 코드를 일시적으로 동작하지 않도록 할 때에도 사용한다. (디버깅 용도)
[JavaScript] 줄바꿈과 여백
Semicolon
- semicolon( ; )은 명령이 끝났다는 것을 명시적으로표시한다.
- javascript에서는 semicolon을 붙이지 않아도 줄바꿈이 되면 정상적으로 동작한다.
var a = 1
alert(a) // 1 - 두 줄의 명령을 한 줄로 붙일 때에는 반드시 필요하기 때문에 semicolon을 붙이는 것이 좋은 습관이다.
var a = 1; alert(a); // 1 들여쓰기
- 가독성을 높이기 위해 들여쓰기를 한다.
- tab키를 이용한다. → 여러 줄을 drag하여 한 번에 tab할 수 있다.
<body>
<script>
alert('Hello world');
</script>
</body>- 기호 사이에 여백을 두는 것도 가독성을 위한 것이다.
var a=1;
var a = 1; // 여백[JavaScript] 문과 표현식
문
- 문(statement)은 자바스크립트 엔진에게 내리는 명령이다.
- 키워드를 사용하여 변수나 함수를 생성하기도 하고 제어문을 사용하여 프로그램의 흐름을 제어한다.
// 변수 선언문
var x;
// 할당문
x = 5;
// 함수 선언문
function foo () {}
// 조건문
if (x > 5) { … }
// 반복문
for (var i = 0; i < 10; i++) { … }표현식
- 표현식(expression)은 리터럴, 식별자, 연산자, 함수 호출 등의 조합을 말한다.
- 표현식은 평가(evaluation)되어 하나의 값을 만든다. → 표현식은 하나의 값으로 평가될 수 있는 문(statement)이다.
// 리터럴 표현식
10
// 식별자 표현식
sum
// 연산자 표현식
10 + 20- 숫자 값으로 평가될 수 있는 표현식이라면 숫자 값 대신 사용할 수 있다.
표현식이 아닌 문
- 표현식인 문은 값으로 평가될 수 있는 문이다.
var foo = x = 100;
console.log(foo) //100-
할당문은 그 자체가 표현식이므로 값처럼 사용할 수 있다.
-
표현식인 아닌 문은 값으로 평가될 수 없는 문이다.
var foo = var x; //SyntaxError: Unexpected token var- 선언문은 값으로 평가될 수 없으므로 표현식이 아니다.
[JavaScript] 연산자
연산자
- 연산자(Operator)는 표현식을 대상으로 산술, 할당, 비교, 논리, 타입 연산 등을 수행해 하나의 값을 만든다.
- 연산의 대상을 피연산자(Operand)라고 하며 하나의 값으로 평가되므로 표현식이다.
// 산술 연산자
5 * 4 // 20
// 문자열 연결 연산자
'My name is ' + 'Lee' // "My name is Lee"
// 할당 연산자
var color = 'red'; // "red"
// 비교 연산자
3 > 5 // false
// 논리 연산자
(5 > 3) && (2 < 4) // true
// 타입 연산자
typeof 'Hi' // "string"산술 연산자
- 산술 연산자(Arithmetic Operator)는 피연산자를 대상으로 수학적 계산을 수행해 새로운 숫자 값을 만든다.
- 산술 연산을 할 수 없는 경우에는 NaN을 반환한다.
이항 산술 연산자
- 피연산자의 값을 변경하는 부수 효과(Side effect)가 없다.
5 + 2 // 7 덧셈
5 - 2 // 3 뺄셈
5 * 2 // 10 곱셈
5 / 2 // 2.5 나눗셈
5 % 2 // 1 나머지단항 산술 연산자
- 피연산자의 값을 변경하는 부수 효과(Side effect)가 있다.
- 증가/감소(++/—) 연산자는 위치에 따라 대입과 증가/감소의 순서가 정해진다.
var x = 5, result;
// 선대입 후증가 (Postfix increment operator)
result = x++;
console.log(result, x); // 5 6
// 선증가 후대입 (Prefix increment operator)
result = ++x;
console.log(result, x); // 7 7
// 선대입 후감소 (Postfix decrement operator)
result = x--;
console.log(result, x); // 7 6
// 선감소 후대입 (Prefix decrement operator)
result = --x;
console.log(result, x); // 5 5- 단항 연산자는 숫자 타입이 아닌 피연산자에 사용하면 숫자 타입으로 변환하여 반환한다.
+10 // 10
+'10' // 10
+true // 1
+false // 0- – 단항 연산자는 피연산자의 부호를 반전하여 값을 반환한다
- 숫자 타입이 아닌 피연산자에 사용하면 숫자 타입으로 변환하여 반환한다.
-10 // -10
-'10' // -10
-true // -1
-false // -0문자열 연결 연산자
- 연산자는 피연산자 중 하나 이상이 문자열인 경우 문자열 연결 연산자로 동작한다
// 문자열 연결 연산자
'1' + '2' // '12'
'1' + 2 // '12'
// 산술 연산자
1 + 2 // 3
1 + true // 2 (true → 1)
1 + false // 1 (false → 0)
true + false // 1 (true → 1 / false → 0)
1 + null // 1 (null → 0)
1 + undefined // NaN (undefined → NaN)- javascript 엔진에 의한 암묵적 타입 변환(Implicit coercion)이 발생하여 true를 숫자 1로 변환하여 연산을 수행한다. → +/- 단항 연산자도 암묵적 타입 변환이 발생한 것이다.
P.S.
그동안 여러가지 경로를 통해 코딩을 접했지만 프로그램의 가장 기초인 문과 표현식에 대한 내용을 이렇게 명확하게 다뤄본 적은 없었다😅 그동안 참 내실 없는 공부를 했었다는 의미이기도 하지만 앞으로 더 잘할 수 있을 것이라는 반증으로 여기고 열심히 해보자🔥
