Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |
Tags
- 결합선택자
- CSS
- 의사클래스
- 특성선택자
- 부트캠프 #스파르타코딩클럽 #개발일지# #html
- useState
- 개발일지
- 부트캠프 #코딩 #개발일지 #프론트엔드 #CSS #TIL
- 개발일지 #TIL #프론트엔드 #HTML
- 리액트
- ㅜㄹㄹ
- 부트캠프 #CSS #개발일지 #TIL #박스모델
- JS예제
- querySelector
- Til
- js
- 부트캠프
- React
- 부트캠프 #개발일지 #TIL #CSS속성 #float #clear
- 부트캠프 #개발일지 #TIL #그리드 #CSS
- textContent
- 부트캠프 #개발일지 #TIL #Position #위치
- 템플릿스트링
- 깃허브오류
- 부트캠프 #CSS #개발일지 #TIL
- useEffect
- 부트캠프 #스파르타코딩클럽 #개발일지# #TIL #Javascript #confirm #location.href
- appendChild
- 부트캠프 #개발일지 #TIL #FlexboxFroggy #displayflex #flexbox
- 알고리즘
Archives
- Today
- Total
나의 개발일지
[Javascript] 1. 변수와 상수 본문
변수의 5가지 주요 개념
1. 변수 이름 : 저장된 값의 고유 이름
2. 변수 값 : 변수에 저장된 값
3. 변수 할당 : 변수에 값을 저장하는 행위
4. 변수 선언 : 변수를 사용하기 위해 컴퓨터에 알리는 행위
5. 변수 참조 : 변수에 할당된 값을 읽어오는 것
var (변수명) = (값 할당);
(let, const)
변수 : var, let
상수 : const
var myVar = "Hello World";
console.log(myVar);
//var myVar1;
//myVar = 3; //위의 var 변수와 같은 식이다
let myLet = "Hello World1";
console.log(myLet);
const myConst = "Hello World2";
console.log(myConst);
출력값
PS C:\Users\gmldn\OneDrive\바탕 화면\WEEK_1> node 01.js
Hello World
Hello World1
Hello World2
PS C:\Users\gmldn\OneDrive\바탕 화면\WEEK_1>
// 1. var
var myVar = "Hello World";
var myVar = "Test 1"; // 재선언
myVar = "Goodbye";
myVar = "seeU" // 값을 재할당
console.log(myVar);
PS C:\Users\gmldn\OneDrive\바탕 화면\WEEK_1> node 01.js
seeU // 출력값
/*-------------------------------------------------------*/
// 2. let
let myLet = "Hello World1";
let myLet = "Test 2"; // 재선언
myLet = "Goodbye 2";
myLet = "Goodbye 3" // 값을 재할당
console.log(myLet);
at Function.executeUserEntryPoint [as runMain] (node:internal/modules/ruPS C:\Users\gmldn\OneDrive\바탕 화면\WEEK_1> node 01.js
C:\Users\gmldn\OneDrive\바탕 화면\WEEK_1\01.js:13
let myLet = "Test 2";
^
SyntaxError: Identifier 'myLet' has already been declared // 에러 발생 : 'myLet'에 이미 선언됨
at internalCompileFunction (node:internal/vm:73:18)
at wrapSafe (node:internal/modules/cjs/loader:1178:20)
at Module._compile (node:internal/modules/cjs/loader:1220:27)
at Module._extensions..js (node:internal/modules/cjs/loader:1310:10)
at Module.load (node:internal/modules/cjs/loader:1119:32)
at Module._load (node:internal/modules/cjs/loader:960:12)
at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:86:12)
at node:internal/main/run_main_module:23:47
// 에러 수정
let myLet = "Hello World1";
// let myLet = "Test 2";
myLet = "Goodbye 2";
myLet = "Goodbye 3"
console.log(myLet);
Node.js v18.18.1
PS C:\Users\gmldn\OneDrive\바탕 화면\WEEK_1> node 01.js
Goodbye 3 // 출력값 (출력값이 "Goodbye 2"이 아닌 "Goodbye 3"로 나온 것은 밑에서 추가 설명
/*-------------------------------------------------------*/
// 3. const
const myConst = "Hello World2";
const myConst = "Test 3"; // 재선언 및 재할당
console.log(myConst);
PS C:\Users\gmldn\OneDrive\바탕 화면\WEEK_1> node 01.js
C:\Users\gmldn\OneDrive\바탕 화면\WEEK_1\01.js:20
const myConst = "Test 3";
^
SyntaxError: Identifier 'myConst' has already been declared // 에러 발생 : 'myConst'에 이미 선언됨
at internalCompileFunction (node:internal/vm:73:18)
at wrapSafe (node:internal/modules/cjs/loader:1178:20)
at Module._compile (node:internal/modules/cjs/loader:1220:27)
at Module._extensions..js (node:internal/modules/cjs/loader:1310:10)
at Module.load (node:internal/modules/cjs/loader:1119:32)
at Module._load (node:internal/modules/cjs/loader:960:12)
at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:86:12)
at node:internal/main/run_main_module:23:47
// 에러 수정
const myConst = "Hello World2";
console.log(myConst);
Node.js v18.18.1
PS C:\Users\gmldn\OneDrive\바탕 화면\WEEK_1> node 01.js
Hello World2 // 출력값
var
: 변수의 값을 언제든지 바꿀 수 있다
: 동일한 이름으로 재선언이 가능하다
: 동일한 이름으로 여러 변수가 생성될 수 있어서 변수명 남용의 문제가 발생
: 대체 변수로 let과 const가 사용된다
let
: 변경될 수 있는 값을 저장할 때 사용하며, 추후 얼마든지 값을 덮어쓸 수 있다
const
: 바뀌지 않는 값(상수)을 저장할 때 사용
: 절대 덮어쓰기가 안되는 값으로 변수의 값은 선언 즉시 초기화 되어야 한다
: 초기화된 변수의 값은 더이상 변경 불가능
: **const 는 선언과 함께 할당해줘야 한다** (계속 에러가 떠서 튜터님에게 질문ㅠ)
const a = {
x: 1,
y: 2
};
a = {a : 3};
// a에 할당연산자를 사용해서 다른 객체를 할당하려고 하면 에러가 남.
// 그러나 객체의 속성을 변경할 수는 있다.
const a = {
x: 1,
y: 2
};
a.x = 3;
console.log(a); // { x: 3, y: 2 }
// --> x의 값이 바뀌었다
// --> 새로운 객체를 할당하는 하는 게 아니라 원래 객체를 유지하고 값만 변경하는 거임
// 객체의 속성을 변경하는 것도 막고 싶다면? (객체의 불변성을 유지하고 싶다!)
// 'object freeze'
const a = Object.freeze({
x: 1,
y: 2,
});
a.x = 3;
console.log(a); // { x: 1, y: 2 }
var | let | const | |
재선언 | O | X | X |
재할당 | O | O | X |
'JavaScript > Sparta' 카테고리의 다른 글
[Javascript] 6. 함수 - for문 / for 중첩 (1) | 2023.10.18 |
---|---|
[Javascript] 5. 함수 - 조건문 / if / else if / else / if중첩문 / switch (0) | 2023.10.17 |
[Javascript] 4. 함수 - 함수선언식/함수표현식/스코프/화살표함수/arguments (0) | 2023.10.16 |
[Javascript] 3. 연산자 (0) | 2023.10.15 |
[Javascript] 2. 데이터 타입 (0) | 2023.10.14 |