Developer_kade

앞의 글에서 조건 문중 IF문을 알아봤는데 이번에는 다른 조건문 두 가지에 대해 이야기해보려 한다.

먼저 Switch Case문 이다.

switch(조건) {
	case 조건확인:
    	수행 내용
        break;
}

if문에서 조건을 여러 개 주려면 else if를 사용했었는데 switch case문으로 조금 더 간결하게 표현을 할 수 있다.

먼저 switch옆에 조건을 넣어준다. 그 뒤 case옆에 조건의 수행 결과를 입력해주면 되는데 코드로 확인해 보자.

//else if 를 사용
const a = 1
const b = 2

if(a > b) {
	console.log('a가 b보다 큽니다.')
} else if (a < b) {
	console.log('a보다 b가 큽니다.')
}

//switch case 를 사용
switch(a > b) {
	case true:
    	console.log('a가 b보다 큽니다')
        break
    case false:
    	console.log('a보다 b가 큽니다.')
        break
}

switch case문의 주의할 점이 하나 있다.

각각의 case의 마지막에 꼭 break를 써줘야 한다 그렇지 않으면 의도한 결과와 다른 결과가 나올 것이다.

이제 마지막으로 삼항 연산자(Ternary operator)에 대해 알아보자

const a = 1
const b = 2

console.log(a > b ? 'a is big':'b is big')

삼항 연산자의 코드이다.

물음표(?) 앞의 내용이 조건이고 저부분이 True인 경우 콜론(:)으로 구분된 곳 중에 왼쪽이 출력되고 False인 경우 오른쪽이 출력이 된다.

삼항 연산자는 후에 또 이야기할 일이 있을 듯 하니 이 정도로 간단하게 보고 다음으로 넘어가겠다.

if문은 JavaScript의 제어문의 종류 중 하나입니다.

영어의 뜻 그대로 만약 ~하다면 ~내용을 수행해라 라는 제어문입니다.

if (조건) {
	실행 내용
}

기본적으로 위와 같은 문법으로 사용이 가능한데 상세히 살펴보면

제일 앞에 if문을 사용하겠다고 말을 해줍니다.

그 뒤에 소괄호 ()안에 조건을 명시해 주는데 이 소괄호 안의 조건이 true인 경우에 중괄호 {} 안의 내용을 수행해 줍니다.

만약 소괄호 안의 조건이 false라면 중괄호 안의 내용은 무시되고 다음 코드로 진행이 됩니다.

조건문은 if / if, else / if, if else, else 와같이 세 가지 표현이 가능합니다.

if만 사용할 경우 조건을 하나만 걸어둘수 있지만 else if를 사용하면 여러 개의 조건

그리고 마지막에 else를 사용할경우 else 위의 모든 if문의 조건이 만족하지 않을 때 수행할 내용을 입력할 수 있습니다.

if(조건1) {
	수행
} else if (조건2) {
	조건1이 만족하지 않고 조건2에 만족한다면 수행
} else {
	조건1과 조건2 모두 만족하지 않으면 수행
}

위와 같이 else if를 여러번 사용해 조건을 추가해서 실행 내용을 정할 수 있고 모두 만족하지 않는 경우 else의 내용을 수행하도록 코드를 작성할 수 있습니다.

간단한 예시와 함께 마무리를 하겠습니다.

const a = 1
const b = 2

if(a > b) {
	console.log('a가 b보다 큽니다.')
} else if (a === b) {
	console.log('a와 b가 같습니다.')
} else if (a > 100) {
	console.log('a가 100보다 큽니다.')
} else if (b > 100) {
	console.log('b가 100보다 큽니다.')
} else {
	console.log('a가 b보다 작습니다.')
}

조건문 part2에서 뵙겠습니다.

프로그래밍에서 변수란 데이터 저장을 위해 사용하는 메모리 공간을 식별하기 위해 붙인 이름을 말합니다.

10 + 10

위와 같은 코드를 작성했다고 가정했을 때 10 + 10이라는 수식의 답을 담을 수 있는 메모리가 필요합니다.

그 메모리의 주소와 연결해주는 역할을 변수가 하는것이고

var a = 10 + 10;

위와 같이 선언을 해줄 수 있습니다.

10 + 10의 코드를 어딘가의 메모리에 담아주고 코드가 담긴 메모리의 주소의 식별자를  a라고 선언해줍니다.

다른 언어와 다르게 변수의 타입을 지정해 주지 않아도 JavaScript가 String인지 Number인지 등을 판단하여 자동으로 타입을 지정해 주기 때문에 프로그래머가 변수의 타입을 지정해주지 않아도 됩니다.

JavaScript는 ES6이전에는 위에 작성한 코드와 같이 var로 변수를 선언했습니다.

하지만 중복 선언이 가능하다거나 스코프의 개념이 다른 언어와 다른점 등이 불편한 사항중 하나였기에 ES6에서 새로 변수를 선언하는 방법을 정했습니다.

먼저 Const(상수)로 선언을 하는 방법인데 다른 언어의 상수와는 조금 다른 개념일수도 있습니다.

const는 선언과 동시에 값이 할당되어야 하며 수정이 불가능 합니다. 코드를 보면

//선언먼저 한 후에 값의 할당이 불가능 합니다.
const a;
a = 1;

//코드의 재선언 혹은 재할달이 불가능 합니다.
const a = 1;
//100줄의 코드를 썼다고 가정
const a = 2;
a = 2;

위와 같이 선언후에 할당한다거나, 재선언 혹은 재할당이 가능하지 않습니다.

코드를 작성하다보면 변수의 이름 혹은 의도치 않은 재할당을 할수도 있는데 const같은 경우에는 이를 방지해 줍니다.

const box = document.querySelector('.box');
const onClick = e => console.log('hi');

위와 같이 html의 element를 가져온다거나 function을 정의할때 많이 사용합니다.

그렇다면 값이 수정되어야 하는 경우에는 var를 써야 될까요?

아닙니다. const와 같이 나온 let이라는 변수 선언 방법이 있습니다.

//선언후 값의 할당이 가능
let a;
a = 1;

//선언과 할당을 동시에 할 수 있음
let b = 1;

//값의 재 할당이 가능
a = 2;

위와 같이 선언후 할당, 값의 재할당 등이 가능합니다. let은 보통

for(let i = 0; i < 10; i++) {
	console.log(i)
}

이런식으로 i가 계속 변해야하는 경우에 사용을 하면 됩니다,

하지만 const와 let모두 재선언은 불가능 하다는 점을 기억해야 합니다.

//var
var a = 1;
var a = 2;

//const,let
const a = 1;
const a = 2;
let a = 1;
let a = 2;

var은 같은 변수명으로 재선언이 가능하지만 const와 let은 불가능 합니다.

나중에 설명할 스코프에서도 정말 큰 차이가 있습니다.

지금까지 변수에 대한 설명 이였습니다. 감사합니다.