Koras02's 여러가지 이야기

[프랑스] 프랑스어 Day 01일차 - Bonjour 부터 시작하기

Tinkies — Thu, 9 Apr 2026 19:31:31 +0900

프랑스어 공부 1일차 너무 어렵게 시작하지 말고 가장 기초적인 인사부터 익혀보기로 한다. 기초 단어와 발음을 직접 입으로 말해보며 배워보자 간단한 인사와 안부를 전하기 위해 다음과 같이 발음한다.

✅ 기초 단어 + 발음

Bonjour(봉주르) → 안녕

Merci(메흐씨) → 고마워

Ça va ? (싸 바?) → 잘 지내?

※ 발음은 이해를 돕기 위해 사용한 표현이며 실제와는 차이가 있을 수 있음

✅ 기본 문장

Ça va ? (잘 지내?)를 배웠으니 이제 뒤에 이어서 답하는 방법도 알아보겠습니다.

1. 잘 지낼 때 (긍정)

→ Ça va. (싸 바.) - 잘 지내. / 괜찮아.

→ Ça va bien. (싸 바 비앙.) - 잘 지내. / 아주 좋아

→ Très bien, merci. (트레 비앙, 메르시.) - 아주 좋아, 고마

→ Et toi? (에 뚜아?) - 너는 ? / Et vous? (에 부?) - 당신은? (되물을 때)

2. 그냥 그럴 때 (보통)

→ Comme ci, comme ça. (꼼씨 꼼싸.) - 그저 그래. / 그냥 그래.

→ Ça va. (싸 바) - (덤덤하게) 어, 뭐 괜찮아.

3. 잘 못 지낼 때 (부정)

→ Ça ne va pas. (싸 느 바 빠.) - 잘 안 지내. / 별로야

→ Ça va mal. (싸 바 말.) - 안 좋아

✅ 한 줄 기록

어렵다..발음이 아직 낯설어서 그런가? 그래도 짧아서 따라할 만하다. 다음 시간에는 je suis(쥬 쉬) 문장을 배워보도록 하겠다.

[JavaScript] New Javascript 17장 - 이터널레이터와 제너레이터

Tinkies — Wed, 8 Apr 2026 11:30:57 +0900

✅ 1. 이터널레이터 (Iterator)

이터러블(Iterable)의 객체(array, Map, Set 등)의 요소를 한 번에 하나씩 순차적으로 접근하는 인터페이스를 이터러블(Iterable)이라고 합니다, next() 메서드를 가지며, 이 메서드는 { value: 값, done: boolean } 형태의 객체를 반환합니다. done이 true가되면 반복이 종료되었음을 의미합니다.

const arr = [1, 2, 3, 4];
// 배열의 iterator 객체를 생성
const iter = arr[Symbol.iterator]();

// iterator 객체를 사용해서 배열의 각 원소를 반복하여 출력
console.log(iter.next()); // { value: 1, done: false }
console.log(iter.next()); // { value: 2, done: false }
console.log(iter.next()); // { value: 3, done: false }
console.log(iter.next()); // { value: 4, done: false }
console.log(iter.next()); // { value: undefined, done: true }

**✅ 2. 제너레이터 (Generator, function*) 개념 및 예시**

function* 키워드로 정의하는 제너레이터는 일반 함수와는 달리 호출 시 코드를 실행하지 않으며 제너레이터 객체(iterator 이자 iterable)를 반환합니다, 함수 실행을 중간에 일시 중지(yield) 했다가 필요할 때 다시 재생할 수 있으며 상태를 주고받을 수 있어 비동기 처리나 무한 시퀀스 생성에 효율적입니다.

function* randomGenerator() {
  yield Math.random();
  yield Math.random();
  return Math.random();
}

const gen = randomGenerator(); // 생성된 generator 객체

// generator 객체를 사용해서 반복하여 출력 = 출력할 때 마다 yield 키워드로 멈춰있던 부분에서 다시 시작
// done 부분은 generator 함수의 실행이 끝났는지를 나타냄
console.log(gen.next());
console.log(gen.next());
console.log(gen.next());
console.log(gen.next());

✅ 3. yield 키워드 개념 및 예시

yield 키워드는 제너레이터 함수 내부에서만 사용이 가능하고 함수의 실행을 일시 정지시키는 역할을 담당합니다, yield 키워드 뒤에 오는 표현식의 값을 제너레이터 호출자(next() 호출한 곳)에 반환하며 return과는 달리 함수를 완전히 종료하지 않고 잠시 멈추는 역할을 합니다.

function* viewGenerator() {
  console.log("이전화");
  yield 1;
  console.log("재생/일시정지");
  yield 2;
  console.log("다음화");
}

const view = viewGenerator();

view.next(); // "이전화" 출력, yield 1에서 멈춤
view.next(); // "재생/일시정지" 출력, yield 2에서 멈춤
view.next(); // "다음화" 출력, 제너레이터 종료

✅ 4. 제너레이터와 yield 활용하기 (for..of)

제너레이터 객체는 이터러블(iterable)이므로 for...of문을 사용해 next()를 일일히 호출하지 않고도 간편하게 값을 출력할 수 있습니다.

function* viewGenerator() {
  yield "이전화";
  yield "재생/일시정지";
  yield "다음화";
}

for (let view of viewGenerator()) {
  console.log(view); // "이전화", "재생/일시정지", "다음화" 순서대로 출력
}

✅ 5. 정리

개념	정의	특징
iterator	next()로 요소를 순화하는 객체	next()로 {value, done} 반환
Generator	iterator 생성 및 함수 제어	function*으로 선언과 일시 정지 가능
yield	제너레이터 내 실행 중단/값 반환	잠시 멈추고 재개 가능, 지연 평가

GitHub - javascript-only/newJSRoom: https://thinky.tistory.com/category/Front-End/JavaScript

https://thinky.tistory.com/category/Front-End/JavaScript - javascript-only/newJSRoom

github.com

[엑셀 공부] 찾기 함수

Tinkies — Tue, 7 Apr 2026 16:31:50 +0900

수백 명의 직원 명단에서 특정 직원의 '나이'를 찾고 싶거나, ID를 입력하면 자동으로 '부서'를 뜨게 하고 싶을 때 사용하는 것이 바로 엑셀의 찾기 함수다, 일일이 컨트롤+F(찾기)를 할 필요 없이, 데이터를 서로 연결(VLOOKUP/XLOOKUP)해주면 되는 마법 같은 도구이다. 먼저 간단하게 직원 표를 작성해보자.

번호(A열)	부서명(B열)	직급명(C열)	성명(D열)	입사일자(E열)	비고(F열)
1	인사팀	사원	김철수	2026.01.11
2	생산/물류	과장	김예지	2018.03.11
3	재무/회계	차장	김민수	2013.04.01
4	영업/마케팅	부장	김현민	2010.06.01

1. VLOOKPUP (Vertical Lookup)

VLOOKUP을 사용해 수직(Vertical)으로 나열된 데이터를 위에서 아래로 훑으며 찾을 수 있다 위에 함수 작성 칸에 다음과 같이 공식을 착성하면 된다.

=VLOOKUP(찾을값, 참조범위, 열번호, 0)

=VLOOKUP("생산/물류", B2:F5, 3, 0)

"생산/물류" (찾을값): "생산/물류라는 글자를 찾아줘"
B2:F5 (참조범위): "데이터 안에 들어 있는 전체 표 범위를 봐" (중요: 찾을 기준값이 표의 맨 왼쪽에 있어야 함)
3 (열번호): "생산/물류 팀원을 찾으면, 그 줄에서 오른쪽으로 3번쨰 칸(성명)에 있는 값을 가져와"
0 (일치옵션): "비슷한 거 말고 정확한 값을 찾아줘"

VLOOKUP의 한계

왼쪽은 못 본다: 직급명(C열)으로는 번호(A열)을 찾을 수 없다 (무조건 오른쪽만 가능)
열 삽입에 취약하다: 중간에 새로운 열을 끼워 넣으면 '3번째 칸'이라는 순서가 꼬여 엉뚱한 값을 가져온다.

2. XLOOKUP (Excel 2021 이상)

VLOOKUP의 모든 단점을 해결하고 나온 함수로 훨씬 직관적이고 강력한 함수이다

=XLOOKUP(검색_키, 조회_범위, 결과_범위)

=XLOOKUP("생산/물류",B2:B4, C2:C4)

"생산/물류" (찾을값): "생산/물류 부서를 찾아줘"
B2:B4 (찾을범위): "부서명이 모여있는 B열에서 찾아."
C2:C4 (결과범위): "찾았으면 같은 줄의 C열(직급명) 값을 가져와"

3. 무엇을 사용해야 할까?

특징	VLOOKUP(기존)	XLOOKUP(신형)
찾는 방향	오른쪽으로만 가능	왼쪽/오른쪽 모두 가능
범위 지정	전체 표를 뭉텅이로 지정	찾을 열/결과 열을 각각 지정
열 번호 세기	손가락으로 직접 세야함	안 세도 가능 (클릭만 하면 끝)
데이터 수정	열 삽입 시 수식 망가짐	열 삽입해도 수식 유지

[JavaScript] New Javascript 16장 - 옵셔널 체이닝과 Null 병합

Tinkies — Mon, 6 Apr 2026 17:47:58 +0900

✅ 1. 옵셔널 체이닝 (Optional Chaining, ?.)

옵셔널 체이닝(Optional Chaining)은 객체의 중첩된 속성 또는 매세드에 접근할 시, 중간에 있는 값이 null이나 undefined일 경우 에러를 발생시키지 않고 undefined를 반환하게 해주는 방법으로 기본 구조는 다음과 같습니다

객체?.속성

옵셔널 체이닝의 특징: 옵셔는 체이닝은 ?. 앞의 대상이 null이거나 undefined이면, 그 즉시 평가를 멈추고 undefined를 반환해 준다.
사용하는 이유: 데이터가 필수적이지 않을 경우 에러(Cannot read property ...of undefined)로 인하여 프로그램이 종료되는 것을 방지하기 위함

const user = { name: "Chaeyoung", age: 20 };
// user.cat는 undefined이므로 에러 대신 undefined 반환
console.log(user.cat?.name); // undefined
// console.log(user.cat.name); // TypeError: Cannot read property 'name' of undefined

✅ 2. Null 병합 연산자 (Nullish Coalescing Operator. ??)

Null 병합 연산자(Nullish Coalescing Operator)은 왼쪽 피연산자가 null이거나 undefined이면, 오른쪽 피연산자를 반환하고, 그렇지 않으면 왼쪽 값을 반환하는 논리연산자입니다.

왼쪽의 값 ?? 오른쪽의 값

특징: | | (OR) 연산자와 비슷하나, 0," ", false 같은 "falsy(거짓같은 값)"한 값들을 유효한 값으로 취급하고 오직 nul이나 undefined일 때만 오른쪽의 값을 사용한다.
사용하는 이유: 변수의 기본값을 설정하거나, 0 또는 빈 문자열을 의도적으로 처리해야 할 경우에 유리함

// Null 병합 연산자
const count = 0;
const text = null;

console.log(count ?? 20); // 출력: 0 (0은 null이 아니므로 20이 아닌 0이 출력);
console.log(text ?? "기본 텍스트"); // 출력: "기본 텍스트" (text는 null이므로 오른쪽 값이 출력);

✅ 3. 정리 (옵셔널 체이닝 or Null 병합)

특징	옵셔널 체이닝(?.)	Null 병합 (??)
목적	안전한 속성에 접근	기본값을 설정할 때
대상	객체의 속성/메서드	변수, 값
null 또는 undefined 시	undefined 반환	우항 값 반환
Falsy값 취급	0, " "는 통과	0, " "도 통과(nullish만 처리)

GitHub - javascript-only/newJSRoom: https://thinky.tistory.com/category/Front-End/JavaScript

https://thinky.tistory.com/category/Front-End/JavaScript - javascript-only/newJSRoom

github.com

[엑셀 공부] 표 & 정리 기능

Tinkies — Tue, 31 Mar 2026 10:42:48 +0900

엑셀로 데이터를 체계적으로 관리하고 시각화하여, 누구나 한눈에 알아볼 수 있는 상품리스트를 만들어보려고 한다, 단순히 기록하는 리스트를 넘어, 클릭 몇 번으로 원하는 정보를 찾고 재고 상태를 자동으로 파악하는 효율적인 관리 기술을 익혀보자

1. 표 만들기 (Table)

데이터를 입력한 후 가장 먼저 '표'로 지정해야 정렬과 필터 아이콘이 나타난다, 먼저 해당 상품 명, 가격 등이 적힌 데이터 전체를 마우스로 드래그 하고 상단 메뉴 [삽입] -> [표]를 클릭해 표(엑셀 기준)로 변환한다. 구글 엑셀에서는 마우스 우클릭 -> 표로 변환을 누르면 간편하게 표를 만들 수 있다

상품명	카테고리	판매가	재고량
무선 키보드	전자	45,000	10
사과	식품	9900	300

2. 정렬 (Sort) - 원하는 순서로 줄 세우기

이제 표를 만들었으니 이번에는 표를 만든 후 생긴 화살표를 이용해 데이터를 나열 할 수 있다, '판매가/kg 당' 제목 옆에 작은 화살표를 눌러 열 정렬 -> [오름차순 정렬]을 누르면 높은 가격 순, [내림차순 정렬]이면 낮은 가격 순으로 정렬된다

상품명	카테고리	판매가(정렬 ↓)	재고량
배	식품	7900	300
사과	식품	9900	300
무선 키보드	전자	45,000	10

상품명	카테고리	판매가(정렬 ↑)	재고량
무선 키보드	전자	45,000	10
사과	식품	9900	300
배	식품	7900	300

3. 필터 (Filter) - 필요한 것만 골라내기

표의 화살표 버튼을 이용하여 필터 기능도 구현할 수 있다, 상품명 옆에 화살표를 클릭해 아래 목록에 '배'와 '사과'만 체크하고 '무선 키보드'를 체크 해제한 뒤 [확인]을 누르면 사과와 배만 필터링된다

상품명	카테고리	판매가	재고량
사과	식품	9900	300
배	식품	7900	300

4. 조건부 서식 (Formatting) - 자동 강조

이번엔 재고가 부족하다면 셀 색상을 자동으로 변하게 할 수 있다, '재고량' 숫자 칸들을 전부 드래그하고 메뉴에 [서식] -> [조건부 서식]을 클릭하면 우측 설정창이 뜨고 [텍스트에 포함] 선택 -> 아래 칸에 품절이라고 타이핑 -> '채우기 색'을 빨간색으로 선택하고 완료를 눌러보면 아래 처럼 글씨가 강조된다.

상품명	카테고리	판매가	재고량
무선 키보드	전자	45,000	10
사과	식품	9900	300
배	식품	7900	300
포도	식품	6,900	0 (품절)

엑셀 공부 프로젝트

이 브라우저 버전은 더 이상 지원되지 않습니다. 지원되는 브라우저로 업그레이드하세요.

docs.google.com

[엑셀 공부] 기본 함수

Tinkies — Mon, 30 Mar 2026 12:24:02 +0900

엑셀에서 가장 많이 사용하는 기본 함수에 대해 알아보고자 한다, 카테고리에 맞게 각각 어느 기능인지 알아보겠다, 우선 실무에서 바로 사용할 수 있는 대표적인 함수로는 4가지 정도가 있다, IF 함수, SUMIF 함수, VLOOKUP 함수, LEFT/RIGHT/MID 함수 등이 있으며 이러한 함수들은 실무에서 자주 써먹는다.

1	A	B	C	D	E
2	ID	이름	종류	나이	성체
3	Maltese-01	까미	강아지	2	어린이
4	Munchkin-02	꾸꾸	고양이	1	어린이
5	Foodle-03	보리	강아지	4	성체
6	Scottish-04	치치	고양이	3	성체
7	Pomeranian-05	콩이	강아지	2	어린이

IF 함수 (조건 판단)

사용 목적: 나이가 3살 이상이면 "성체", 아니면 "어린이"로 분류
설정: 구글 기준 [파일] > [설정]으로 이동 [계산]탭에서 반복 계산(Iterative calculation)을 '사용'으로 설정 후 최대 반복 횟수를 기본값(100)으로 설정
수식: =IF(D3>=3, "성체", "어린이")
결과: 보리(4세) -> 성체 / 꾸꾸(2세) -> 어린이

SUMIF 함수 (조건부 합계)

사용 목적: '강아지'의 나이 총합 구하기
- 수식: =SUMIF(C3:C7, "강아지", D3:D7)
- 결과: 4 (보리 3 + 꾸꾸 1)

VLOOKUP 함수(데이터 검색)

사용 목적: ID가 "Maltese-01"인 동물 이름 찾기
- 수식 :=VLOOKUP("Munchkin-02", A2:C7, 2, FALSE)
- 결과: 치치 (A열에서 Scottish-04를 찾아 2번째 열인 이름 반환)

LEFT / RIGHT / MID 함수 (텍스트 추출)

LEFT (종류 코드 추출): ID에서 앞 글자 3개를 추출
- 수식: =LEFT(A3, 3)
- 결과: Mal
RIGHT (일련번호 추출): ID에서 뒤 2글자 (일련번호) 추출
- 수식: =RIGHT(A3, 2)
- 결과: 01
MID (분류 코드 추출): ID에서 5번째 위치부터 2글자 추출
- 수식: =MID(A3, 5, 2)
- 결과: es (Maltese-01에서 es 추출)

엑셀 공부 프로젝트

이 브라우저 버전은 더 이상 지원되지 않습니다. 지원되는 브라우저로 업그레이드하세요.

docs.google.com

[엑셀 공부] 기본 입력 & 조작

Tinkies — Fri, 27 Mar 2026 18:59:48 +0900

엑셀의 핵심인 기본 입력 및 조작 방법에 대해 알아보도록 하겠다. 먼저 엑셀의 기초인 셀(Cell), 열(Column), 행(Row), 범위(Range)가 있으며 이들은 엑셀의 거대한 표(Grid) 역할을 한다. 이 표를 구성하는 가장 작은 단위를 이해하는 것이 엑셀의 첫 시작이라고 볼 수 있다.

A열과 1행

셀은 행과 열이 만나는 작은 상자로 데이터가 입력되는 최소 단위이다 A열과 1행이 만나는 곳이 바로 A1 셀이다.

알파벳으로 표시되는 열(Column)

열은 세로줄이며, 영어 알파벳(A, B, C...)등으로 표시된다,

숫자로 표시되는 행(Row)

행은 가로줄이며, 숫자(1, 2, 3...)으로 표시된다, 예를 들어 1번 행에서 6번 행까지 SHIFT+클릭 시 전체 영역이 선택된다.

SHIFT + 클릭으로 1~8까지의 행과 열에 영역을 전체 선택

범위(Range)는 여러 셀을 선택한 묶음으로 A1:C5 드래그해서 선택하거나 SHIFT + 클릭으로 해당 영역을 전체선택 할 수 있다

이번엔 엑셀에 데이터를 입력해서 수정 및 삭제를 해보겠다. 먼저 엑셀에 데이터를 입력하려면 셀을 클릭해 내용을 입력하고 Enter(아래로 이동) 또는 Tab (오른쪽으로 이동)하고 줄 바꿈을 하기 위해서 Alt + Enter를 사용한다.

데이터를 수정하거나 삭제하는 방법은 다음과 같다 굳이 보여주지 않아도 알 것 같아 단축키만 정리해 보겠다.

데이터 수정

해당 칸 더블 클릭: 해당되는 셀을 더블 클릭하여 내용을 수정
F2 단축키: 셀을 선택하고 F2를 누르면 수정 모드로 전환
수식 입력줄: 상단 fx 수식 입력줄에서 수정

데이터 삭제

Del (Delete) 키: 셀의 내용만 지우고 서식은 남김
셀 우클릭 -> 삭제: 셀 자체를 없애고 아래/오른쪽 셀을 당겨

단순 복사 외에도 다양한 복사 붙여 넣기 기능도 있다 일반 붙여 넣기(Ctrl + V)는 내용과 서식을 모두 복사하고 값으로 붙여 넣기(123)은 수식을 제외하고 "결괏값"만 붙여 넣고, 가로 데이터를 세로로, 세로 데이터를 가로로 바꿀 땐 행/열 바꿈을 사용한다 (우클릭-선택하여 붙여 넣기- 행/열 바꿈)

셀 오른쪽 하단의 작은 녹색 점(채우기 핸들)을 드래그하여 데이터를 자동으로 채울 수 있다.

연속된 데이터 (월, 요일, 날짜) 도 자동으로 드래그하면 입력이 된다.

동일 내용 복사하기: 해당 문자를 입력 후 드래그
숫자 증가시키며 복사: Ctrl 키를 누른 채 드래그

이제 이 문서를 저장하기 위해선 일반 저장 및 다른 이름으로 저장할 수 있습니다

일반 저장: Ctrl + S
다른 이름으로 저장: F12 (파일 위치, 이름, 형식 변경), ✅ 기본 엑셀만 해당
파일 형식:
- .xlsx: 일반 엑셀 통합 문서
- .csv: 쉼표로 구분된 텍스트 파일 (데이터 호환용)

[JavaScript] New Javascript 15장 - 프로미스와 비동기 작업(Promise, async/await)

Tinkies — Fri, 27 Mar 2026 11:18:19 +0900

✅ 1. 비동기 작업이란?

자바스크립트는 기본적으로 싱글 스레드(Single thread)로 동작하는 언어로, 한 번에 하나의 작업만 처리할 수 있습니다. 그런데 시간이 오래 걸리는 작업까지 순서대로 기다리면 전체 실행 속도가 매우 느려집니다. 그래서 이러한 문제를 해결하기 위해 등장한 것이 바로 비동기 처리입니다.

// 1. 비동기 작업 시작
console.log("비동기 작업을 시작합니다");

// 2. 비동기 작업 시뮬레이션 (예: API 호출, 파일 읽기 등)
setTimeout(() => {
  console.log("5초 후 실행");
}, 5000);

console.log("비동기 작업 종료");

➡️ 실행 결과

비동기 작업을 시작합니다
비동기 작업 종료
5초 후 실행

시간이 걸리는 작업은 뒤로 미루고 나머지 코드를 먼저 실행하는 구조

✅ 2. 콜백 함수 방식

비동기 작업은 처음에 콜백 함수로 처리했습니다, 그러나 문제는 작업이 많아질수록 코드가 늘어나 유지보수가 어려워집니다.

function work(callback) {
  setTimeout(() => {
    console.log("작업 완료");
    callback();
  }, 1000);

  work(() => {
    console.log("다음 작업");
  });
}

setTimeout(() => {
  console.log("1");

  setTimeout(() => {
    console.log("2");
    setTimeout(() => {
      console.log("3");
    }, 1000);
  }, 1000);
}, 1000);

이 것을 콜백 지옥이라고 한다. 가독성이 떨어지고 유지보수의 최악

✅ 3. Promise의 등장

이러한 콜백 지옥을 해결하기 위해 Promise(약속)이 등장하였습니다 Pomise는 "비동기 작업이 끝나면 결과를 알려주겠다"라는 약속을 의미하는 객체입니다.

const promise = new Promise((resolve, reject) => {
  const success = true; // 성공 여부를 나타내는 변수

  if (success) {
    resolve("작업이 성공적으로 완료되었습니다."); // 작업이 성공했을 때 resolve 호출
  } else {
    reject("작업이 실패했습니다."); // 작업이 실패했을 때 reject 호출
  }
});

핵심

resolve → 성공
reject → 실패

✅ 4. Promise 결과 출력

const promise = new Promise((resolve, reject) => {
  resolve("작업이 성공적으로 완료되었습니다.");
});

promise
  .then((result) => {
    console.log(result);
  })
  .catch((error) => {
    console.log(error);
  });

➡️ 실행 결과

작업이 성공적으로 완료되었습니다.

✅ 5. 실패 예시

// 실패 예시
const promise = new Promise((resolve, reject) => {
  reject("에러 발생");
});

promise
  .then((result) => {
    console.log(result);
  })
  .catch((error) => {
    console.log(error);
  });

➡️ 실행 결과

에러 발생

성공 → then
실패 → catch

✅ 6. Promise 체이닝

// Promise 체이닝
new Promise((resolve) => {
  resolve(10);
})
  .then((num) => num * 2) // 10 * 2 = 20
  .then((num) => num + 5) // 20 + 5 = 25
  .then((num) => {
    console.log(num); // 25
  });

➡️실행 결과

흐름

10 → 20 → 25 → 출력

콜백처럼 중첩이 필요하지 않음

✅ 7. async / await (더 쉽게 사용)

async

async function test() {
  return "Hello, Async/Await!";
}

// 출력
test().then(console.log); // Hello, Async/Await!

async 함수는 Promise를 반환

await

function delay(ms) {
  return new Promise((resolve) =>
    setTimeout(() => resolve("Delayed Result"), ms),
  );
}

async function run() {
  const result = await delay(1000);
  console.log(result); // Delayed Result (1초 후 출력)
}

run(); // run() 호출하여 async 함수 실행

await = 결과 나올 때까지 기다림

✅ 8. 에러 처리

async function fetchData() {
  try {
    // 에러 처리
    const result = await Promise.reject("에러");
    console.log(result); // 에러 출력
  } catch (e) {
    console.error("Error fetching data:", e); // 에러 출력
  }
}

// 실행
fetchData();

async/await에서는 try-catch를 사용

✅ 핵심 정리

비동기 = 기다리지 않고 다음 코드를 실행
콜백 → Promise → async/await 순으로 발전
Promise는 try/catch 사용
async/await는 더 읽기 쉬운 방식
에러는 catch 또는 try-catch로 처리

GitHub - javascript-only/newJSRoom: https://thinky.tistory.com/category/Front-End/JavaScript

https://thinky.tistory.com/category/Front-End/JavaScript - javascript-only/newJSRoom

github.com

[엑셀 공부] excel을 시작한 이유

Tinkies — Fri, 27 Mar 2026 09:36:28 +0900

오랜만에 블로그를 다시 켰다. 그냥 시간을 보내기보다, 무언가를 남기고 기록하는 것이 좋을 것 같아서 엑셀 공부를 시작해보기로 했다, 엑셀은 실무에서 업무나 개인 정리할 때 많이 사용한다고 알고 있었는데, 막상 제대로 배워보려고 하니까 복잡한 것 같아 이렇게 기초부터 정리해보고자 한다.

처음이라 부담 없이 웹용 엑셀로 시작했다, 브라우저에서 설치 없이 바로 사용이 가능하기에 연습하기 편했고 엑셀을 처음 켜보니 셀,행,열 구조가 눈에 들어왔다, A,B,C 같은 열과 숫자로 된 행이 있고, 그 안에 데이터를 입력하는 방식이었고, 우선 기본적으로 입력하고 저장하는 것부터 익히는데 집중했다. 우선 간단하게 표를 하나 직접 만들어 봤다

이렇게 입력한 다음, 점수의 합계를 구해보았다,

=SUM(B2:B4) 이식을 입력하고 엔터를 누르니 자동으로 총점이 계산되었다, 직접 더하지 않아도 되는 게 생각보다 편했고 이번엔 B열의 3개의 점수의 평균도 같이 구해보았다 B열 밑에 빈 칸을 클릭하고 =AVERAGE(B2:B4)를 입력하면

이렇게 평균 점수도 나온다, 처음에는 그냥 숫자 적는 프로그램 정도로만 생각했는데, 함수 하나만 써도 훨씬 편해지는 느낌이었다, 으늘은 기본적인 것만 확인해보고 앞으로 하나씩 배운 것을 이렇게 정리하고자 한다. 다음에는 SUM이랑 IF 함수를 조금 더 써보면서 익혀볼 생각이다.

[Javascript] New Javascript 14장 - Symbol (심볼)

Tinkies — Mon, 15 Sep 2025 10:50:16 +0900

✅ 1. Symbol(심볼) 이란?

Symbol은 자바스크립트 ES6에 도입된 원시 타입(Primitive Type)중 하나로 고유하고 변경 불가능한 값입니다. 주로 객체의 키(Key)로 사용해 충돌을 방지할 때 활용됩니다.

const id = Symbol("id");
console.log(id); // Symbol(id)
console.log(typeof id); // symbol

✅ 2. Symbol 특징

고유성 보장: 같은 설명(description)을 줘도 하상 다른 값을 반환함

const a = Symbol("test");
const b = Symbol("test");

console.log(a === b); // false

문자열 변환 불가: 자동으로 문자열이 반환되지 않음

const sym = Symbol("hello");
console.log(sym.toString()); // Symbol(hello)

✅ 3. 객체 속성에서 활용

객체의 키로 Symbol을 사용해 충돌 없이 안전한 속성을 만들 수 있습니다.

// Symbol 오브젝트
const userId = Symbol("userId");

const user = {
  name: "John Doe",
  [userId]: "2130412", // 심볼을 키로 사용 가능
};

console.log(user.name); // John Doe
console.log(user[userId]); // 2130412

✅ 4. 심볼의 내장 심볼(Well-known Symbols)

자바스크립트는 여러 특수 동작을 정의하는 내장 심볼을 제공합니다.

// 심볼의 내장 심볼
const myObj = {
  [Symbol.toStringTag]: "MyObject",
};

console.log(Object.prototype.toString.call(myObj)); // [object MyObject]

Symbol.iterator: 반복 가능 객체 정의
Symbol.toStringTag: 객체의 기본 문자열 태그 지정
Symbol.hasInstance: instanceof 동작 정의

✅ 5. Symbol.for() 와 전역 심볼

const a = Symbol.for("shared");
const b = Symbol.for("shared");

console.log(a === b); // true

Symbol() : 매번 새로운 심볼을 생성
Symbol.for("key"): 전역 심볼 레지스트리에서 관리 -> 같은 키일 시 같은 심볼 반환

✅ 정리

Symbol은 유일무이한 값으로 객체의 키 충돌 방지용으로 유용함
내장 심볼을 활용 시 JS의 내부 동작을 커스터마이징 가능

GitHub - javascript-only/newJSRoom: https://thinky.tistory.com/category/Front-End/JavaScript

https://thinky.tistory.com/category/Front-End/JavaScript - javascript-only/newJSRoom

github.com