Javascript 기초1

J-silver·2026년 1월 6일

Javascript

목록 보기
1/2
post-thumbnail

이해하기 쉽게 정리하기

🔸변수

let재할당 가능, 대신 재선언 불가

let age;
console.log(age); // undefined
age = 30;
console.log(age); // 30
age = 40;         // ✅ 재할당(값 변경)
console.log(age); // 40

let age는 선언한다 27은 초기화한다라는 뜻

그래서 27은 앞으로 age인것임

🤔Q. age = 30;이라고 선언한다면?
console.log(age); -> 30!!

{
let age = 30;
console.log(age); // 30 (안쪽 방 age)
}

→ 이 경우는 { }안에 선언한다면 가능함

🔸상수

const은 재할당 불가능

let은 내용없이 선언이 됐지만 const는 반드시 초기화값을 정해줘야함

const age = 30;
age = 40; // ❌ 에러! (다른 값으로 갈아끼우기 불가)
  • let age = 30; age = 40; ✅ (값 변경)

  • let age = 30; let age = 40; ❌ (재선언)

  • const age = 30; age = 40; ❌ (재할당)

  • const age = 30; const age = 40; ❌ (재선언)

🔸명명규칙(이름 짓기)

1. $(달러),_(언더스코어)를 제외한 기호는 사용 할 수 없다.

어디를 위치해도 절때 사용이 안됨.
let #name
let na#me
let name#

2. 숫자로 시작 할 수 없다.

숫자로 사용하고 싶다면 이름의 중간이나 끝에만 사용가넝
let name1; <가능
let 1name; <불가능
정 숫자를 먼저 사용해야겠으면 `$,_`먼저쓰기
let _1name;
let $1name;

3. 예약어를 사용 할 수 없다.

let let = 3;       // ❌ let은 이미 '변수 선언' 의미
const if = 10;     // ❌ if는 조건문
let function = 1;  // ❌ function은 함수 선언
let class = "a";   // ❌ class는 클래스

자료형(Type)집합

🔸원시타입

프로그래밍에 있어서 가장 기본적인 값들의 타입

1. Number Type

사칙연산이 가능함! = 모듈러 연산

자바스크립트는 신기하게도 정수(10)랑 소수(3.14)를 따로 구분하지 않고Number로 담음.

let a =10;// 정수
let b =3.14;// 소수
// 둘 다 Number 타입

2) 계산도 가능

let x =5;
let y =2;

x + y;// 7
x - y;// 3
x * y;// 10
x / y;// 2.5

3) 특이한 숫자 3총사도 Number에 포함돼요

자바스크립트엔 “이상한 숫자”가 있는데 이것들도 Number.

🔹Infinity (무한대)

let inf = Infinity

🔹-Infinity (음의 무한대)

let mInf = -Infinity;

🔹NaN (Not a Number인데 타입은 Number…)

“숫자가 나와야 하는데 숫자가 아닌 결과”가 나오면 NaN.

연산이 실패했을때 no 넘버라는 뜻

"abc" *3;// NaN

이름은 “숫자 아님”인데, 자바스크립트에서는 Number 타입으로 취급돼서 처음엔 많이 헷갈림.

4) 숫자인지 확인하는 방법(자주 씀)

지금 듣고있는 강의에서 넘기셔서 따로 공부해서 적기

Number.isNaN(NaN);// true
Number.isFinite(10);// true
Number.isFinite(Infinity);// false

🔹String Type

덧셈 연산도 지원함

let myName = "지지";

이름을 적을때는 반드시 “” 따옴표 안에 넣어야함! 안그러면 변수로 알아먹어버림

1) String 만들기: 따옴표로 감싸면 문자열!

문자열은 작은따옴표(' '), 큰따옴표(" "), 백틱( ``) 으로 만들 수 있음.

let a ="안녕";
let b ='지지';
let c =`반가워`;

2) 문자열 더하기(붙이기)

숫자처럼 더하는 게 아니라 글자를 붙이는 것.

"안녕" +"지지";// "안녕지지"
"안녕" +" " +"지지";// "안녕 지지"

3) 숫자랑 문자열을 더하면? → 문자열이 이김!

"10" +1;// "101"  (붙여버림)
10 +"1";// "101"

그래서 계산하려면 숫자로 바꾸기:

Number("10") +1;// 11

4) 백틱(``)은 문자열에 값을 넣기 편해요 (템플릿 리터럴 = 백틱)

🔹기존은 + 로 붙여야해서 번거러움
let name = "지지";
let age = 20;

"이름은 " + name + ", 나이는 " + age;

🔹백틱을 쓴다면 깔끔!
let name ="지지";
let age =20;

`이름은 ${name}, 나이는${age}`;
// "이름은 지지, 나이는 20"

5) 문자열 길이(글자 수)

"hello".length;// 5

🔸Boolean Type

상태표시

참/거짓만 담는 타입

let a = true;   <- //맞긴하지만 코드읽는사람이 바로 안읽힘
let b = false;  <- //
let isSwitchOn = true; // 읽자마자 “스위치 켜져있어?” 느낌
let hasMoney = false;  // “돈 있어?”
let isEmpty = true;    // “비어 있어?”

이 6개는 무조건 false 취급:

  • false
  • 0
  • "" (빈 글자)
  • null
  • undefined
  • NaN
let pw = "";

if (pw) {
  console.log("통과");
}

출력이 안됨!

🔸Null Type (아무것도 없다)

null = 휴지심만 있는 상태 ✅ (일부러 “없다”는 표시를 해둔 상태)

let empty = null;

🔸Undefined Type 아직 안 정해짐(안 넣었음)

변수 상자를 만들어놨는데 아직 아무것도 안 넣은 상태

undefined = 휴지조차 없는 상태 ✅ (아직 아무 설정/값이 없음)

let none;

let x;           // 상자만 만들고
console.log(x);  // undefined (비어있음)

let x;           // 상자만 만들고
console.log(x);  // undefined (비어있음)

형 변환(Type Casting)

🔸묵시적 형 변환

자바스크립트가 알아서 형변환하는거

  1. +문자열이 한 명이라도 섞이면 “붙이기 모드”
let num = 10;
let str = "20";

const result = num + str;

=> 1020
  1. -, *, /는 “붙이기”가 아니라 계산!
"10" - 1   // 9
"10" * 2   // 20
"10" / 2   // 5
  1. ==는 “대충 같으면 같다” 모드라서 자동 변환 (조심해야함!)
"1" == 1   // true  (문자 "1"을 숫자 1처럼 봄)
0 == false // true
"" == 0    // true
null == undefined // true

그래서 ===을 쓰는게 좋음
"1" === 1  // false (타입이 달라서)

🔸명시적 형 변환

개발자가 함수를 이용해서 변환함

문자열 -> 숫자(String → Number)

Number()

parseInt() 글자를 제외하고 숫자로 바꿀때

//문자열을 숫자로 바꿀때
let str1 = "10";
let strToNum1 = Number(str1);
console.log(strToNum1);     // 숫자 10이 출력돼요

//글자를 제외하고 숫자로 바꿀때
let str2 = "10개";
let strToNum2 = parseInt(str2);
console.log(strToNum2);     // 숫자 10이 출력돼요

숫자 -> 문자열

String()

let num1 = 20;
let numToStr1 = String(num1);

console.log(numToStr1 + "입니다");
  • 내가 헷갈린거

    띄어쓰기를 원하면, 띄어쓰기 문자도 직접 넣어야 해요

    방법 1) 문자열에 공백 넣기

      console.log(numToStr1 +" 입니다");// "20 입니다"

    방법 2) 중간에 공백 문자열을 더하기

      console.log(numToStr1 +" " +"입니다");// "20 입니다"

    방법 3) 백틱(템플릿 리터럴)로 쓰기(추천)

      console.log(`${numToStr1} 입니다`);// "20 입니다"

    “숫자랑 문자 같이 나오면 자동으로 띄어쓰기?”는 언제냐?

    -> 그건 console.log쉼표로 여러 개를 넣을 때!!!

    이 경우는 콘솔이 보기 좋게 띄어쓰기처럼 보여줌.

      console.log(numToStr1,"입니다");// 보통 "20 입니다"처럼 보임

    나는 +문자열을 합친 하나의 값을 만든 거라서 자동 공백이 없었던것.

profile
달리는 거북이

0개의 댓글