4주차 미션 [레인]

[geumbiii]

4주차 미션

• 로컬 DB 준비해오기(실제 테이블 생성)
• 워크북의 코드 브랜치에 올리기

---

실제 테이블 이미지

---

워크북 실습 코드

Node.js

const fs = require("fs");

console.log("Start");

fs.readFile("test.txt", "utf8", (err, data) => {
  if (err) throw err;
  console.log("File:", data.trim());
});

console.log("End");

/* 출력 결과
Start
End
File: (파일 내용) */

console.log("A");

setTimeout(() => {
  console.log("B");
}, 0);

console.log("C");

// 출력 결과: A→ C →B
// 동기 코드는 먼저, 비동기 콜백은 다음 턴에 실행

Javascript

const port = 3000;
let count = 1;
// 일반적으로 const 우선, 값이 바뀌어야 할 때만 let을 사용

// 일반 함수 표현식
const add = function (a,b) {
 return a + b;
};

// 화살표 함수 표현식
const add = (a,b) => a + b;


// 콜백에서 일반 함수 VS 화살표 함수 차이
function Counter() {
  this.count = 0;
  setInterval(function() {
    this.count++; // undefined (this가 다름)
  }, 1000);
}

function CounterFixed() {
  this.count = 0;
  setInterval(() => {
    this.count++; // 화살표 함수는 바깥 this 유지
  }, 1000);
}

//객체 구조 분해 할당
// 객체
const user = { name: "JaeSeo", age: 25 };
const { name, age } = user;

// 배열 
const numbers = [10, 20, 30];
const [first, second] = numbers;

// async와 await
async function fetchData() {
  return "데이터";
}

async function getUser() {
  const response = await fetch("https://api.example.com/user");
  const data = await response.json();
  console.log(data);
}

// 오류 처리
async function fetchData() {
 try {
  const res = await fetch("https://api.example.com/user");
  const data = await res.json();
  console.log(data);
 } catch (error) { 
  console.error("오류 발생:", error.message);
  }
 } 

TypeScript

const a = 1;
const b = '1'; // 문자열 '1' → number 1로 암묵적 타입 변환
console.log(a - b); // 0

// 타입 지정 방법
a: string = "UMC 10th"; // <변수이름>: <타입> = <값>

// 객체 타입
b: {
	id: number;
	name: string;
} = {
	id: 1,
	name: "홍길동"
};

// 배열
c: number[] = [1,2,3]; // number 배열
d: string[] = ['U','M','C']; // string 배열
e: { // 객체 배열
	id: number;
	name: string;
}[] = [
	{
		id: 1,
		name: "홍길동"
	},
	{
		id: 2,
		name: "고길동"
	}
];

// 유니언 타입
// 어떤 변수에 string값이 들어올 수도, number값이 들어올 수도 있는 경우
h: string | number;
// 두 값 모두 대입에 문제가 없습니다.
h = "UMC";
h = 1;

// 함수
// function 형태
function test1(value:number): number {
	return value;
}
// arrow function 형태
const test2 =  (value:number): number => {
	return value;
}

// 제너릭
function getFirstString(arr: string[]): string {
	return arr[0];
}
function getFirstNumber(arr: number[]): number{
	return arr[0];
}

// 제너릭을 사용
function getFirst<T>(arr: T[]): T {
	return arr[0];
}

// 타입과 인터페이스
type Challenger = {
		id: number,
		name: string"
}

interface Challenger{
  id: number;
  name: string;
}

const me: Challenger = {
  id: 1,
  name: "홍길동",
};