본문 바로가기

전체 글59

[JS] 객체 접근방식 & ES6 객체 리터럴 신문법 [ 객체 접근방식 ] 1. 초기화 표현식 - 객체 초기화 표현식 let obj = { x:1, y:1 } - 배열 초기화 표현식: let arr = [1,2,3] 2. 객체 접근 방식 : 객체에 접근하는 방식은 2가지가 있음. 1) obj.x 2) obj[x] 두 가지의 차이점은? : 프로퍼티 이름에 스페이스, 구두점이 있거나, 고정값이 아닐 때 반드시 대괄호로 접근해야 함. 2-1. 조건부 프로퍼티 접근 : JS에서 프로퍼티 값으로 가질 수 없는 2가지 값 => null, undefined 해당 값으로 프로퍼티 값이 평가될 때 타입 에러 발생. 타입에러 발생하지 않게 접근하는 방식이 조건부 프로퍼티 방식 1) obj?.x 2) obj?.[x] ?를 옵션 체인이라고 한다. 어떤 원리로 동작하는 건지? l.. 2022. 9. 15.
[9월 3번째 주/22.09.13~09.18] ⭕ 1. 진행 중인 소스코드 분석 진척도 60% -> 70% 전체 코드는 다 봄/ 다음 주 부터 스타일코드, 구조연습 & api 연동 코드 다시 (PC / Mobile +CSS + 구조) 4. 프로그래머스 문제 Lv.1 : 3문제 풀기 5. 블로그 정리 글 ( 프로그래머스 3 + 오렐리 객체 정리 1 ) 8. 커밋(수/목/금/토) -------------- ✖ 2. 반응형 page 만들기 연습 1개 -> 다음 주에 이어서 3. O'REILLY JS 책 4장까지 읽기 (🧈 객체 부분 자세하게 읽기!) => 4장 다 못읽음 ㅠㅠ, 다음 주에 포함 시켜서 읽기 6. 네트워크 교실 책 2일분 읽기 7. 엘리 grid 동영상 보기 + grid 연습 1개 9. 블로그 글 북마크 해둔 거 이해하고 정리. (관련 책 .. 2022. 9. 13.
[프로그래머스][JS] Lv.1 제일 작은 수 제거하기 문제 설명 정수를 저장한 배열, arr에서 가장 작은 수를 제거한 배열을 리턴하는 함수, solution을 완성해주세요. 단, 리턴하려는 배열이 빈 배열인 경우엔 배열에 -1을 채워 리턴하세요. 예를 들어 arr이 [4,3,2,1]인 경우는 [4,3,2]를 리턴하고, [10] 면 [-1]을 리턴합니다. 제한 조건 arr은 길이 1 이상인 배열입니다. 인덱스 i, j에 대해 i ≠ j이면 arr[i] ≠ arr[j] 입니다.(같은 수 없음) 입출력 예 [4,3,2,1] [4,3,2] [10] [-1] A. 내가 생각한 풀이 과정 1. 최솟값 찾기 2. 배열에서 최솟값보다 큰 값들만 거르기 3. 배열 길이 1일 때 [-1] 리턴하는 분기 코드 작성 해결 과정 1. 최솟값 찾는 코드 작성 const testA.. 2022. 9. 13.
[프로그래머스][JS] Lv.1 핸드폰 번호 가리기 문제 설명 프로그래머스 모바일은 개인정보 보호를 위해 고지서를 보낼 때 고객들의 전화번호의 일부를 가립니다. 전화번호가 문자열 phone_number로 주어졌을 때, 전화번호의 뒷 4자리를 제외한 나머지 숫자를 전부 *으로 가린 문자열을 리턴하는 함수, solution을 완성해주세요. 제한 조건 phone_number는 길이 4 이상, 20이하인 문자열입니다. 입출력 예 "01033334444" "*******4444" "027778888" "*****8888" A. 내가 생각한 풀이 과정 1. 입력 문자열 1번째 ~ 끝에서 4번째 자리 전까지 자르기 2. 입력 문자열과 1번에서 자른 문자열 매핑시켜서 해당 문자열을 ' * ' 로 교체 이대로 진행 했을 때 문제점? 문자열 길이만큼 '*'로 교체되지 않음.. 2022. 9. 4.
[JS] Fetch API(1) 🐳 요즘 리액트 쿼리 공식문서를 조금씩 읽어보고 있는데 fetch 라는 단어가 나올 때마다 약간 모호하게 이해되어서 mdn사이트에서 의미를 찾아보게 되었다. 이해한 내용을 바탕으로 정리해두려고 글을 남긴다. ---- 최신 웹에서 전체 페이지 로드 없이 웹 페이지 섹션을 업뎃하는 것이 일반적이다. 이걸 가능케하는 건 fetch api 때문임. 웹에서 페이지를 로드하는데(브라우저가 페이지를 화면에 나타내는데) 는 필요한 파일에 대해 서버에 하나 이상의 http 요청을 하고 서버가 요청된 파일로 응답하게 된다. 사용자가 다른 페이지를 방문하면 브라우저는 새 파일을 요청하고 서버는 이에 대해 응답한다. 위 그림의 의미는 => 데이터 요청을 하면, 모든 데이터를 응답한다는 뜻인거 같음 이건 많은 사이트에서 완벽하.. 2022. 6. 16.
[React] React Folder Structures 🏹 리액트를 사용해서 코드를 작성할 때 폴더구조를 어떻게 잡는 게 좋을지 궁금해서 찾아보게 되었다. 기존에 나눠봤던 폴더구조는 기껏해야 api, components, style을 나누어 보았는데 좀 더 나은 폴더구조를 배워보고 싶었다. 그리고 회사에서 오픈소스를 분석할 일이 있어서 하고 있는데 큰 프로젝트다 보니 폴더가 구조화되어있어서 그냥 무턱대고 읽기보단 구조를 알고 보면 더 잘 읽힐 거 같아서 블로그에 유튜브 강의 내용, 정돈된 글을 찾아서 정리해두려고 한다. 📂Assets Folder - images, sounds, styling files.. : asset 폴더에는 이미지, 사운드파일, 공통되게 쓰이는 스타일 파일이 들어간다. 스타일 파일은 관련 컴포넌트나 페이지에 넣어줄 수도 있다. 이건 개발.. 2022. 6. 9.

티스토리툴바