Coding 🖐🏻 42

JS 문자열 정렬하기(1) | replace , split , sort , map

✅문자열 에서 알파벳을 제외한 숫자만 추출해서 오름차순으로 정렬한 배열 을 반환하는 함수 const solution = (my_string) => { return my_string .replace(/[a-z]/gi, "") .split("") .sort((a, b) => a - b) .map((el) => Number(el)); }; 📌my_string 문자열에 특정한 패턴을 찾아 새로운 문자열로 치환한다. replace 메소드 | 문자열에서 특정한 패턴을 찾아 새로운 문자열로 치환하는 메서드이다. my_string.replace(/[a-z]/gi,””) 문자열에서 대소문자 구분없이 알파벳을 제외한 모든 문자 제거하기 (/[a-z]/,’’) 알파벳 소문자- 대문자 모두 대상으로 하고 g와i 플래그를 사용..

기술면접 스터디 2개월차썰 회고록 | 리더방장, 운영

✅기간 :1월 5일 - 현재까지 첫 회사 면접을 보고 기술면접이 너무 부족해서 스스로 부끄러웠다. 어떻게 하면 부족해서 못 하는 사람이 아닌 부족한것을 노력해서 잘 하는 사람이 될 수 있는 방법을 스스로 찾았다. ✅리더 :기술 스터디 운영을 하는 것 내가 절실해서 그런가 내가 필요한 분야인 자바스크립트, 리액트 컴퓨터 이해 바탕과 지식을 같이 공부할 수 있는 팀원들이 필요했다. 구하려고 하니 막상 내가 원하는 시간 과 날짜가 맞질 않았다. 내가 운영하는 방장이 되어서 시작해보자 해서 바로 올렸는데 감사하게도 나를 포함한 6명이 참석해주었다. 이날은 4명 참석 스터디를 운영하면서 멘탈적으로 힘든일도 많았는데 의무적으로 스터디를 해야한다는 책임감 때문에 늘 참석하고 , 기술면접 학습에 귀 기울이며 집중했다...

Coding 🖐🏻 2023.03.16

JS | 렌더링 , SPA

렌더링? 👩🏻 Html css 자바스크립트 등 개발자가 작성한 문서를 브라우저에서 출력되는 과정을 말한다. SPA 란? 단일 페이지로 구성된 웹 어플리케이션을 말한다. SPA는 화면이동 시에 필요한 데이터를 서버사이드에서 HTML으로 전달받지 않고(서버사이드 렌더링 X), 필요한 데이터만 서버로부터 JSON으로 전달 받아 동적으로 렌더링한다 기존 어플리케이션과 SPA의 차이 기존 어플리케이션은 화면이동 시에 화면 이동에 필요한 HTML을 서버사이드에서 받아서 처음부터 다시 로딩하기 때문에 시간이 걸린다. 반면, SPA에서는 화면 구성에 필요한 모든 HTML을 클라이언트가 갖고 있고 서버사이드에는 필요한 데이터를 요청하고 JSON으로 받기 때문에 기존의 어플리케이션에 비해 화면을 구성하는 속도가 빠르다.

JS | arr.sort 정렬 메소드 사용하기 오름차순 내림차순 | 프로그래머스 중앙값 구하기

정렬 하기 위해서는 sort 메소드를 사용한다. → arr.sort () 배열을 재 정렬해 주는메소드 이다. 그럼 → arr.sort () 로 숫자로 오름차순 정렬하기 풀이 A,b 두 요소를 전달하고 a-b로 크기를 비교해서 양수인지, 음수인지 0인지 만 본다. A가> b 보다 크면 양수로 리턴 , 같으면 0 으로 , a가 a-b) : sort() 메소드를 사용하여 배열을 오름차순으로 정렬합니다. arr.sort((a,b) => b-a) : sort() 내림차순 예제로 보겠다 아래는 프로그래머스 중앙값 구하기 function solution(arr) { return arr.sort((a, b) => a - b)[Math.floor(arr.length / 2)]; } 풀이 이 함수는 배열 arr 을 인자로..

JS | 특정문자열 바꾸기 replaceAll

- replaceAll 정규식 표현 특정 문자를 모두 바꾸기 위한 자바스크립트 문자열 객체 replaceAll 매소드와 정규식 표현이다. const AB = "ice, ice ,cream, choco, chip'; AB.replaceAll("ice", "iceTea") 해석 const AB에는 특정한 ice이라는 문자열을 iceTea라고 변경해주었다. 그래서 AB는 "iceTea, iceTac, cream, choco, chip" 으로 값이 변환된다 프로그래머스 레벨 0 코딩테스트 | 특정 문자 제거하기 문자열 my_string과 문자 letter이 매개변수로 주어집니다. my_string에서 letter를 제거한 문자열을 return하도록 solution 함수를 완성해주세요. 제한사항 1 ≤ my_st..

React 에서 불변성을 지켜야 하는 이유?

자바스크립트에서 불변성은 : 메모리 값을 변경할수 없는 것 의미다. 얕은 복사 와 깊은 복사가 있다 얕은 복사는 객체 a.b 가 있으면 데이터의 주소를 똑같이 참조 하고 있음 a객체에 접근헸음에도 b객체의 값이 달라지는 것 (참조타입 객체 예시를 생각하면 쉽다) 생략... 깊은 복사는 아예 새로운 객체 안 속성 (property) 만 복사해서 사용하는 것 이다. spread 연산자를 사용하여 { ... x} 불변성을 유지시킨다. React에서 state 의 변화값을 비교하는 데에서는, 불변성을 지켜주어야 변경됨을 인지한다 React의 함수형 프로그래밍에서 사용되는 순수함수는, 동일한 값을 인풋하였을 때 동일한 값을 아웃풋하는 함수를 뜻하며, 외부의 값을 변경하는 것과 같은 사이드 이펙트를 막는 함수이다 ..

JS | 자바스크립트 불변성이란? 원시타입 vs 참조타입

불변성을 지켜야 한다 무슨 말일까.. 모르기 때문에 찾아보는 공부! 불변성이란 ? 사전 적으로 불변성이란 값이나 상태를 변경 할 수 없는 것 이다. 자바스크립트에서 객체가 생성된 이후 그 상태가 변경 할 수 없는 것을 의미한다. 여기에서 상태를 변경할 수 있는 것과 값을 재할당하는 것은 다르다는 것 을 알아야한다. let a = 10 ; let b = a ; a = 20; console.log(a,b); // 20 10 위의 코드는 a에 10을 할당하고 b -> a 가 가르키는 주소 를 가리킵니다. 이때 a의 값을 20으로 변경시켜준다. 만약 값을 직접 변경하는 것이면 a,b 둘다 20을 출력해야한다. 하지만 자바스크립트에서 number 값은 불변성을 유지 해서 새로운 a =20이라는 값을 가지는 주소를..

todo 투두앱 만들기 react app

https://todo-3db52--preview-name-28y1dpy1.web.app/ https://todo-3db52.web.app/ React App todo-3db52.web.app 리액트 면접기술을 학습하면서 코딩 연습사마 todo app 프로젝트를 구현하여 리액트를 학습하였습니다. 입력창에 입력 값을 생성, 저장 추가, 그리고 삭제 기능을 구현하였습니다. firebase 를 사용하여 배포를 하였습니다. issue 1. firebase 현재 17 버전이 매우 불안정해서 지우고 16버전으로 다시 다운받았습니다. 구글링을통해 몇 개 없는 정보를 통하여 빠르게 수정하였다. 2. npm install -g firebase Error 무한 에러가 뜨면서 설치가 되지 않아 당황스러웠지만 빠르게 구글링 ..

프론트엔드 면접 질문 1

웹팩 (Webpack)? 코드는 재사용성을 높이고 유지보수를 편리하게 하기위해 모듈화 된다. 웹팩 은 자바스크립틍 어플리케이션 을 위한 정적 모듈 번들러이다. 여러 의존 관계에 있는 모듈들을 하나의 js 파일로 번들링하는 역할을 수행한다. 웹 팩은 4가지로 구성된다. 1. 엔트리 : 모듈의 시작점을 의미한다. 2. 아웃풋 : 엔트리를 시작으로 모든 모듈을 하나로 묶어 범들링 을 한 결과물을 내보낼 위치를 선정한다. 3. 로더 : 로더는 비 자바스크립틑 파일을 웹펙이 이해하게끔 변경하는 역할을 함 4. 플러그인 : 번들된 결과물을 처리한다. ESlLint , Prettier ESLint 는 ecma Script 를 lint 는 에러가 있는 코드에 표시를 달아 놓은 것 을 의미한다. ESLint => 자바스..

Coding 🖐🏻 2023.01.20

m1 개발자 초기 세팅 순서

M1 setting 또 키체인 뜨면 이거 보고 해라~ 정리 함 초기세팅🤬 https://www.lainyzine.com/ko/article/how-to-install-homebrew-for-m1-apple-silicon/ Install m1 version HomeBrew echo 'eval $(/opt/homebrew/bin/brew shellenv)' >> ~/.zprofile eval $(/opt/homebrew/bin/brew shellenv) which brew brew --version brew install git brew install wget $ which git /opt/homebrew/bin/git $ which wget /opt/homebrew/bin/wget https://www.y..

Coding 🖐🏻 2022.12.15