스파르팅

단순히 부트캠프에서 시켜서 습관적으로 쓰기 시작했떤 TIL 들이고, 기록의 의미는 있었지만 좋은 기록이었다는 생각이 들진 않습니다.. 부트캠프 수료과정에서 기술 구현에 급급했고 매일 쓴다는 사실에만 의의를 더서 일기 정도의 의미를 가졌떤 글 같아요. 성실하기 위해서 꾸준이 써왔었지만, 이보단 1. commit을 매일 하는게 더 좋지 않을까? 2.글은 정리된 데이터만 기록하는게 추후 내가 확인하기도 좋지 않을까? 생각이 들어서 새 블로그를 만들었습니다.. 처음에는 코딩이 궁금했고, 취업도 금방할 수 있다는 마케팅에 속아서 시작했지만, 개발 자체는 재미가 있고 꾸준히 진행하고 있습니다. 성장에 대한 영감을 많이 얻었던 분은 개발바닥 유튜브 하시는 인프런 이동욱 CTO님꼐 많이 얻었습니다. 그 분의 이야기를 ..

DOM은 HTML 문서의 계층적 구조와 정보를 표현하며 이를 제어할 수 있는 API, 즉 프로퍼티와 메서드를 제공하는 트리 자료 구조다. 노드 HTML요소와 노드 객체 HTML 요소는 HTML 문서를 구성하는 개별적인 요소를 의미한다. HTML 요소는 렌더링 엔진에 의해 파싱되어 DOM을 구성하는 요소 노드 객체로 변환된다. 이떄 HTML 요소의 어트리뷰트는 어트리뷰트 노드, HTML 요소의 텍스트 콘텐츠는 텍스트 노드로 변환된다. Hello div : 시작태그, 종료 태그 class : 어트리뷰트 이름 greeting : 어트리뷰트 값 Hello : 콘텐츠 div : 요소노드 , class="greeting" 어트리뷰트 노드 , "Hello" : 텍스트 노드 HTML 문서는 HTML 요소들의 집합으로 ..

대부분의 프로그래밍 언어는 운영체제나 가상 머신 위에서 실행되지만 웹 애플리케이션의 클라이언트 사이드 자바스크립트는 브라우저에서 HTML, CSS와 함께 실행된다. 따라서 브라우저 환경을 고려할 때 더 효율적인 클라이언트 사이드 잡스크립트 프로그래밍이 가능하다. 브라우저 HTML, CSS, 자바스크립트로 작성된 텍스트 문서를 어떻게 파싱하여 브라우저에 렌더링하는지 살펴보면 아래와 갔다 파싱 : 파싱은 프로그래밍 언어의 문법에 맞게 작성된 텍스트 문서를 읽어 들여 실행하기 위해 텍스트 문서의 문자열을 토큰으로 분해하고, 토큰에 문법적 의미와 구조를 반영하여 트리 구조의 자료구조인 파스트리를 생성하는 일련의 과정을 말한다. 일반적으로 파싱이 완료된 이후에는 파스 트리를 기반으로 중간언어인 바이트 코드를 생성..

Set Set 객체는 중복되지 않는 유일한 값들의 집합이다. Set 객체는 배열과 유사하지만 다음과 같은 차이가 있다. 구분 배열 Set 객체 동일한 값을 중복하여 포함 할 수 있다. O X 요소 순서에 의미가 있다. O X 인덱스로 요소에 접근할 수 있다. O X 이러한 Set 객체의 특성은 수학접 집합의 특정과 일치한다. Set 은 수학적 집합을 구현하기 위한 자료 구조로, 교집합, 합집합, 차집합, 여집합을 구현할 수 있다. Set 객체의 생성 Set 생성자 함수로 생성한다. Set 생성자 함수에 인수를 전달하지 않으면 빈 Set 객체가 생성된다. const set = new Set(); console.log(set); //Set(0 {} Set 생성자 함수는 이터러블을 인수로 전달받아 Set 객체..

const user = { firstName: "Ungmo", lastName: "Lee" }; const { lastName: ln, firstName: fn } = user; console.log(fn, ln); //Ungmo Lee 구조 분해 할당은 구조화된 배열과 같은 이터럽르 또는 객체를 비구조화하여 1개 이상의 변수에 개별적으로 할당하는 것을 말한다. 배열 디스트럭처링 할당 ES6의 배열 디스트럭처링 할당은 배열의 각 요소를 배열로부터 추출하여 1개 이상의 변수에 할당한다. 이때 배열 드스트럭처링 할당의 대상은 이터러블이어야 하며, 할당 기준은 배열의 인덱스다. 배열 디스트럭처링 할당을 위해서는 할당 연산자 왼쪽에 값을 할당받을 변수를 선언해야 한다. 이때 변수 배열 리터럴 형태로 선언한다. ..

알고리즘은 결국 메서드를 얼만큼 아냐 따라서 코드가 예뻐지는 것 같다. 직사각형 형식으로 드래그를 할 수 있는데 , 화면에 있는 파일을 최소한의 넓이로 삭제하기 위한 직사각형의 좌측 상단 인덱스와 우측하단 인덱스를 구하는 것이다. 문제링크 : https://school.programmers.co.kr/learn/courses/30/lessons/161990 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 문제풀이 : for문을 이용해서 #이 나올때, 해당 값을 기존에 입력된 정답과 비교해서 l 같은 경우에 가장 같을때, r 같은 경우에 값이 클 경우 교체하..

문제 요약하면, 여러마리의 폰켓몬 중에서, 최대한 많은 종류를 선택하고 싶은데 이때 선택 가능한 마릿수는 전체 폰켓몬 중의 절반이다. 따라서 중복이 없는 폰켓몬의 수와 총 폰켓몬의 수의 절반 중에서 더 작은 값이, 선택 가능한 가장 다양한 종류이고 답이다. 자바스크립트에서 Set을 이용하면 중복이 없는 값을 구할 수 있다. 이때 구해진 값은 객체로 나온다. 따라서 객체의 수를 구하기 위해서 나는 Set 객체를 배열로 만들어서 길이를 구하였다.( 안 좋은 방법) function solution(nums) { const nonDuplicatedNums = new Set(nums); const newNums = [...nonDuplicatedNums]; return Math.min(newNums.length,..

ES6 에 도입된 스프레드 문법(전개 문법) ... 은 하나로 뭉쳐 있는 어러 값들의 집합을 펼쳐서 (전개, 분산하여, spread) 개별적인 값들의 목록으로 만든다. 사용 가능 대상 : Array, String, Map, Set, DOM 컬렉션, arguments 와 같이 for of 로 순회할 수 있는 이터러블 console.log(...[1, 2, 3]); //1 2 3 스프레드 문법의 결과는 값이 아니라, 값들의 목록이므로 변수 할당할 수 없다. 값의 목록을 사용하는 1. 함수 호출문의 인수 목록 , 2. 배열 리터럴의 요소 목록, 3. 객체 리터럴의 프로퍼티 목록에만 사용할 수 있다. 함수 호출문의 인수 목록에서 사용하는 경우 Math.max는 매개변수 개수를 확정할 수 없는 가변 인자 함수이다..

ES6에서 도입된 이터레이션 프로토콜은 순회 가능한 데이터 컬렉션을 만ㄷ글기 위해 ECMAScript 사양에 정의하여 미리 약속한 규칙이다 ES6 이전의 순회 간으한 데이터 컬렉션들은 통일된 규약없이 각자 나름의 구조를 가지고 다양한 방법으로 순회할 수 있었다. ES6에서는 순회 가능한 데이터 컬렉션을 이터레이션 프로토콜을 준수하는 이터러블로 통일하여 for ...of 문 , 스프레드 문법, 배열 디스트럭처링 할당의 대상으로 사용할 수 있도록 일원화다. 이터레이션 프로토콜은 2가지로 나뉜다. 이터러블 프로토콜 Well-known Symbol인 Symbol.iterator를 프로퍼티 키로 사용한 메서드를 직접 구현하거나 프로토타입 체인을 통해 상속 받은 Symbol.iterator 메서드를 호출하면 이터레..

심벌이란 1997년 자바스크립트가 ECMAScript로 표준화된 이래로 자바스크립트에는 6개의 타입 즉, 문자열, 숫자 , 불리언, undefined , nul , 객체 타입이 있었다. ES6 도입된 7번째 데이터 타입으로 변경 불가능한 원시 타입의 값이다. 심벌 값의 생성 #1. Symbol 함수 심벌값은 Symbol 함수 호출하여 생성해야함 ( 리터럴 표기법 불가) 이때 생성된 심벌 값은 외부로 노출되지 않아 확인할 수 없으며, 다른 값과 절대 중복되지 않는 유일무이한 값. //Symbol 함수를 호출하여 유일무이한 심벌 값을 생성한다. const mySymbol = Symbol(); console.log(typeof mySymbol); // symbol //심벌 값은 외부로 노출되지 않아 확인할 수..