변수(variable)

이지선·2021년 6월 10일
3

JavaScript

목록 보기
1/8
post-custom-banner

난 개인 카페 오픈을 앞둔 사장!
오늘은 메뉴 가격을 정해볼까?

-아메리카노 4,000원
-카페라떼 4,500원
-카푸치노 4,700원
.......

그런데 어느 날 내 가게 옆에 현수막이 걸렸다.
‘스타벅스 coming soon’

안되겠다!
당장 1,000원씩 가격 인하!!
아메리카노 4,000원에서 4를 지우고 3을 쓰고
카페라떼 4,500원에서 또 4를 지우고 3을 쓰고 ……

이런 귀찮은 상황을 한번에 수정하고 싶다면?
변수를 공부해보자!

변수(variable)

변경될 수 있는 값

사용법

변수 선언
let name
값 할당
name = 'sunny';

let name= 'sunny';

사용범위

(접근 가능한 범위에 따라 나뉜다)

-Block scope

{}안에서 선언되어 {}안에서만 접근 가능

{
let name = 'sunny';
console.log(name);
} //sunny출력
{
let name = 'sunny';
}
console.log(name);
//출력 불가능

-global scope

{}밖에서 선언되어 어디서든 접근 가능

let name = 'sunny';

{console.log(name);}
//sunny출력

변수의 종류

1.let -재선언X 재할당O

let name = 'sunny';
let name = 'bunny';
//재선언 불가
let name = 'sunny';
name = 'bunny';
console.log(name);
//bunny 출력,재할당 가능

2.const -재선언x 재할당x(선언하면 값 변경 불가)

const name= 'sunny’;
const name = 'bunny';
//재선언 불가

const name = 'sunny';
name = 'bunny';
//재할당 불가

3.var-재선언O 재할당O

var name = 'sunny';
var name = 'bunny';
//bunny 출력

var name = 'sunny';
name = 'bunny';
//bunny 출력

var가 이제는 잘 안쓰이는 이유
-hoisting
:변수를 어디에 선언해도 항상 제일 위로 선언을 끌어 올려준다.

name = 'sunny';
console.log(name);
var name;
//sunny 출력(변수 선언 전에도 출력 가능)

-Block scope 무시

{
var name = 'sunny';
}
console.log(name);
//{}안에서 선언되었지만 밖에서도 sunny출력 

결론은 현재 var는 사용되지 않으며
변경되는 값을 쓸 경우 let 사용!
변경되지 않을 값을 쓸 경우 const 사용!

이제 변수를 이용하여 수정이 편리한 메뉴판을 완성할 수 있다!

let a= '3';

(`아메리카노 ${a},000원`);
(`카페라떼 ${a},500원`);
(`카푸치노 ${a},700원`);
profile
👩🏻‍💻
post-custom-banner

1개의 댓글

comment-user-thumbnail
2021년 6월 15일

사장님 화이팅..!

답글 달기