일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | ||||||
2 | 3 | 4 | 5 | 6 | 7 | 8 |
9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 | 17 | 18 | 19 | 20 | 21 | 22 |
23 | 24 | 25 | 26 | 27 | 28 |
- 리액트
- 타입스크립트
- 내일배움캠프 프로젝트
- 코딩테스트
- 내일배움캠프
- useState
- 내배캠 프로젝트
- 파이썬 반복문
- 타입스크립트 리액트
- React Hooks
- 리액트 훅
- JavaScript
- 파이썬 for
- 자바스크립트
- 파이썬 for in
- 파이썬 replace
- useEffect
- 리액트 프로젝트
- 프로그래머스
- tanstack query
- 내일배움캠프 최종 프로젝트
- 파이썬 slice
- 타입스크립트 props
- 한글 공부 사이트
- 파이썬 딕셔너리
- Next 팀 프로젝트
- 파이썬 enumerate
- 리액트 공식문서
- typeScript
- REACT
- Today
- Total
목록전체 글 (303)
sohyeon kim
![](http://i1.daumcdn.net/thumb/C150x150.fwebp.q85/?fname=https://blog.kakaocdn.net/dn/cTf6o7/btsFqMhDlNf/1hNbrM7oXJ8qT6LKrk2yi0/img.png)
💡 타입스크립트에서 모듈을 사용해보자 ~ 요기서 src 폴더, Product.ts, Size.ts, main.ts 를 만들자! Product.ts interface Product { // interface 생성 id: string; name: string; price: number; membersOnly?: boolean; sizes?: string[]; } Size.ts enum Size { // enum 생성 S = 'S', M = 'M', L = 'L', XL = 'XL', } main.ts const product1 = { // 객체 만들고 id: 'c001', name: '주전자', price: 129000, membersOnly: true, sizes: ['S', 'M'], }; const p..
📝 문제 문자열 my_string이 매개변수로 주어질 때, my_string 안에 있는 숫자만 골라 오름차순 정렬한 리스트를 return 하도록 solution 함수를 작성해보세요. 🫠 나의 풀이 def solution(my_string): answer = [i for i in my_string if i.isdigit()] return sorted(answer) isdigit() : 값이 숫자인지 판별해 boolean 값 반환 🧞♂️ 다른 사람의 풀이 def solution(my_string): return sorted([int(c) for c in my_string if c.isdigit()]) 🔗 https://velog.io/@code_angler/%ED%8C%8C%EC%9D%B4%EC%8D%AC..
💡 합치는 거 말고 골라오거나, 생략해보자! Pickinterface Product { id: string; name: string; price: number; membersOnly?: boolean;}type ProductInfo = Pick;// ProductInfo 타입 값은 아래와 같다.type ProductInfo = { name: string; price: number;} name, price 프로퍼티만 골라서 타입을 만들었다. Omitinterface Product { id: string; name: string; price: number; membersOnly?: boolean;}type ProductInfo = Omit;// ProductInfo 타입 값은 아..
![](http://i1.daumcdn.net/thumb/C150x150.fwebp.q85/?fname=https://blog.kakaocdn.net/dn/3hlWn/btsFyfo9K9B/bpmG4NbJyDns8bkQGG9DkK/img.png)
💡제네릭 타입에 대해 알아보자. const shoeSizes: number[] = [230, 240, 250];shoeSizes.map((num) => {});const clothingSizes: string[] = ['M', 'L', 'XL'];clothingSizes.map((names) => {});파라미터의 타입을 알아서 인식하고 있다.어떻게 한 걸까?! map 메서드를 살펴보면 안에 값이 있는데, 여기에 유동적인 값이 들어간다. 이렇게 특정한 타입으로 고정시켜 두는 게 아니라 꺾쇠 안에 임의의 값을 지정해 두고그때그때 다른 타입을 넣어서 쓸 수 있게 하는 문법을 제네릭 이라 한다. generic : 데이터 타입을 변수화 한 것type Generic={ // 이름은 아무렇게나 정할 수 있으나..
![](http://i1.daumcdn.net/thumb/C150x150.fwebp.q85/?fname=https://blog.kakaocdn.net/dn/bkjRsP/btsFoJZD9ty/hgV8KTDAqykBQ5qCONbfd0/img.png)
💡 타입스크립트에서 자주 쓰는 두 연산자에 대해 알아보자 먼저 keyof ~ interface Product { id: string; name: string; price: number; membersOnly?: boolean; } // 프로퍼티 이름 타입 지정 type ProductProperty = 'id' | 'name' | 'price' | 'membersOnly'; // 사용자에게 보여줄 키들을 productTableKeys 변수에 배열로 담아준다. const productTableKeys: ProductProperty[] = ['name', 'price', 'membersOnly']; const product: Product = { id: 'c001', name: '주전자', price: 129..
💡 intersection 에 대해 알아보자. interface Product { id: string; // 세 타입 모두 공통 name: string; price: number; membersOnly?: boolean; } interface User { id: string; // 세 타입 모두 공통 userName: string; email: string; createdAt: Date; // 두 타입에서 공통 updateAt: Date; // 두 타입에서 공통 } interface Review { id: string; // 세 타입 모두 공통 productId: string; userId: string; content: string; createdAt: Date; // 두 타입에서 공통 updateAt..
![](http://i1.daumcdn.net/thumb/C150x150.fwebp.q85/?fname=https://blog.kakaocdn.net/dn/dLChYl/btsFxYnpSmL/vo98rxBac0YlVwMkpXl6D1/img.png)
💡 union 에 대해 알아보자. function printSizes(product: Product) { const availableSizes = product.sizes.join(', '); console.log(`구매 가능한 사이즈는 다음과 같습니다: ${availableSizes}`); } 파라미터로 받고 있는 Product 에 sizes 가 없어서 에러가 뜨고 있다. ClothingProduct, ShoeProduct 중 하나만 받고 싶다면! ⬇️ function printSizes(product: ClothingProduct | ShoeProduct) { const availableSizes = product.sizes.join(', '); console.log(`구매 가능한 사이즈는 다음과 같..
![](http://i1.daumcdn.net/thumb/C150x150.fwebp.q85/?fname=https://blog.kakaocdn.net/dn/yqDPm/btsFs3iFpTm/TQhM5xKZHNGQ9vLz3jzesK/img.png)
💡 타입에 이름을 붙여보자! const cart: string[] = ['c001', 'c002', 'c003']; // cart 에 타입을 정의 interface User { username: string; email: string; cart: string[]; // User 객체에 cart 를 넣어주려고 타입을 또 정의함 } const user: User = { username: 'aoto', email: 'aotoyae@gmail.com', cart, }; 위와 같이 똑같이 cart 타입을 두 번 적어주면 (타입이 바꼈을 때) 수정하기 어려운, 유지 보수가 힘든 코드가 된다. 이럴 때 별칭으로 타입에 이름을 붙여준다. type Cart = string[]; // ** 여기 const cart: Ca..
![](http://i1.daumcdn.net/thumb/C150x150.fwebp.q85/?fname=https://blog.kakaocdn.net/dn/oFckV/btsFzfITj31/tfONxMjz9rdsIDoMe78ddK/img.png)
💡 리터럴 타입에 대해 알아보자. 리터럴 : 글자 그대로 타입스크립트에선 let, const 에 따라 같은 문자열이더라도 타입이 다르게 지정된다. const 는 바뀌지 않는 값이기 때문에 값이 그대로 타입으로 지정된다. ➡️ 이런걸 리터럴타입이라 한다! 마찬가지로 숫자도 리터럴 타입으로 지정될 수 있다. 숫자 리터럴 타입은 숫자형 타입에, 문자 리터럴 타입은 문자형 타입에 포합된다. let small = 95; const large = 100; function printSize(size: number){ // large 도 number 타입이니 console.log(`${size} 사이즈입니다.`); } printSize(small) // 95 사이즈입니다. printSize(large) // 100 사..
![](http://i1.daumcdn.net/thumb/C150x150.fwebp.q85/?fname=https://blog.kakaocdn.net/dn/yrWIE/btsFoeMjLy0/pu04GxSUgq83AOYHpDIJb0/img.png)
2024.03.04 - [TypeScript] - [TS] enum 열거형 타입 [TS] enum 열거형 타입 💡enum 타입에 대해 알아보자. 상품 사이즈처럼 값의 종류를 나열할 수 있는 경우에 쓸 수 있는 타입 let product: { id: string; name: string; price: number; membersOnly?: boolean; sizes: string[]; } = { id: 'c001', name: ' aotoyae.tistory.com 💡 interface 에 대해 알아보자. 같은 객체 타입을 계속 만들어 낼때, 기준이 되는 타입을 만들어 사용할 수 있다! const product1: { id: string; name: string; price: number; membersO..