본문 바로가기

Programming & Platform136

JavaScript 유사 배열 객체 쉽게 배우기, 예제 소스 코드 제공 JavaScript 유사 배열 객체 쉽게 배우기, 예제 소스 코드 제공 자바스크립트에서 배열과 유사한 객체를 다뤄야 할 때가 있습니다. 이러한 객체를 유사 배열 객체라고 합니다. 이 글에서는 유사 배열 객체의 정의, 특징, 그리고 어떻게 다루어야 하는지에 대해 알아보겠습니다. 유사 배열 객체란 무엇인가? 유사 배열 객체는 배열처럼 보이고 동작하는 객체입니다. 하지만 배열이 아닌 객체입니다. 유사 배열 객체는 다음과 같은 특징을 가집니다. 숫자 인덱스를 갖는다. length 프로퍼티를 갖는다. 배열 메소드 중 일부를 사용할 수 있다. 유사 배열 객체의 예시 가장 일반적인 유사 배열 객체는 DOM 요소 리스트입니다. JavaScript 명시적 this 바인딩, apply 메소드 쉽게 배우기 - 예시 코드 제.. 2023. 12. 24.
TypeScript 학습 체크리스트 - boolean, number, String, tuple, enum, 배열의 사용법 TypeScript 학습 체크리스트 - boolean, number, String, tuple, enum, 배열의 사용법 TypeScript 강의 수강 후 배운 내용을 정리하고 궁금한 부분 추가하면서 작성해봤습니다. TypeScript 개념 체크리스트 ✅ ✅ boolean, number, String, tuple, enum, 배열의 사용법을 이해합니다. boolean, number, string, tuple, enum, 배열 사용법 boolean boolean 타입은 참(true), 거짓(false) 값을 나타냅니다. 두 값만 가질 수 있으며, 조건문, 비교 연산 등에서 주로 사용됩니다. function isValidPassword(password: string): boolean { return pass.. 2023. 12. 23.
TypeScript 학습 체크리스트 - tsconfig.json 용도, 사용법, 주요 옵션 TypeScript 학습 체크리스트 - tsconfig.json 용도, 사용법, 주요 옵션 TypeScript 강의 수강 후 숙지 및 개념 정리를 위해 체크리스트와 함께 배운 내용을 아래 작성했습니다. TypeScript 개념 체크리스트 ✅ ✅ tsconfig.json의 필수 옵션들을 숙지합니다. tsconfig.json 이란? tsconfig.json은 tsc --init 명령어로 만들어지는 파일입니다. TypeScript 프로젝트의 설정 파일로, 주로 프로젝트의 컴파일 옵션 및 입력 파일들을 정의하는 데 사용합니다. tsconfig.json 주요 옵션 compilerOptions - target 옵션 해당 TypeScript 프로젝트 내 코드들이 어떤 JavaScript 버전으로 변환할지 정하는 옵션.. 2023. 12. 22.
TypeScript 학습 체크리스트 - 컴파일러 개념 및 tsc 용도, 주요 명령어 TypeScript 학습 체크리스트 - 컴파일러 개념 및 tsc 용도, 주요 명령어 TypeScript 강의 수강 후 숙지 및 개념 정리하기 위해 체크리스트와 함께 배웠던 개념들을 정리합니다. TypeScript 개념 체크리스트 ✅ ✅ 컴파일러의 개념에 대해서 공부하고 tsc를 어떻게 사용하는지 파악합니다. 컴파일러 개념 및 tsc 용도 컴파일러란 특정 프로그램 언어가 정적언어로서의 정체성을 유지할 수 있도록 하는 도구를 말합니다. 프로그래밍 언어 작성 코드 → 다른 프로그래밍 언어로 변환 이러한 변환 과정 속에서 컴파일러는 소스 코드의 구문과 구조를 검사하면서 문제가 없는지 확인합니다. 이를 통해 개발자는 작성한 코드의 오류를 찾아낼 수 있으며 문제를 해결할 수 있습니다. 컴파일러 특징 컴파일러 중 T.. 2023. 12. 21.
TypeScript 객체지향 설계 원칙 SOLID 설명, 예시 코드 TypeScript 객체지향 설계 원칙 SOLID TypeScript 객체지향 설계시 SOLID 원칙을 지켜 작성해야합니다. 이렇게 함으로써 프로그램이 유연해지고, 확장 가능하며, 이해하기 쉬운 구조를 가지게 됩니다. 아래 글에 소개하는 SOLID 원칙을 보며 효율적인 객체지향 설계에 많은 인사이트가 되시길 바랍니다. SOLID 제1원칙 S (SRP. 단일 책임 원칙) 클래스는 하나의 책임만을 가져야 한다는 매우 기본적인 원칙입니다. SOLID의 5가지 설계 원칙 중 가장 기본적이고 중요한 원칙입니다. 쉽게 말해 클래스 하나에는 하나의 기능만을 수행해야 합니다. 잘못된 예시 UserService 클래스 안에 갑자기 뜬금없이 이메일 전송하는 로직이 들어있습니다. 이는 UserService와는 관련없는 기능.. 2023. 12. 20.
JavaScript 명시적 this 바인딩, apply 메소드 쉽게 배우기 - 예시 코드 제공 JavaScript 명시적 this 바인딩, apply 메소드 쉽게 배우기 - 예시 코드 제공 자바스크립트에서 this 키워드의 동작은 함수가 어떻게 호출되느냐에 따라 다르게 작동합니다. 명시적으로 this를 바인딩하려면 apply 메소드를 사용할 수 있습니다. 이 글에서는 apply 메소드와 그 차이점을 살펴보고, 예시 코드를 통해 이해하겠습니다. apply 메소드란 무엇인가? apply는 모든 함수 객체에서 사용 가능한 메소드로, 함수를 호출하면서 this를 특정 객체로 명시적으로 바인딩하는 데 사용됩니다. call과 유사하지만 매개변수를 배열 형태로 받는 점이 다릅니다. apply 메소드의 사용법 apply 메소드를 사용하면 함수를 호출하면서 this를 특정 객체로 바인딩하고, 함수의 매개변수를 배.. 2023. 12. 19.
JavaScript 명시적 this 바인딩, call 메소드 쉽게 배우기 - 예시 코드 제공 JavaScript 명시적 this 바인딩, call 메소드 쉽게 배우기 - 예시 코드 제공 자바스크립트에서 this 키워드는 함수가 어떻게 호출되는지에 따라 다르게 동작합니다. 이러한 동작을 이해하고 this를 명시적으로 바인딩하려면 call 메소드를 사용할 수 있습니다. 이 글에서는 call 메소드의 개념, 사용법 및 예시 코드를 통해 자세히 살펴보겠습니다. call 메소드란 무엇인가? call은 모든 함수 객체에서 사용할 수 있는 메소드로, 함수를 호출하는 동안 this를 특정 객체로 명시적으로 바인딩하는 데 사용됩니다. call 메소드 사용법 call 메소드를 사용하면 함수를 호출하면서 명시적으로 this를 지정할 수 있습니다. 아래는 기본적인 사용법입니다. function greet(name) .. 2023. 12. 17.
JavaScript 콜백 지옥 해결법 - Promise, async/await 사용법 소개 JavaScript 콜백 지옥 해결법 - Promise, async/await 사용법 소개 자바스크립트에서 비동기 프로그래밍을 다룰 때 가장 흔히 마주치는 문제 중 하나는 콜백 지옥입니다. 이 문제를 해결하기 위해 등장한 Promise와 async/await은 코드를 더 읽기 쉽게 만들고 비동기 코드를 관리하기 쉽게 합니다. 이 글에서는 Promise와 async/await의 개념, 사용법, 그리고 실제 코드에서의 활용을 예시와 함께 살펴보겠습니다. Promise란 무엇인가? Promise(약속) 는 자바스크립트에서 비동기 코드를 다루는 객체입니다. 이것은 비동기 작업이 완료되면 또 다른 동작을 수행하도록 예약된 객체로 생각할 수 있습니다. Promise의 사용법 Promise를 사용하면 다음과 같이 코.. 2023. 12. 16.
부트스트랩 달력 특정일자 비활성화 하는 방법 bootstrap datepicker 부트스트랩 달력 특정일자 비활성화 하는 방법 bootstrap datepicker 부트스트랩에서 달력을 사용하다가 특정일자 비활성화를 해야하는 일이 생겼습니다. 다른 서비스에서는 여러 보긴 했지만 부트스트랩에서도 사용할 수 있는지 궁금했는데 찾아보니 비활성화 할 수 있는 방법이 있었습니다. 이번 글에서는 부트스트랩 달력에 특정일자를 비활성화 하는 방법에 대해 소개하겠습니다. 부트스트랩 달력 특정일자 비활성화 하는 방법 부트스트랩 달력을 커스텀하기 위해서는 datepicker를 활용해야 합니다. 활용하기 위해서는 bootstrap-datepicker 파일을 프로젝트 내에 추가한 후 사용해야 합니다. GitHub - uxsolutions/bootstrap-datepicker: A datepicker for .. 2023. 12. 15.

티스토리툴바