프로젝트 캠프 : Next.js 2기

[유데미x스나이퍼팩토리] 프로젝트 캠프 : Next.js 2기 - 사전직무교육 1~2일차 후기

jskim4695 2024. 7. 17. 11:31

1. 자바스크립트 실행방법

  • node 명령어를 사용하는 방법
  • code runner 익스텐션을 사용하는 방법
  • html 파일에서 script 태그를 사용하는 방법
    1. 외부스크립트 -> <script src="..."></script>
    2. 내부스크립트 -> <script>...</script>
  • 웹 브라우저의 개발자 도구 -> Console 탭에서 작성하는 방법

 

2. var, let, const

var는 변수, 사용하면 안됨.

let, const : 재할당이 필요할 때는 let, 재할당이 필요없으면 const

사용방법이 어렵다면 기본적으로 const로 쓰고, 분명 재할당된 식별자 때문에 에러가 뜬다면 let으로 바꾸면 된다.

 

3. 자료형

1) 기본자료형 : 숫자, 문자열, 논리, 특수, 심볼

  • 숫자형 : 
  • 문자열(형) : 따옴표로 감싸져서 문자로 표현된 것.
  • 논리형 : true, false
  • 특수자료형
    • undefined : 선언만 하고 할당되지 않았을 때.(JS엔진이 자체적으로 생성)
    • null : 개발자가 필요에 따라 의도적으로 값을 비워둔 것
  • 심볼 : Symbole() : 절대로 중복되지 않는 유니크한 값을 생성함.

2) 참조자료형 : 배열, 객체, 함수

  • 배열 : 여러개의 값을 묶어둔 값
  • 객체 : 값을 키/밸류로 묶어둠
  • 함수(function)
    • function 함수명() {실행시키고 싶은 코드}

4. 연산자

1) 산술연산자(+, -, *, /, %, **(거듭제곱))

2) 증감연산자(++, --) : 1씩 증가/감소

증감연산자는 데이터에 직접 사용할 수 없고 데이터가 할당된 변수만 피연산자로 사용할 수 있다.

전치/후치 연산자로 나뉘는데, 전치는 증가/감소가 먼저 이루어지고 값을 리턴하고, 후치연산자는 증가/감소 이전에 값을 리턴한다.

// 전치
let answer = 1;
let a = ++answer; // answer 값이 증가 후 할당
console.log(answer, a); // 2, 2

 
// 후치
let answer = 1;
let b = answer++; // answer 값 할당 후 증가
console.log(answer, b); // 1, 2

 

3) 대입연산자(=), 복합대입연산자(+=, -=, *=, /=, %=)

4) 비교연산자

  • 동등(==), 부등(!=)
  • 일치(===), 불일치(!==)
  • >, >=, <, <=

5) 삼항연산자(피연산자1 ? 피연산자2 : 피연산자3) -> 1이 참이면 2를 실행하고 거짓이면 3을 실행한다. 

6) 논리연산자(and: &&, or: ||, not: !)

 

5. 조건문

개발자가 명시한 boolean 자료형의 조건이 참인지 거짓인지에 따라 달라지는 계산이나 상황을 수행하는 문법. Javascript에서는 if문과 switch문 두가지가 있다.

 

1) if : 만약 ~라면

else만약 ~가 아니라면

else if : 여러개의 조건 지정 가능

    if (조건1)
       명령문1
    else if (조건2)
       명령문2
    else if (조건3)
       명령문3
    ...
    else
       명령문N

 

2) switch : case, break, default

const foo = 0;
switch (foo) {
  case -1:
    console.log("negative 1");
    break;
  case 0: // Value of foo matches this criteria; execution starts from here
    console.log(0);
  // Forgotten break! Execution falls through
  case 1: // no break statement in 'case 0:' so this case will run as well
    console.log(1);
    break; // Break encountered; will not continue into 'case 2:'
  case 2:
    console.log(2);
    break;
  default:
    console.log("default");
}
if문은 표현식의 비교가 가능하지만, swith문은 무조건 값이 온다. 
switch문으로 작성할 수 있는건 전부 if문으로 작성이 가능하지만, 반대로는 안될 수도 있다.

 

 

 

본 후기는 본 후기는 [유데미x스나이퍼팩토리] 프로젝트 캠프 : Next.js 2기 과정(B-log) 리뷰로 작성 되었습니다.