본문 바로가기
반응형

분류 전체보기

 (501)
39장 DOM(1) 2023년 5월 1일 677p~700p 39.1 노드 브라우저 렌더링 엔진은 HTML 문서를 파싱하여 브라우저가 이해할 수 있는 자료구조인 DOM을 생성한다. DOM은 HTML 문서의 계층적 구조와 정보를 표현하며 이를 제어할 수 있는 API, 즉 프로퍼티와 메서드를 제공하는 트리 자료구조다. 39.1 노드 39.1.1 HTML 요소와 노드 객체 HTML 요소는 HTML 문서를 구성하는 개별적인 요소를 의미한다. HTML 요소는 렌더링 엔진에 의해 파싱되어 DOM을 구성하는 요소 노드 객체로 변환된다. 이때 HTML 요소의 어트리뷰트는 어트리뷰트 노드로, HTML 요소의 텍스트 콘텐츠는 텍스트 노드로 변환된다. * 비선형 자료구조 : 하나의 자료 뒤에 여러 개의 자료가 존재할 수 있는 자료구조(트리, 그..
[재귀] 프로그래머스 '쿼드압축 후 개수' - js 1. 문제 https://school.programmers.co.kr/learn/courses/30/lessons/68936 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 2. 코드 const solution = (arr) => { let zero = 0; let one = 0; // 쪼개는 함수 (시작행, 시작열, 비교할 길이) const divide = (row, col, n) => { let canDivide = true; // 처음부터 전부 숫자가 같은 지 비교 for (let y=row; y < row+n; y++) { for (let x=col..
[데이터베이스] 데이터베이스 기본/ERD와 정규화 과정 2023년 4월 29일 184p~205p 4.1 데이터베이스의 기본 DB : 일정한 규칙, 규약을 통해 저장된 데이터의 모음 DBMS: 해당 DB를 제어, 관리하는 통합 시스템 데이터들은 각 DBMS마다 정의된 쿼리 언어를 사용해 삽입, 삭제, 수정, 조회를 수행할 수 있다. DB 위에 DBMS가 존재하며, 그 위에 응용 프로그램이 있다. MySQL(DBMS)이라는 DBMS가 있고 그 위에 응용 프로그램에 속하는 Node.js, php 등에서 해당 데이터베이스 안에 있는 데이터를 끄집어내 해당 데이터 관련 로직을 구축할 수 있다. - 데이터베이스를 사용하는 이유 데이터베이스가 존재하기 이전에는 파일 시스템을 이용하여 데이터를 관리하였다. (현재도 부분적으로 사용되고 있다.) 데이터를 각각의 파일 단위로 ..
38장 브라우저의 렌더링 과정 2023년 4월 29일 660p~676p 자바스크립트가 가장 많이 사용되는 분야는 웹 브라우저 환경에서 동작하는 웹페이지/애플리케이션의 클라이언트 사이드다. 웹 애플리케이션의 클라이언트 사이드 자바스크립트는 브라우저에서 HTML, CSS와 함께 실행된다. 이를 위해 브라우저가 HTML, CSS, 자바스크립트로 작성된 텍스트 문서를 어떻게 파싱(해석)하여 브라우저에 렌더링하는지 살펴보자. 파싱(구문 분석) : 프로그래밍 언어의 문법에 맞게 작성된 텍스트 문서를 읽어 들여 실행하기 위해 텍스트 문서의 문자열을 토큰으로 분해(어휘 분석)하고, 토큰에 문법적 의미와 구조를 반영하여 트리 구조의 자료구조인 파스트리를 생성하는 일련의 과정 렌더링 : html, css, js로 작성된 문서를 파싱하여 브라우저에 시각..
34장 이터러블 2023년 4월 28일 614p~626p 34.1 이터레이션 프로토콜 iteration protocol은 순회 가능한(itrable)한 자료구조를 만들기 위해 ECMAScript 사양에 정의하여 미리 약속한 규칙이다. ES6에서는 순회 가능한 자료구조를 이터레이션 프로토콜을 준수하는 이터러블로 통일해 for...of문, 스프레드 문법, 배열 디스트럭처링 할당의 대상으로 사용할 수 있도록 일원화했다. 이터레이션 프로토콜에는 이터러블 프로토콜과 이터레이터 프로토콜이있다. - 이터러블 프로토콜(iterable protocol) well-known Symbol인 Symbol.iterator를 프로퍼키 키로 사용한 메서드를 직접 구현하거나 프로토타입 체인을 통해 상속 받은 Symbol.iterator 메서드를 호..
[구현] 프로그래머스 '기지국 설치' - js 1. 문제 https://school.programmers.co.kr/learn/courses/30/lessons/12979 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 2. 코드 처음엔 아파트 길이만큼의 배열 만들어주고 0,1 비교해주는 식으로 했는데.. 코드도 꼬이고 해결도 못했다. 이렇게 간단한 코드로 해결 가능하다니...ㅠㅠ function(n, stations, w) => { let answer = 0; // 기지국 번호가 1부터 시작하니 start는 1, 인덱스는 0부터 시작 let index = 0; // stations내 요소들 가리키는 ..
26장 ES6 함수의 추가 기능 2023년 4월 26일 469p~491p 26.1 함수의 구분 ES6 이전까지 자바스크립트의 함수는 별다른 구분없이 다양한 목적으로 사용되었다. 일반적인 함수로서 호출할 수 있다. new 연산자와 함께 호출하여 인스턴스를 생성할 수 있는 생성자 함수로서 호출할 수도 있다. 객체에 바인딩되어 메서드로서 호출할 수도 있다. 즉, ES6 이전의 모든 함수는 일반 함수로서 호출할 수 있는 것은 물론 생성자 함수로서 호출할 수 있다. 다시 말해, ES6 이전의 모든 함수는 callable이면서 constructor다. 이러한 문제를 해결하기 위해 es6에서는 함수를 사용 목적에 따라 세 가지 종류로 명확히 구분하였다. ES6 함수의 구분 constructor prototype super arguments 일반 함..
[DP] 프로그래머스 '숫자 변환하기' - js 1. 문제 https://school.programmers.co.kr/learn/courses/30/lessons/154538#qna 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 2. 코드 처음 작성한 코드) 일부 타임 아웃 큐를 이용하지 않아서 타임아웃이 뜬건가 싶기도 하다ㅠㅠ 근데 큐를 이용하는 방법을 모르겠는걸 function solution(x, y, n) { let answer = -1; const bfs = (newY, total) => { if(newY === x) { if(answer !== -1) answer = answer > tota..
반응형

티스토리툴바