[2023 신입부원 심화 스터디] 황현진 #1주차 - 기초문법 part.1

📌 변수와 상수

- 변수: 변경할 수 있는 값

let 변수명;  // 변수 선언
변수명 = '황현진';  // 변수 값 초기화
let 변수명 = '황현진';  // 변수 선언과 동시에 초기화

※ 변수 초기화시 주의할 점
: 변수를 먼저 선언한 후, 초기화를 따로 할 때 let을 한 번 더 쓴다면 값을 변경하는 것이 아니라 변수를 재할당하는 것이기 때문에 에러가 발생한다.

 

- 상수: 변경할 수 없는 값

const 상수명 = 값;  // 상수는 선언할 때 초기화도 같이 해주어야 한다.
상수명 = 123123;  // 이러면 타입에러 발생(상수는 변경할 수 없기 때문)

 

- 이름 규칙

1. 변수나 상수 이름의 첫 번째 글자는 영어, $, _만 가능
   (숫자로 시작하는 변수명은 허용되지 않는다.)
2. 첫 번째 글자 이외에는 숫자도 사용 가능
   ex) _123, $123
3. 영어 소문자와 대문자는 구별
   ex) abc !== ABC
4. let, const와 같은 자바스크립트 예약어는 사용 불가
5. 이름에 공백은 허용되지 않음
   - Camel Case 방식 → whoAmI
   - Snake Case 방식 → who_am_i

우선 const로 먼저 선언한 후 값 변경이 필요한 경우 let으로 변경한다❗

 

+) var이란?

: let, const가 없던 예전 js에서 사용했던 예약어

var abc = 123;
var abc = 345;  // var을 한 번 더 사용해도 오류가 나지 않는다.

 

 

📌 원시 데이터 타입

- 원시 데이터 타입: 객체가 아니면서 메서드도 가지지 않는 데이터

   (string, number, bigint, boolean, underfined, null, symbol)

 

• number
  : 정수와 부동소수점 숫자를 나타내는 타입
• bigint
  : number 데이터 타입 범위를 넘어가는 아주 작거나 큰 숫자

const number = 123n;  // number 타입처럼 작성하되, 숫자 뒤에 n을 붙이면 된다.

 

• string
  : ' ', " ", ` `(백틱)로 감싸진 문자나 숫자

const age = 20;
const job = ‘개발자’;
const msg = ‘저는 ‘ + job + ‘이고, ‘ + age + ‘살 입니다.’;  // 백틱을 사용하지 않은 코드
const msg2 = `저는 ${job}이고, ${age}살 입니다.`;  // 백틱을 사용한 코드
// 백틱(` `)을 사용하면 가독성이 좋아지고 띄어쓰기 실수도 줄일 수 있다.

 

• boolean
  : 참 또는 거짓을 가지는 논리형 타입
• null
  : 값이 아예 존재하지 않는 것
• undefined
  : 값이 아직 지정되지 않은 것 (ex. 변수를 만들고 아직 초기화 하지 않았을 때) 

 

 

📌 참조 데이터 타입

- 원시와 참조의 차이

원시	참조
메모리에 해당 변수를 위한 공간이 마련된다. 그리고 그 안에 값이 저장된다.	여러 개의 값을 저장하기 때문에 고정된 메모리 값을 할당 받을 수 없다. 힙이라는 별도의 공간에 값을 저장하고, 변수에는 그 힙을 가리키는 메모리 주소값만 저장한다.

 

• 배열: 데이터들의 집합으로 구성 (대괄호 사용)

const arr = [1, 2, 3];  // 숫자 배열 생성
console.log(arr[0])  // 배열의 0번째 인덱스 출력 (인덱스는 0부터 시작)
const arr = [1, 2, 3, [4, 5]]  // 배열안에 배열 중첩 가능
const arr = [1, 2, 3, {name: ‘황현진’}] // 배열과 객체 중첩 가능

 

• 객체: property( = key + value )로 구성 (중괄호 사용)
  - property 사용법
    1) 점 표기법 -> 일반적인 상황에서 사용
    2) 대괄호 표기법

const obj{
	name: '황현진', 
	job: '개발자'  // key = job, value = '개발자'
}
console.log(obj.name);  // 점 표기법
console.log(obj['name'])  // 대괄호 표기법

 

 

 

📌 연산자

산술 연산자	+, -, *, /, % (나머지 연산자), ** (지수 연산자)
증감 연산자	++ (1 증가), -- (1 감소)
비교 연산자	<, >, <=, >=, ==, ===, !== a =123, b = '123' 일 때, a==b 는 true (추상비교) a===b 는 false (엄격비교, 타입까지 비교)
논리 연산자	&& (and), || (or), ! (not)
삼항 연산자	조건 ? 참일 때 실행될 부분 : 거짓일 때 실행될 부분
널리쉬(nullish) 연산자	??
비트 연산자	&, |, ~, ^, <<, >>
대입 연산자	=, +=, -=, *=, /=, %=, **= (복합 대입 연산자)

+) 전개 구문

const numbers = [1, 2, 3];
console.log(...numbers); // ...을 찍으면 전개 연산자
// -> 1 2 3 (배열의 원소를 펼쳐서 보여준다)
console.log(numbers);
// -> [1, 2, 3] 배열로 출력이 된다. 

const numbers2 = [4, 5, 6];

const newNumbers = [...numbers, ...numbers2];  // 두 배열을 합칠 때 사용
cosole.log(newNumbers);
// -> [1, 2, 3, 4, 5, 6]