나의 개발일지

[Javascript] 1. 변수와 상수 본문

JavaScript/Sparta

[Javascript] 1. 변수와 상수

heew0n 2023. 10. 13. 10:37

변수의 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