[JavaScript] 디스트럭처링 할당(구조 분해 할당)

destructuring비구조화 / 구조 파괴 JavaScript로 문제를 풀면서 구조 분해 할당에 대한 이해가 아직 부족한 것 같아, 정리해보았습니다.잘 와닿지 않던 분들도 이번 기회에 정리하시길 바랍니다! 구조 분해 할당(destructuring assignment)는 구조화된 배열과 같은 이터러블 또는 객체를 디스트럭처링 하여 1개 이상의 변수에 개별적으로 할당하는 것을 말합니다. 배열 또는 객체에서 필요한 값만 추출하여 변수에 할당할 때 유용합니다. 1. 배열 디스트럭처링 할당(1) ES5에서의 배열 구조 분해 할당// ES5var arr = [1, 2, 3];var one = arr[0];var two = arr[1];var three = arr[2];console.log(one, tw..

• format_list_bulleted Study Notes/JavaScript
• · 2025. 2. 13.
• textsms

[TypeScript] 데이터 타입: any vs unknown, void vs undefined

TypeScript는 JavaScript보다 더 엄격한 타입 시스템을 제공하지만,때때로 타입을 유연하게 하거나 아예 반환값이 없음을 명확하게 할 필요가 있습니다.이때 사용하는 것이 any와 void 타입입니다.1️⃣ any 타입: 모든 타입을 허용하는 "탈출구"✅ any란?any는 어떤 타입이든 허용하는 가장 유연한 타입즉, 특정 값의 타입을 알 수 없거나 동적으로 변하는 경우 사용let value: any = 10; // 숫자 할당value = "Hello"; // 문자열 할당value = true; // 불리언 할당🚨 TypeScript의 엄격한 타입 체크를 피하려면 any를 사용하면 됨! 하지만 너무 자주 쓰면 TypeScript의 타입 안정성을 해치게 됨✅ any의 특징 모든 타입을 수용함 l..

• format_list_bulleted Study Notes/TypeScript
• · 2025. 2. 5.
• textsms

[TypeScript] 데이터 타입 enum이란? enum 자세히 이해하기

저에게 enum이라는 데이터 타입은 굉장히 낯선 개념이었습니다.C# 같은 언어처럼 집합에 더 나은 이름을 붙여줄 수 있다는데, 잘 모르겠더라구요.처음 접해봤기에, enum이 어디에 쓰이는지 무슨 이유로 사용하는지를 알고싶었습니다! 결론적으로, enum은 JavaScript에는 없는 기능이므로 객체(object)에 as const를 붙여 enum처럼 사용하는게 더 좋은 대안이 될 수도 있다는 것을 알았습니다. 물론 아직 ts도 enum도 한번도 써본적없기에 와닿지는 않았지만, gpt를 통해 enum을 공부하며 알게 된 내용을 정리했습니다!1️⃣ enum이란?일반적으로 코드에서 특정한 값들을 의미 있게 그룹화하고 싶을 때 사용예를 들어, 요일을 숫자로 표현하는 경우:const MONDAY = 0;const ..

• format_list_bulleted Study Notes/TypeScript
• · 2025. 2. 5.
• textsms

[JavaScript] 데이터 타입: number, undefined, null 등

자바스크립트의 모든 값은 데이터 값을 가지며, ES6은 7개의 데이터 타입을 제공합니다.구분데이터 타입설명원시 타입숫자 타입 number숫자, 정수와 실수 구분 없이 하나의 숫자 타입만 존재문자열 타입 string문자열불리언 타입 boolean논리적 참(true)과 거짓(false)undefined 타입var 키워드로 선언된 변수에 암묵적으로 할당되는 값null 타입값이 없다는 것을 의도적으로 명시할 때 사용하는 값symbol 타입ES6에서 추가된 7번째 타입객체 타입객체, 함수, 배열 등 자바스크립트의 데이터 타입은 크게 원시 타입과 객체 타입으로 분류됩니다.이에 대해서는 추후 자세히 정리해볼 예정이며,중요한 것은 자바스크립트는 객체 기반의 언어이며, 자바스크립트를 이루고 있는 거의 모든 것이 객체라는..

• format_list_bulleted Study Notes/JavaScript
• · 2025. 2. 4.
• textsms

[JavaScript] ES6 함수의 추가 기능: 함수의 구분, 화살표 함수, Rest 파라미터/ 화살표 함수 정복하기

1. 함수의 구분( ES6 이전 버전에서의 문제점 ) ES6 이전의 모든 함수는 callable이면서 constructor입니다. ES6 이전의 모든 함수는 일반 함수로서 호출할 수 있는 것은 물론 생성자 함수로서 호출할 수 있습니다. 아래 예제와 같이 ES6 이전의 함수는 동일한 함수라도 다양한 형태로 호출할 수 있습니다.var foo = function () { return 1;};// 일반적인 함수로서 호출foo(); // -> 1// 생성자 함수로서 호출new foo(); // -> foo {}// 메서드로서 호출var obj = { foo: foo };obj.foo(); // -> 1 주의할 것은 ES6 이전에 일반적으로 메서드라고 부르던 객체에 바인딩된 함수도 callable이며 constr..

• format_list_bulleted Study Notes/JavaScript
• · 2025. 2. 3.
• textsms

[JavaScript] 변수

지난번 포스팅에서 변수를 선언하는 var, let, const 키워드와 호이스팅을 다뤘습니다.이에 대한 배경지식을 더 잘 다져놓으면 좋을 것 같아 변수라는 좀 더 포괄적인 파트로 한번 더 정리해봅니다. 1. 변수 선언(1) 변수 선언이란?①값을 저장하기 위한 메모리 공간을 확보하고 ②변수 이름과 확보된 메모리 공간의 주소를 연결해서 ③값을 저장할 수 있게 준비하는 것입니다. 변수 선언에 의해 확보된 메모리 공간은 확보가 해제되기 전까지는 누구도 그 공간을 사용할 수 없도록 보호되므로 안전합니다. (2) 변수 선언 키워드변수를 사용하려면 반드시 선언이 필요합니다.변수를 선언할 때는 var, let, const 키워드를 사용합니다. ES6에서 let, const가 도입되기 이전까지 var 키워드가 유일했습니..

• format_list_bulleted Study Notes/JavaScript
• · 2025. 1. 24.
• textsms