변수와 비교

자바스크립트의 변수와 비교에 대해 알아보자.

변수

변수란?

변수(variable)는 값을 담는 박스이다.
변수에 담긴 값은 다른 값으로 바꿀 수 있다.

변수의 선언

자바스크립트에서 변수는 var, let, const로 시작하며 이 세가지는 변수를 선언하겠다는 것을 의미한다.
!var, let, const의 차이점에 대해 구체적으로 알아보기!

변수의 이름은 $, _ 같은 특수문자를 제외한 모든 문자로 시작할 수 있다.

한줄에 여러 변수를 선언 하고 싶을 때 세미콜론';'을 사용하여 선언할 수 있다.(세미콜론';'은 하나의 구문이 끝났음을 명시적으로 나타내는 기호이다.)
하지만 자바스크립트는 줄이 바뀌면 명령이 끝났다고 간주하기 때문에 생략도 가능하다.

변수 선언 예시

var a = 1;
console.log(a); // 1
console.log(a+1); // 2
var a = 3;
console.log(a); // 3
console.log(a+1); // 4

// 한 줄에 나타낼 때
var a = 1; console.log(a);

// 변수의 값이 문자일 때
var a = 'coding'
var b = 'everybody'
console.log(a); // "coding"
console.log(b); // "everybody"
console.log(a +' '+ b); // "coding everybody"

변수의 효용

변수를 사용하는 이유는 무엇일까?
변수는 코드의 재활용성을 높여준다.
예를들어, 100에 10을 더하고 10을 나눈 후에 다시 10을 빼고 10을 곱한다고 했을 때
계산을 각 단계마다 출력한다면 코드는 아래와 같다.

console.log(100 + 10); // 110
console.log((100 + 10) / 10); // 11
console.log(((100 + 10) / 10) - 10); // 1
console.log((((100 + 10) / 10) - 10) * 10); // 10

하지만 계산 할 값이 100이 아니라 달라진다면 코드를 모두 수정해야 한다.
이럴때 변수를 적용하면 코드는 길어보일지라도 변할 수 있는 부분 인 변수 부분만 수정하면 된다.
유지보수가 쉬워진다.

변수의 효용성

var a = 100;
a = a + 10
console.log(a); // 110

a = a / 10;
console.log(a); // 11

a = a - 10;
console.log(a); // 1

a = a * 10;
console.log(a); // 10

위의 예시에서는 첫번째 줄의 변수 값 100을 다른 숫자로 바꾸면 나머지에 대입되는 변수의 값이 모두 바뀐다.
변수의 효용은 반복문, 조건문, 함수와 결합되면 더욱 중요해 진다고 한다.

비교

비교란?

주어진 값들이 같은지, 다른지, 큰지, 작은지 구분하는 것을 의미한다.
이때 비교 연산자를 사용한다.
연산자는 어떤 작업을 컴퓨터에게 지시하기 위한 기호로,
'='은 "우항에 있는 값을 좌항에 대입한다" 라는 뜻으로 대입 연산자 라고 한다.
'='은 우항의 값을 좌항의 변수에 대입하는 것으로 '=='와는 의미가 다르다.

비교 연산자(Comparison Operators)

아래는 주요 비교 연산자의 종류이다.

• 	= , < , > , <= , >= 

비교 연산자의 결과는 true 와 fase 중 하나의 타입으로 나온다.
이런 타입을 블리언(boolean)이라고 하며 비교 연산자를 통해 만들어지는 데이터 타입이다.

비교 연산자 예시

var a = 5;
console.log(a > 1); // true
console.log(a < 1); // false
console.log(a >= 5); // true
console.log( a <= 4); // false

동등 연산자와 일치 연산자(Equal operator / Stric eaual operator)

또 다른 연산자들로는 '==' 와 '===' 이 있다.

'=='은 동등 연산자(equal operator)로 좌항과 우항을 비교 해 서로 값이 같으면 true, 다르면 false가 된다.
좌항과 우항 데이터 형식이 다르더라도 실질적으로 가지고 있는 정보가 동일하다면 true 값이 나온다.

'==='은 일치 연산자(stric eaual operator)로 좌항과 우항이 정확하게 같으면 true, 다르면 false가 된다.
정확 이라는 의미에 집중해보자.
'==='는 서로 같은 수를 표현하더라도 데이터 형이 같은 경우에만 같다고 판단한다.

예를 들어 undefined 와 null은 '값이 없다' 라는 것은 같지만
undefined는 의도되지 않은 '값이 없다'는 것이고,
null은 의도적으로 '값이 없다' 라는 것을 부여한 것이다.(명시적으로 표시한 것)
=> 값이 없다는 것은 같지만 의도한 것과 의도 하지 않은 것은 엄격히 다르다.

예시

var a = 1;
console.log(a == 1); // true
console.log(a == 2); // false

console.log(a === 1); // true
console.log(a == '1'); // true
console.log(a === '1'); // false

console.log(undefined == null); // true
console.log(undefined === null); // false

부정 연산자

'!'는 부정을 의미한다.
'같다'의 반대로 '!='로 표시한다.

부정 연산자 예시

var a = 1;
console.log(a != 1); // false => !true = false
console.log(a != '1'); // false => !true = false

console.log(a !== 1); // false => !true = false
console.log(a !== '1'); //true => !false = true

변수와 비교에 대해서 알아보았다.
비교 연산자를 활용하여 '조건문'을 배울 수 있다.