JavaScript

[JavaScript] Variables(변수 : var, let, const)

개발자 마멋 2023. 11. 5. 20:26

Variables

- 기본적으로 const 사용, 필요할 때만 let 사용

- const를 사용한 코드는 절대 바뀌지 않는 것을 알 수 있고, let을 사용한 코드는 바뀔 가능성이 있다는 것을 알게해줌

 

문제 제기

console.log(5+2);
console.log(5*2);
console.log(5/2); 
// 결과
7
10
2.5

 

위에서 아래 순서대로 출력

 

문제점 : 바꾸고 싶은 숫자가 있으면 직접 다 바꿔줘야함

 

해결방안 : 변수를 사용해서 바꾸기 간단하게 변경

 

var

- 가장 기본적인 변수 선언 방식, 재할당이 가능하고 중복 선언이 가능하기때문에 더 늦게 선언된 변수가 적용된다

- 아무런 규칙이 없음

- 문제점 : 실수로 값을 업데이트해도 알려주지 않아서 처음 지정한 값 보호 불가능

- 이러한 문제점으로 인해 let, const를 사용하게 됨

 

const

기본 방식

const a = 5;

console.log(a + 2);
console.log(a * 2);
console.log(a / 2);
// 결과
7
10
2.5

 

- a 라는 변수를 지정하고 그 변수에 5를 넣어주면 넣은 이후 a 는 5를 가지게 됨

- 중복 선언, 재할당 모두 불가능

- 절대 바뀌지 않는 값을 설정할때 사용하고 대문자로 사용하는 것이 좋다.

응용

const a = 5;
const b = 2;
const myName = "marmot" //CamelCase(띄어쓰기= 앞글자 대문자)

console.log(a + b);
console.log(a * b);
console.log(a / b); //결과 위와 동일

console.log("hello " + myName);
//결과
hello marmot

 

- 변수를 지정해서 그 안에 값을 넣어주면 언제든지 변수의 값만 수정하면 값을 바꿀 수 있음

- 숫자뿐 아니라 문자열도 지정가능

let

const a = 5;
const b = 2;
let myName = "marmot"

console.log("hello" + myName);

myName = "marmotchoi"; //변경할때는 let 안써도됨

console.log("my new name is " + myName);
/* 결과
hello marmot
my new name is marmotchoi */

 

- var와 달리 중복선언시 에러가 발생한다.

- 변수 값을 재할당 할 수 있기 때문에 늦게 선언된 변수에 먼저 사용된 변수가 덮여서 문제가 발생할 가능성이 있다.

- 변수를 나중에 변경할 경우에 let을 다시 쓰지 않아도됨.(let은 변수 선언시에만 사용)

 

 

youtube 코딩앙마 팁

1. 변수는 문자, 숫자, $ _만 사용

2. 첫글자는 숫자 x ( let 1stGrade = 'A+'; x)

3. 예약어 사용 x ( let let = 99; x)

4. 상수는 가급적 대문자 ( const MAX_SIZE = 99;)

5. 변수명은 읽기 쉽고 이해할 수 있게 선언 (let a = 1; x), (let userNumber = 3; ㅇ)

'JavaScript' 카테고리의 다른 글

[JavaScript] Return(Function에서의 활용)  (1) 2023.11.08
[JavaScript] Booleans  (0) 2023.11.07
[JavaScript] 객체(Object)  (0) 2023.11.04
[JavaScript] 함수(Function)  (0) 2023.11.03
let textNodes = document.querySelectorAll("div.tt_article_useless_p_margin.contents_style > *:not(figure):not(pre)"); textNodes.forEach(function(a) { a.innerHTML = a.innerHTML.replace(/`(.*?)`/g, '$1'); });