all category

javascript

요약 정리는 못 참지 않을까요? (17) Rest API와 프로미스

🙄REST가 뭐에요 REST(REpresentational State Transfer)는 HTTP의 장점을 최대한 활용할 수 있는 아키텍처라고 합니다. REST의 기본 원칙을 성실히 지킨 서비스 디자인을 RESTful하다라고 표현한다고 하네요 REST는 HTTP를 기반으로 클라이언트가 서버의 리소스에 접근하는 방식을 규정한 아키텍처이며 REST API는 REST를 기반으로 서비스 API를 구현한 것을 의미합니다. REST의 3요소 구성요소 내용 표현방법 자원 자원 URI(엔드포인트) 행위 자원에 대한 행위 HTTP 요청 메서드 표현 자원에 대한 행위의 구체적 내용 페이로드 이렇듯 REST는 자체 표현 구조로 구성되어 있어서 REST API만으로도 HTTP 요청 내용을 이해할 수 있습니다. REST API..

javascript

요약 정리는 못 참지 않을까요? (16) ajax와 json

🙄Ajax가 뭐에요? Ajax(Asynchronous Javascript and XML)은 비동기 프로그래밍 방식 중 하나입니다. 자바스크립트를 이용해 브라우저가 서버에게 비동기 방식으로 데이터를 요청하고 서버가 응답한 데이터를 수신하여 웹페이지를 동적으로 갱신하는 형태로 이루어집니다. 이런 Ajax는 브라우저에서 제공하는 WEB API인 XMLHttpRequest 객체를 기반으로 동작합니다. XML객체는 HTTP 비동기 통신을 위한 다양한 프로퍼티와 메서드를 제공해요 이전의 웹페이지는 화면이 바뀌면 변경할 필요가 없는 부분까지 전부 포함된 HTML을 전송받고 새로 페이지를 그려나가기 때문에 비효율적이었습니다. 또한 동기 방식으로 동작했기 때문에 서버의 응답이 오기 전까지 블로킹이 발생하는 문제가 있었습..

javascript

요약 정리는 못 참지 않을까요? (15) 비동기 프로그래밍

🙄 자바스크립트는 싱글스레드? 자바스크립트 엔진은 단 하나의 실행 컨텍스트 스택을 가집니다. 즉 동시에 두개 이상의 함수를 동시에 실행할 수 없습니다. 따라서 실행중인 실행 컨텍스트를 제외하면 모든 실행 컨텍스트는 모두 실행 대기 중인 태스크라는 뜻입니다. 자바스크립트 엔진은 싱글 스레드 방식으로 동작하는데 그래서 처리에 시간이 걸리는 태스크를 실행하는 경우 블로킹이 발생합니다. 🙄동기처리? 비동기처리? 동기 처리는 실행 중인 태스크가 종료할 때 까지 대기하는 방식을 뜻합니다. 반면 비동기처리는 현재 실행 중인 태스크가 종료되지 않은 상태여도 다음 태스크를 곧바로 실행하는 방식을 말합니다. 동기처리는 실행 순서가 보장된다는 장점이 있지만 모든 태스크가 블로킹된다는 문제가 있고 비동기처리는 블로킹이 발생하..

programmers

[Programmers Level 2 집합] [1차] 뉴스 클러스터링 Javascript

⚡문제정보 문제가 아주 깁니다만 아래를 보면 감이 오실겁니다. 요약하자면 문제는 이렇습니다. 1. string 두개가 매개변수로 들어온다. 2. 들어온 문자열은 두글자씩 끊어서 만드는데 알파벳으로된 쌍만 유효하다. 3. 대소문자는 구분하지 않는다. 4. *****다중집합을 허용한다 5. 교집합 / 합집합 * 65536을 한 값을 리턴해라 6. 만약 교집합도 없고 합집합도 없다면 1 * 65536을 리턴해라 🔍접근방법 1. 우선 알파벳쌍만 유효하게 처리하기 때문에 알파벳이 아닌 값들을 걸러줄 정규표현식이 있으면 좋겠습니다. 2. 교집합과 합집합을 구현해야 합니다. 3. 다중집합을 고려해야합니다 따라서 자바스크립트의 set을 사용하는데에는 제한사항이 있습니다. set은 중복을 허용하지 않기 때문입니다. 4...

javascript

요약 정리는 못 참지 않을까요? (14) DOM

🙄DOM 이 뭔가요? DOM이란 HTML 문서의 계층적 구조와 정보를 표현하며 이를 제어할 수 있는 API 즉 프로퍼티와 메서드를 제공하는 트리 자료구조입니다. 🙄HTML 요소의 구조 hello Hello 시작태그 어트리뷰트이름 어트리뷰트값 콘텐츠 종료태그 요소 노드로 변환 어트리뷰트 노드로변환 어트리뷰트 노드로변환 텍스트 노드로 변환 HTML 요소는 위와 같은 구조로 이루어져 있습니다. 이러한 HTML 요소는 렌더링 엔진에 의해 파싱되어서 DOM을 구성하는 요소 노드 객체로 변환됩니다. 🙄노드는 여러 종류인가요? 네 문서노드 문서 노드는 DOM트리의 최상위에 존재하는 루트노드이며 document 객체를 가리킵니다. 요소노드 요소노드는 html 요소를 가리키는 객체입니다. 요소노드는 문서의 구조를 표현합..

leetcode

413. Arithmetic Slices Javascript

⚡문제정보 3개 이상 일정한 값이 나오는 경우 카운트를 올려주면 되는데 까다로운 점이 1,2,3,4같은 경우엔 [1,2,3,4]도 같이 카운트를 해줘야합니다. dp 유형 문제인걸 알고봐도 아직 능지가 부족해서 다른 분의 풀이를 참고했습니다. 🔍접근방법 [i-2] - [i-1] 과 [i-1] - [i]의 값이 같으면 문제의 요구조건에 맞는 케이스를 찾을 수 있을 것이다. 🔍참고한 풀이 var numberOfArithmeticSlices = function(nums) { let dp = new Array(nums.length).fill(0) let answer = 0 for(i=2 ; i 1 + 0 [1,2,3,4]같이 답이 3나와야하는 경우 이전 dp에서 1이 할당되었으니 1+1 -> 2 발상이 대단하네요..

leetcode

121 and 122. Best Time to Buy and Sell Stock II

⚡문제정보 예전에 코딩테스트 볼 때 같은 문제가 나온 적 있었는데 따흐흑 하면서 못풀었던 기억이 있는 문제입니다. 지금 생각해보면 easy일만 하네요 간단하게 생각해서 prices[i]와 이전 값들 중 최저값인 값을 비교하면서 prices[i]가 더 작은 값이라면 최저값으로 prices[i]를 넣어 갱신시켜주고 아니라면 팔았을때 얼마 이득인지 비교해주면서 max값을 집어넣어주면 될것입니다. 🔍나의 풀이 var maxProfit = function(prices) { let [answer,buy] = [0,Infinity] for(i=0 ; i prices[i]) { buy = prices[i] } else { answer = Math.max(answer , prices[i]-buy) } } return a..

javascript

요약 정리는 못 참지 않을까요? (13) 브라우저의 렌더링 과정

🙄파싱이 뭔가요? 파싱이란 프로그래밍 언어의 문법에 맞게 작성된 텍스트 문서를 읽어들여 실행하기 위해 텍스트 문서의 문자열을 토큰으로 분해하고 토큰에 문법적 의미와 구조를 반영하여 트리구조의 자료구조인 파스트리를 생성하는 일련의 과정을 말합니다. 일반적으로 파싱이 완료된 이후에는 파스 트리를 기반으로 중간언어인 바이트 코드를 생성하고 실행합니다. 🙄브라우저가 렌더링 하는 과정 1. 브라우저는 html, css, 자바스크립트, 이미지, 폰트파일 등 렌더링에 필요한 리소스를 요청하며 서버로부터 응답을 받습니다. 2. 브라우저의 렌더링 엔진은 서버로부터 응답된 자바스크립트를 파싱하여 DOM과 CSSOM을 생성하고 이들을 결합하여 렌더 트리를 생성합니다. 3. 브라우저의 자바스크립트 엔진은 서버로부터 응답된 자..

냠냠맨
'분류 전체보기' 카테고리의 글 목록 (36 Page)