[Day1] 1.1) ~ 1.5) 강 수강

이정환 강사님의 인프런 강의, '한 입 크기로 잘라먹는 리액트'의 강의 내용과 자료를 바탕으로 정리한 내용입니다

1.1) 안녕 자바스크립트

JavaScript의 실행 방법

JavaScript는 JavaScript 엔진이라는 프로그램을 통해 실행된다. 이 엔진이 없으면 실행 및 해석이 불가능하다.
자바스크립트는 크롬/사파리 등의 웹브라우저에 모두 탑재돼 있다. 따라서 웹브라우저를 이용하여 간단한 자바스크립트 코드를 작성 및 실행시켜 볼 수 있다.

웹브라우저의 개발자 도구 사용하기

• 윈도우: F12
• 맥: Command + Option + I

1.2) VsCode 설치하기

이미 다운 및 설정이 다 돼 있어서 스킵!

1.3) JavaScript 실습 환경 설정

1.4) 변수와 상수

변수

• let이라는 키워드를 사용하여 선언한다.
• 변수는 언제든 값을 바꿀 수 있기 때문에, 선언할 때 초기값을 설정하지 않아도 된다.
• let이라는 키워드로 만든 변수들은 이름으로 서로 구별되기 때문에, 특수한 경우가 아니면 중복된 이름으로 다시 선언하는 건 불가능하다.

상수

• const라는 키워드를 사용하여 선언한다.
• 초기화 이후에는 값을 변경할 수 없다.

네이밍 규칙

• $나 _을 제외한 기호는 사용할 수 없다.
• 변수 이름은 숫자로 시작할 수 없다.
• 예약어를 사용할 수 없다. (ex let, const등 자바스크립트가 이미 특수한 의미로 사용하기로 약속한 단어들)

변수 명명 가이드

• 변수의 이름은 해당 변수에 저장하는 데이터를 잘 대변해주는 이름으로 지어야 한다.

1.5) 자료형

자료형(Type)의 정의

Type은 값들을 포함하는 집합이다. 집합은 동일한 성질을 가지고 있는 원소들을 묶은 걸 말한다. 자바스크립트에서는 문자열들을 묶어 String이라는 자료형, 숫자라 부르는 값들을 묶어 Number라는 자료형 등으로 부른다.

원시 타입은 기본형 타입이라고 부르기도 한다.

Number

let num1 = 27; //양수
let num2 = 1.5; //실수
let num3 = -20; //음수

let num1 = Infinity; //양의 무한대
let num1 = -Infinity; //음의 무한대

let num1 = NaN; //Not a number의 약자로, 수치연산에 실패했을 때 결과값으로 사용하게 된다.

String

let myName = "모리";

문자열을 저장할 때에는 작은 따옴표'나 큰 따옴표"로 데이터를 묶어줘야 한다.

문자열 덧셈 연산

let myBreed = '말티즈'
let myName = '모리'
let introduce = myBreed + myName;

+를 사용해 문자열 연산을 하면, 피연산자 두 개에 저장된 문자열을 이어붙인 값이 연산 결과가 된다.

템플릿 리터럴 문법

let introduceText = `${myName}`

백틱`을 사용해서도 문자열을 저장할 수 있다. 백틱을 사용하면 문자열 안에 변수의 값을 동적으로 집어넣을 수 있다.

Boolean

let isSwitchOn = true;

불리언 타입은 참(true)이나 거짓(false)만을 저장할 수 있는 타입이다.

Null

let empty = null;

Null은 아무것도 없다는 걸 의미한다. 따라서 어떠한 변수에 아무 값도 담겨져 있지 않음을 표현하기 위해 사용한다.

Undefined

Null과 같이 단 하나의 값만 포함하는 특수한 타입이다. undefined라는 값은 변수를 선언하고 어떠한 값도 집어넣지 않았을 때 자동으로 할당되는 값이다. (null이라는 값은 우리가 직접 명시적으로 변수에 할당해 줘야하는 값이다.)