변수

변수 이름

 

1. 변수 이름은 숫자로 시작할 수 없음

2. 공백이 있으면 안 됨!

 

변수

 

변수 선언

let sum;
sum = 10;

let sum = 10;

 

콘솔 창에 아래와 같이 쳐보자.

변수 생성 및 값 할당

const

 

const도 사용해보자.

const 변수에는 값을 할당할 수 없다

 

호이스팅 (var를 쓰지 말아야 하는 이유)

호이스팅: 끌어올린다

📌 상황에 따라 변수 선언 부분을 스코프 가장 위로 끌어 올린다는 뜻

 

var를 사용하면

var x = 10;
var sum = x + y;
var y = 20;
console.log(sum);

 

위 코드는 이렇게 해석된다.

var x = 10;
var y;
var sum = x + y;
var y = 20;
console.log(sum);

 

y는 선언만 되고, 값이 할당되지 않았으므로 sum은 NaN (Not a Number)라고 뜸

 

하지만 Let이나 Const를 사용하면, 호이스팅을 하지 않으므로 아래와 같이 오류가 발생한다.

let x = 10;
let sum = x + y;
let y = 20;
console.log(sum);

 

✅ 결론

var를 사용하면 호이스팅이 발생해 결과값이 예상과 다르게 나타나고 오류를 찾기 어려워진다.

var를 쓰지 말고, let을 사용하자!

 

재선언, 재할당

 

var는 재선언 가능

let이나 const는 재선언 불가

예약어	호이스팅	재선언	재할당
var	발생	O	O
let	X	X	O
const	X	X	X

 

---

 

자료형

 

자료형 알아내기

 

typeof(값/ 변수)

let data = 5
typeof(data)    // "number"

 

자료형: number/string

 

number 자료형은 숫자

string 자료형은 ' 혹은 " 로 묶은 데이터입니다.

 

특수 문자

 

특수 문자를 표시하려면 백슬래시(\) 다음에 특수 문자를 적습니다.

 

 

템플릿 리터럴

 

문자열을 + 로 연결하지 않고, 변수나 식은 ${}로 묶어서 표현하는 방법

 

주의: 백팃(`)을 사용해야 템플릿 리터럴을 사용할 수 있음

console.log (name + "님, " + classroom + "호 강의실로 입장하세요.")
console.log (`${name}님, ${classroom}호 강의실로 입장하세요.`)
console.log (
    `${name}님,
     ${classroom}호 강의실로 입장하세요.`
)

 

꿀팁: 소스에서 바로 줄을 바꿔 입력 가능

 

undefined, null의 차이점은?

undefined: 값이 할당되지 않았을 때 변수 초기값

null: 값이 없거나 유효하지 않음 ➡ 값이 있는지 여부 확인 시 유용

 

객체

하나의 변수에 다양한 정보가 포함되어 있는 자료형

Key와 Value로 정보를 담는다.

 

객체 정의

let gitBook = {
    title : "깃허브 입문",
    pubDate : "2025-03-16", 
    pages : 300,
}

 

객체 접근

 

gitBook.title
gitBook["pages"]

 

 

배열

 

1. 대괄호 사용

2. Index가 0부터 시작

season = ["봄", "여름", "가을", "겨울"]

 

심볼

1. 유일성

 - 심볼은 만들면 변경 불가, 같은 심볼을 만들 수도 없음

2. Property의 Key로 사용 가능

 

let id = Symbol()
const member = {
    name : "Kim",
    [id] : 12345,
}

member       /* {name: "Kim", Symbol(): 12345} */
member[id]   /* 12345 */

심볼을 Key로 사용할 때는 [키]로 대괄호를 사용, 접근 시에도 대괄호 사용

 

심볼에 설명 추가

let grade = Symbol("grade")    /* 설명 추가 */
member[grade] = "VIP"
member /* {name: "Kim", Symbol(): 12345, Symbol(grade): "VIP" */

---

 

자료형 변환

 

자바스크립트는 자료형을 지정하지 않음 👀

 

❗ 주의 

자동으로 자료형이 바뀌면서 오류가 발생하지 않도록 주의하세요.

특히, +가 문자를 연달아 잇는 것인지, 숫자의 덧셈인지 주의해야 합니다.

 

직접 숫자형으로 변환

 

Number()

Number(true)     /* 1 */
Number("20")     /* 20 */
Number("Hi?")    /* NaN */

 

parseInt() 와 parseFloat() 

 

parseInt() : 정수로 변경

parseFloat() : 실수로 변경

 

문자열로 변환

 

값.toString()

값.toString(기본값)

 

num = 10
num.toString()     /* '10', 10진수 문자열 */
num.toString(2)    /* '1010', 2진수 문자열 */

isEmpty = true
isEmpty.toString() /* 'true' */

isFull = false     /* 논리형 값 */
String(isFull)     /* 'false' */

initValue = null   /* 'false' */
String(initValue)  /* 'null' */

 

 

논리형으로 변환

 

Boolean(값)

 

Boolean(5*4)         /* true */
Boolean("Hi?")       /* true */
Boolean(undefined)   /* false */

 

 

 

끝