Under the Sign of Saturn

문제 문자열 s의 길이가 4 혹은 6이고, 숫자로만 구성돼있는지 확인해주는 함수, solution을 완성하세요. 예를 들어 s가 a234이면 False를 리턴하고 1234라면 True를 리턴하면 됩니다. (s는 길이 1 이상, 길이 8 이하인 문자열입니다.) 코드 풀이 uiyoji-journal.tistory.com/49 [Programmers] JavaScript에서 문자열 다루기 기본 (숫자로만 이루어진 문자열 체크하기) 문제 문자열 s의 길이가 4 혹은 6이고, 숫자로만 구성돼있는지 확인해주는 함수, solution을 완성하세요. 예를 들어 s가 a234이면 False를 리턴하고 1234라면 True를 리턴하면 됩니다. (s는 길이 1 이상, 길 uiyoji-journal.tistory.com 자바..

문제 문자열 s의 길이가 4 혹은 6이고, 숫자로만 구성돼있는지 확인해주는 함수, solution을 완성하세요. 예를 들어 s가 a234이면 False를 리턴하고 1234라면 True를 리턴하면 됩니다. (s는 길이 1 이상, 길이 8 이하인 문자열입니다.) 코드 풀이 우선 주어진 문자열 str의 길이를 확인하는 조건을 만들고, 검사한다. 길이가 4 혹은 6일 때 문자열 str을 split() 메서드를 통해 개별 문자 하나를 원소로 하는 배열을 생성한다. 배열 메서드 중 하나인 every() 메소드는 첫 번째 인자인 조건부 함수의 테스트를 원소가 모두 통과할 시에 true를 반환하는 메소드이다. 또한, 원소 하나가 조건에 충족되지 못했을 때는 바로 함수 실행을 멈추므로, 불필요하게 순회하지 않는 장점이 ..

블로그에 글을 발행하기 전 포스트의 초안을 작성하거나, 강의를 듣는 과정에서 노트 필기를 하거나 할 때는 노션을 자주 사용한다. 쓴 노트가 많아질수록 엄청 무거워지지만 무겁고 느린 반응 속도를 감안하고서라도 노션이 제공하는 장점을 아직 버리진 못하겠다. 특히 다양한 확장자를 지원하는 코드 블럭의 경우, 코드를 작성할 일이 많은 나에게는 가장 큰 장점인데, 티스토리 블로그는 제공하는 확장자가 적어 아쉬움이 많았다. 게다가 예쁘지도 않고, 수정도 어렵다. 많은 블로그에서 이미 Github Gist를 사용해 code snippet을 올리길래 한 번 시도해봤는데, 수십 분 안에 익숙하게 쓸 수 있을 만큼 간단했다. Github 계정이 있다면 별다른 가입 절차 없이 바로 사용 가능하다. gist.github.co..

문제 주어진 문자열 입력값을 숫자로 변환 해 반환한다. 조건 1. 문자열의 길이는 1 이상 5 이하 2. 문자열의 가장 앞에는 부호(+ 또는 -)가 올 수 있다. 3. 문자열은 부호와 숫자로만 이루어져 있다. 4. 문자열은 "0"으로 시작하지 않는다. 코드 풀이 Java의 경우라면, 문자열.contains를 써서 특정 패턴이 문자열 내 있는지 검사하고 boolean 값을 반환하는 함수를 쓸 수 있지만, JavaScript에는 해당 함수가 없다. 대신, indexOf 메서드를 통해 특정 패턴을 검사하고, 해당 패턴이 존재하지 않을 경우 -1를 받는다. indexOf는 첫 번째 인자로 검사하고자 하는 패턴을 입력하고, 두 번째 인자(optional)로는 어느 범위부터 검사할지, 즉 starting point..

{{ todo.title }} todo-list 컨테이너 역할을 하는 태그가 있고, 아래에 todo-list item들이 v-for 를 도는 형태이다. 하나의 todo 아이템은 todo 타이틀 역할을 하는 태그와 버튼부 역할을 하는 태그 둘로 또 나뉘는데, 이때 상위 컴포넌트인 for 문의 에 checkDone()이라는 함수가 걸려 있다. 해당 함수는 클릭 시 상태값을 토글해주어 하위 태그의 클래스를 붙이고 떼어주는 역할을 도와주게 된다. 하지만 버튼 부는 다른 이벤트를 독립적으로 수행해야 하므로, 상위 컴포넌트의 event를 prevent 해주어야 한다. 이때에는 상위 컴포넌트의 이벤트를 fire하지 말아야 할, 독립적으로 실행되어야 하는 함수에 .stop modifier를 붙여 간단하게 손볼 수 있다..

마크다운 하위 폴더 내부 문서 경로 추가 TIL 라는 이름의 repository에 종종 공부하는 분야별로 폴더를 파서 내용을 업데이트하다가 오늘 하위 폴더에 개별 markdown 문서를 추가할 일이 있었다. 프로젝트 root에 위치한 README.md에 해당 폴더 내부의 md 문서를 링크 걸어주어야 해서 아래처럼 작성해줬다. ## 📖 Self-study Chapters // H1 ### db-modeling // H2 ### python-weeks // H3 ### ts-first-project // H3 - [TypeScript 101](ts-first-project/doc/TypeScript_101.md) (updated 2021-01-11) // [참조 링크의 이름](하위 폴더명 / [하위 폴더명 ..

맨 처음 자바스크립트를 배울 때 개념만 한 번 훑고 지나갔던 TypeScript를 다시 해보고 싶어서 오늘 기초 강의들을 쭉 살펴봤다. Java를 하고 온 다음에 TypeScript를 접하니 아무래도 이해하기가 더 쉬웠다. 예제 중 객체지향 프로그래밍과 클래스를 소개하는 챕터에서 난데없이 ts2564 에러, "Property 'fullName' has no initializer and is not definitely assigned in the constructor"를 만났다. 현재 tsc -v 명령어로 살펴본 현재 Version은 4.1.3이고, 이곳을 참고해보니, 2.7.2에부터 도입된 strict class checking으로 인한 오류라고 나와 있었다. 두 가지 방법으로 해결 가능한데, class..

반응형 레이아웃을 제작할 때, grid-template-columns의 repeat() 함수의 두 속성값 auto-fill과 auto-fit의 차이점. repeat() 함수 만일, 칼럼 12개를 반복한다고 하면, 우리는 명시적으로 repeat() 함수안에 그 값을 적어줄 수 있다. .grid { display: grid; /* define the number of grid columns */ grid-template-columns: repeat(12, 1fr); column-gap: 12px; row-gap: 8px; } 이 가로 단 안에서 칼럼 12개가 미리 지정해준 row-gap, column-gap 값을 유지하며 정렬되어 있다. 브라우저에게 각 row에 컬럼 12개를 정렬하라고 했으므로, 화면 크기..

각 단위를 잘 모르고 px만 주구장창 쓰다가, 생각난 김에 정리할 필요가 있어서, 이런 저런 강의들 모아 보고, 기록으로 남겨봤다. 요약하자면, px은 고정된 값, 비율을 반영하지 못하니 주의가 필요하다. em은 텍스트와 관련이 높은데, 어떤 디자인이 텍스트를 기준으로 삼을 경우 '그 비율을 계산해야 할 필요성이 있을 때 유용'한 단위. rem은 em의 한계를 극복하기 위해 나온 단위로, root인 의 기본 font-size만을 기준으로 계산할 수 있게 도와준다. em(엠)의 어원 - 과거 금속 활자를 찍던 시절, 폰트들의 기준점이 될 하나의 폰트 규격은 알파벳 대문자 M이 맡았다. M이 가장 폭이 넓고, 네모 형태를 띄었으므로, M을 담을 컨테이너는 마찬가지로 다른 알파벳들을 모두 담을 수 있었다. 이..

인터랙티브 웹 기술 관련 비주얼 아티클 강의를 듣고 알게 된 CSS 속성 중 하나인 will-change. 적재적소에 제한적으로 사용했을 때 성능을 올려줄 수 있는 속성이다. 앞으로 일어날 속성 변화를 미리 브라우저에 알려 브라우저가 최적화할 수 있도록 준비시키는 속성이므로, 성능 비용이 클 경우 제한적으로 썼을 때 효과가 크다고 한다. 이미 브라우저는 성능 최적화를 위해 가능한 한 모든 것을 시도 중이므로, 과하게 쓸 경우 오히려 반대 효과가 날 수 있으니 너무 많이 will-change를 쓰지 말 것. 마지막 수단으로 쓰라고 조언이 나와 있다. 21년 1월 확인했을 때, IE 지원이 안 된다고 나와 있다. 참고 developer.mozilla.org/ko/docs/Web/CSS/will-change ..