til(69)
-
JavaScript forEach와 map의 차이
forEach() 반환값이 없다(undefined) 콜백 함수를 인자로 받아, 배열의 각 요소에 콜백함수를 실행한다 콜백은 호출하는 배열을 변경할 수 있다 const arr = ['a', 'b', 'c']; const newArr = arr.forEach(function(e){ return e; }); console.log(newArr); // undefined map() 새로운 배열을 반환한다 콜백 함수를 인자로 받아, 배열의 각 요소에 대해서 실행한 결과 값을 반환한다 forEach() 보다 빠르다 반환되는 새로운 배열로 filter, reduce와 같은 다른 메소드들과 함께 사용할 수 있다 const arr = [1,2,3,4,5]; const newArr = arr.map(function(e){ ..
2022.02.01 -
Hash Tables
Hash Tables Key-Value System : 특정한 값(Value)을 찾고자 할 때 그 값의 키(Key)로 접근할 수 있다. 데이터를 최대한 빠른 속도로 관리하도록 도와주는 자료구조 해시를 사용하면 메모리 공간이 많이 소모되지만 매우 빠른 속도로 데이터를 처리할 수 있다. Hash Tables vs Arrays 예를 들어 특정 메뉴의 가격을 검색한다고 했을 때, Array의 경우 menu = [ { name: 'coffee', price: 10 }, { name: 'burger', price: 15 }, { name: 'tea', price: 5 }, { name: 'pizza', price: 10 }, ]; // loop를 돌면서 name == 'pizza'를 찾는다. for() 선형검색(L..
2022.01.06 -
CORS란 무엇인가 (CORS, SOP, Preflight)
CORS 정책 위반...읽기 두려운 에러 메세지... 최근 인턴쉽에서 아비웹 고도화 프로젝트를 진행하면서 CORS 정책 위반으로 에러가 발생했었다. 강렬한 붉은색의 에러 메세지... 천천히 읽어보면 나름 친철하게 해결방법을 알려주고 있는데, 처음 봤을 때는 강렬한 붉은색의 에러 메세지에 당황했던 기억이 있다. 살펴 볼 키워드 CORS를 이해하기 위해서는 CORS라는 단어 뿐 아니라 연관된 용어들을 이해하고 알아야한다. 다음 순서대로 글을 작성하였다. CORS (Cross-Origin Resource Sharing) Origin (출처) SOP (Same-Origin Policy) Preflight CORS (Cross-Origin Resource Sharing) '다른 출처'에 리소스를 요청할 때, 해당..
2022.01.04 -
재귀 개념 (Factorial, Fibonacci Number)
재귀란? 컴퓨터 과학에서 재귀의 사전적 정의는 다음과 같다. 재귀(Recursion) : 자신을 정의할 때 자기 자신을 재참조하는 방법을 뜻한다. 이를 프로그래밍에 적용하여 재귀 호출(Recursive call)의 형태로 많이 사용한다. 재귀 호출(Recursive call) 개념 재귀적인 루틴에서는 자기 자신을 호출하여 하위 작업을 처리하는 방식으로 작업의 일부분을 수행한다. 재귀 호출을 하다보면 자신을 호출하지 않고도 처리할 수 있는 하위 작업이 나오는데 이를 기본 케이스(base case)라 부르고, 루틴에서 자신을 호출하여 하위 작업을 수행하는 케이스는 재귀 케이스(recursive case) 라고 부른다. 모든 재귀적인 케이스는 결국에는 기본 케이스(종료조건)으로 넘어가야만 한다. 특징 재귀 호..
2021.12.31 -
Critical rendering path (google.com 입력했을 때 일어나는 일)
💡️ Client-side programming 대부분의 프로그래밍 언어는 OS나 VM 위에서 실행되지만, 웹 애플리케이션의 클라이언트 사이드 자바스크립트는 브라우저에서 HTML, CSS와 함께 실행된다. 따라서 브라우저 환경을 고려할 때 더 효율적인 클라이언트 사이드 자바스크립트 프로그래밍이 가능해진다. 이를 위해 브라우저가 HTML, CSS, 자바스크립트로 작성된 텍스트 문서를 어떻게 파싱하여 브라우저에 렌더링하는지 공부해야 할 필요가 있다. 🕵️ 브라우저 주소창에 google.com 을 입력한 뒤 엔터 키를 누르면 일어나는 일 1. request/response google.com라는 도메인 이름을 DNS 서버로 요청하고, DNS 서버에서 IP 주소를 브라우저로 전달한다. 전달받은 IP 주소로 go..
2021.12.19 -
🍪 쿠키에 token 담아보내기(CORS와 Cookie옵션 설정)
새로고침 했을 때, Cookie가 없어지는 오류 CORS 설정, Cookie 옵션까지 잘 작성한 뒤 배포 서버에서 테스트를 했을 때 역시나 문제가 발생했다. 페이지를 새로고침(reload)했을 때 Cookie에 저장한 token이 날라가는것.. 아니 왜. 저장 잘했었는데. 😂️😂️😂️ 계속해서 찾아보고 구글링하다가 결국 다시 cookie 탭에서 옵션들을 확인했는데, Domain이 백엔드 서버 도메인으로 되어 있을 것을 확인했다. 프론트 서버 도메인이 아니라!!! cookie option에 domain으로 프론트서버 주소를 지정해주니 새로고침해도 쿠키가 남아있었다. 🎉️ CORS정책은 공부해야 할 내용이기 때문에 이번에 공부하고 찾아봤던 내용들을 정리해봤다. 🔐️ CORS 설정 const corsOptio..
2021.12.14