JavaScript Dev./Javascript

JavaScript Dev./Javascript

JavaScript 자료구조

1. 자료 구조(Data Structure)란? 다수의 자료(data)를 담기 위한 구조 데이터의 수가 많아질수록 효율적인 자료 구조가 필요하다. ==> ex) 학생 수가 1,000,000명 이상인 학생 관리 프로그램 따라서 자료 구조의 필요성에 대해서 이해할 필요가 있다. 성능 비교: 자료구조/알고리즘의 성능 측정 방법에 대해 이해할 필요가 있다. 데이터를 효과적으로 저장하고, 처리하는 방법에 대해 바르게 이해할 필요가 있다. 자료구조를 제대로 이해하지 못하면 불필요하게 메모리와 계산을 낭비할 여지가 있다. 2. 자료 구조의 종류 선형 구조 (linear data structure) 하나의 데이터 뒤에 다른 데이터가 하나 존재하는 자료구조 데이터가 연속적(순차적)으로 연결되어 있다. 배열 (Array)..

JavaScript Dev./Javascript

14. DOM과 클래스, 클로저

1. DOM DOM의 기본 개념 JS는 왜 만들어진 건가? 웹 페이지를 동적으로 만들기 위해 HTML 문서를 조작해서 생명력을 넣기 위해 만들어진 언어 웹 페이지가 동작하는 과정 클라이언트가 브라우저에 주소를 입력한다. HTML 문서를 서버로부터 수신 서버가 클라이언트에게 response를 준다. (즉, response가 HTML 문서(document)) 브라우저가 HTML 파일을 해석(parsing 파싱) 브라우저에는 기본적으로 렌더링 엔진이 있다. 서버가 클라이언트에게 준 HTML문서를 렌더링 한다. 랜더링 엔진이 HTML 문서에 코드를 해석한다. JS가 이해할 수 있는 방식으로 해석하고 내용을 토대로 DOM Tree를 구성 DOM Tree랑 CSSOM Tree를 묶어서 Render Tree를 구성 ..

JavaScript Dev./Javascript

13. 콜백 함수와 동기/비동기 처리

1. 콜백 함수란 다른 코드의 인자로 넘겨주는 함수. 즉, 콜백 함수를 넘겨 받는 코드(ex. forEach, setTimeout) 가 있다는 말. 콜백 함수를 넘겨 받은 코드가 콜백 함수를 필요에 따라 적절한 시점에 실행하게 된다. 콜백 함수는 다른 코드(함수 또는 메서드)에게 인자로 넘겨줌으로써 그 제어권도 함께 위임하는 함수. 콜백 함수를 위임받은 코드는 자체적으로 내부 로직에 의해 콜백 함수를 적절한 시점에 실행. 2. 제어권 호출 시점 ==> 콜백 함수의 제어권을 넘겨받은 코드는 콜백 함수 호출 시점에 대한 제어권을 가진다. 인자 ==> map 함수는 각 배열 요소를 변환하여 새로운 배열을 반환한다. 기존 배열을 변경하지 않고, 새로운 배열을 생성. // map 함수에 의해 새로운 배열을 생성해..

JavaScript Dev./Javascript

12. this(정의, 활용 방법, 바인딩, call, apply, bind)

1. 상황에 따라 달라지는 this 1. this는 실행 컨텍스트가 생성될 때 결정된다. 즉, this를 bind한다라고도 한다. this는 함수를 호출할 때 결정된다. 전역 공간에서의 this 1. 전역 공간에서 this는 전역 객체를 가르킨다. 2. 런타임 환경에 따라 this는 window(브라우저 환경) 또는 global(node 환경)을 각각 가르킨다. 2. 메서드로서 호출할 때 그 메서드 내부에서의 this 함수 vs. 메서드 (독립성) ==> 함수는 그 자체로 독립적인 기능을 수행 ==> 메서드는 자신을 호출한 대상 객체에 대한 동작을 수행 this의 할당 // CASE1 : 함수 // 호출 주체를 명시할 수 없기 때문에 this는 전역 객체를 의미해요. var func = function ..

JavaScript Dev./Javascript

11. 실행 컨텍스트(스코프, 변수, 객체, 호이스팅)

1. 실행 컨텍스트란? - 실행할 코드에 제공할 환경 정보들을 모아놓은 객체. 선언된 변수를 위로 끌어올린다. (호이스팅) 외부 환경 정보를 구성 this 값을 설정 스택(stack) - 마지막에 들어간게 첫번째로 나오는 구조 콜 스택(call stack) - 필요한 환경 정보들을 모아 컨텍스트를 구성하고 이것을 stack의 한 종류인 콜 스택에 쌓아올린다. 가장 위에 쌓여있는 컨텍스트와 관련된 코드를 실행하는 방법으로 코드의 환경 및 순서를 보장할 수 있다. 컨텍스트의 구성 구성 방법 a. 전역공간 b. eval()함수 c. 함수(흔히 실행 컨텍스트를 구성하는 방법) 실행 컨텍스트 구성 예시 // ---- 1번 var a = 1; function outer() { function inner() { co..

JavaScript Dev./Javascript

10. 데이터 타입

@ 데이터 타입의 종류(기본형과 참조형) ==> 구분 기준은 값의 저장 방식과, 불변성 여부 기본형(Primitive type): 값이 담긴 주소값을 바로 복제, 불변성을 띔 참조형(Reference type): 값이 담긴 주소값들로 이루어진 묶음을 가리키는 주소값을 복제, 불변성을 띄지 않음 @ 메모리와 데이터 메모리, 데이터 비트 1. 0과 1을 가지고 있는 메모리를 구성하기 위한 작은 조각을 의미 바이트 1. 비트 8개를 묶음 단위 메모리(memory : byte 단위로 구성 1. 모든 데이터는 byte 단위의 식별자인 메모리 주소값을 통해서 서로 구분이 된다. 2. Javascript의 메모리는 다른 언어의 여러 데이터 타입과 다르게 8byte로 이루어져 있어서 handling할 요소들이 많지 않..

Yoonsoo
'JavaScript Dev./Javascript' 카테고리의 글 목록 (2 Page)