에바니네

실행 컨텍스트 ( Execution Context )

실행 컨텍스트란 ? 실행 가능한 코드가 실현되기 위해 필요한 환경입니다. 브라우저의 자바스크립트 엔진이 자바스크립트 코드의 변환 및 실행을 처리하기 위한 특수한 환경을 생성하는데 이를 실행 콘텍스트라고 합니다. 여기에는 현재 실행중인 코드와 실행을 지원하는 모든 것들이 담겨 있는데, 실행 컨텍스트 런타임 동안 특정 코드가 파서에 의해 파싱되고, 변수와 함수가 메모리에 저장되며 실행가능한 바이트 코드가 생성되고 실행됩니다. 실행 컨텍스트의 종류 전역 실행 컨텍스트 (GEC, GO) 자바스크립트 엔진이 스크립트 파일을 받게되면 함수 내부에 존재하는 코드 외 모든 코드(빌트 인 객체, BOM , DOM, 전역 변수가)를 기반으로 처음에 전역 실행 컨텍스트를 생성하게됩니다. 그래서 모든 자바스크립파일에는 하나의..

15. 3SUM

문제 https://leetcode.com/problems/3sum/description/ Given an integer array nums, return all the triplets [nums[i], nums[j], nums[k]] such that i != j, i != k, and j != k, and nums[i] + nums[j] + nums[k] == 0. Notice that the solution set must not contain duplicate triplets. 주어진 정수 배열들로 인덱스가 겹치지않고, 모든 합이 0에 만족하는 삼중 항인 [nums[i], nums[j], nums[k]] 반환하세요. 중복 삼중항은 없어야합니다. 무식하게 풀어보기 1 2 3 4 5 6 7 8 9 1..

11 - Container With Most Water

You are given an integer array height of length n. There are n vertical lines drawn such that the two endpoints of the ith line are (i, 0) and (i, height[i]). 길이 n의 높이에 대한 정수배열이 주어집니다. 여기에는 n개의 수직선이 그려져 있으며, 선의 두 끝점은 (i, 0) 및 (i, height[i])가 됩니다. Find two lines that together with the x-axis form a container, such that the container contains the most water. Return the maximum amount of water a co..

2. Add Two Numbers

문제 두개의 비어있지 않은 양수만을 표현하는 linked list들을 받게되는데, 각 숫자들은 뒤집힌 순서대로 저장되어 있으며 각 노드들은 하나의 숫자만 포함하고 있습니다. 두 숫자를 더해서 그 합을 linked list로 반환하세요. 그 숫자 자체가 0이 아닌이상 선행숫자에 0이 들어가면 안됩니다. 일단 문제를 자세히 읽어봐야했다. 단순히 배열 문제인줄 알고 접근했다가, 절대 풀 수가 없었다. 자료구조에 대한 무지가 이렇게 다가올줄은 몰랐다. 그래서 일단 linked list가 무엇을 말하는지 봤어야했다. 조사 A linked list is an ordered, linear structure, similar to an array. Instead of items being placed at indices..

TypeScript - Utility Type

Partial T 타입안에 요소들에 대해서 전부 Optional(?:)로 만들어 준다. interface Myinfo { name: string, age: number, phone: number, married: boolean, } const jeongmin : Myinfo ={ name: "jeongmin", age: 26, phone: 12345678, married: false, } const newJeongmin : Partial ={ name: "jeongmin", age: 26, } Partial을 뜯어서 구현을 해자보자면 P으로 지정해줬을 때, key값은 해당 T 타입의 키값들을 가져와 in 으로 돌려서 순회해서 뽑아내고 [ Key in keyof T ] value값은 T타입에 인덱싱을 해서..

모던 자바스크립트 Deep Dive - 38장

구글의 V8 자바스크립트 엔진으로 빌드된 자바스크립트 런타임 환경인 Node.js의 등장으로 자바스크립트가 웹 브라우저에서 벗어나 서버나 다른 개발에서도 사용될 수 있는 범용 개발 언어가 되었습니다. 대부분의 언어와는 다르게, 웹 애플리케이션의 클라이언트 사이드 자바스크립트는 브라우저에서 HTML, CSS와 함께 실행됩니다. 파싱 (Paring) 프로그래밍 언의 문법에 맞게 작성된 텍스트 문서를 읽어 들여 실행하기 위해 텍스트 문서의 문자열을 토큰으로 분해하고, 문법적 의미와 구조를 반영해 트리 구조의 자료구조인 파스트리를 생성하는 일련의 과정 렌더링 ( Rendering ) HTML, CSS, Javascript로 작성된 문서를 파싱하여, 브라우저에 시각적으로 출력하는 것 렌더링의 과정 1. 렌더링..

모던 자바스크립트 Deep Dive - 36장, 37장

디스트럭처링 할당 ( 구조 분해 할당 ) 구조화된 배열과 같은 이터러블 또는 객체를 디스트럭처링하여 1개 이상의 변수에 개별적으로 할당하는 것을 말한다. const arr = [4,5,6]; const [six, five, four] = arr; console.log(four, five, six); // 6 5 4 // 배열 디스트럭처링 할당의 대상은 이터러블이어야하며, // 할당 기준은 배열의 인덱스다. const [a,b] = [1,2]; const [c,d] = [3]; const [e,f] = [5,6,7]; console.log(a,b); // 1, 2 console.log(c,d); // 1 undefiend console.log(e,f); // 1, 2 // 요소 개수가 반드시 일치할 필요는..

모던 자바스크립트 Deep Dive - 35장

스프레드 문법 ES6에서 도입된 스프레드 문법(spread syntax) ... 은 하나로 뭉쳐 있는 여러 값들의 집합을 펼쳐서 개별적인 값들의 목록으로 만든다. 스프레드 문법을 적용할 수 있는 대상은 순회할 수 있는 이터러블에 한정된다. // ...[1, 2, 3]은 [1, 2, 3]을 개별 요소로 분리한다(→ 1, 2, 3) console.log(...[1, 2, 3]); // 1 2 3 // 문자열은 이터러블이다. console.log(...'Hello'); // H e l l o // Map과 Set은 이터러블이다. console.log(...new Map([['a', '1'], ['b', '2']])); // [ 'a', '1' ] [ 'b', '2' ] console.log(...new Se..