전체 글245 JavaScript 문법 정리 - DOM, 클래스, 클로저 DOM 1. DOM의 기본개념 자바스크립트는 웹 페이지를 동적으로 만들기 위해. 즉, HTML 문서를 조작해서 생명력을 불어넣어주기 위해 만들어진 언어이다. 🔥 웹 페이지가 화면에 나타나는 과정 1. 사용자가 브라우저에 'www.naver.com' 주소를 입력한다. - 사용자(=클라이언트)가 서버에게 요청(request)를 했다. 2. HTML 문서를 서버로부터 수신한다. - 네이버 서버는 클라이언트에게 응답(response)를 주었다. - 그 응답은 HTML 문서(document)이다. 3. 브라우저가 HTML 파일을 해석 (parsing 파싱) - 브라우저에는 기본적으로 렌더링 엔진이 있다. 그 엔진은 서버가 클라이언트에게 준 HTML 문서를 렌더링한다. - 렌더링 엔진이 HTML 문서에 코드 한줄,.. 2024. 3. 16. JavaScript 문법 정리 - 콜백함수(개념, 제어권, this 바인딩, 비동기 제어) 콜백함수란 다른 코드의 인자로 넘겨주는 함수이다. 인자로 넘겨준다는 얘기는 콜백함수를 넘겨받는 코드(함수 또는 메서드)가 있다는 의미이며, forEach, setTimeout 등이 있다. 콜백함수를 넘겨받은 위와 같은 forEach, setTimeout 등은 이 콜백함수를 필요에 따라 적절한 시점에 실행하게 된다. (제어권이 이들에게 있는 것이다.) 즉, 콜백함수는 다른 함수 또는 메서드에게 인자로 넘겨줌으로서 그 제어권도 함께 위임한 함수이다. 콜백함수를 위임받은 코드(함수 또는 메서드)는 자체적으로 내부 로직에 의해 이 콜백함수를 적절한 시점에 실행한다. 콜백함수_제어권 그렇다면 콜백함수를 넘겨받은 코드(함수 또는 메서드)는 어떠한 제어권을 갖게 되는 것일까? 1. 호출 시점 콜백 함수의 제어권을 넘.. 2024. 3. 15. JavaScript 문법 정리 - this (정의, 활용법, 바인딩, call, apply, bind) 상황에 따라 달라지는 this 실행 컨텍스트는 실행할 코드에 제공할 환경 정보들을 모아놓은 객체 그 객체 안에는 3가지가 존재한다. 1. VariableEnvironment 2. LexicalEnvironment 3. this 바인딩 1. this는 실행 컨텍스트가 생성될 때 결정된다. 즉, this는 함수를 호출할 때 결정된다. 전역 공간에서의 this는 전역 객체 (브라우저 환경, node 환경)을 가리킨다. console.log(this); console.log(window); console.log(this === window); // true console.log(this); console.log(global); console.log(this === global); // true 2. 메서드로서 .. 2024. 3. 14. 24.3.13 냉정지 📚 TIL(Today I Learned) 15척 쵸친 바라케 양당고로 시작! 찌는 미아작 파랭이 튜브찌 2호 원줄 / 목줄 : 1.0호 / 0.8호 바늘 : 바라사 5호 7호 떡밥 : 카쿠신, 코우텐 약 3~4시간 척상급 3마리 😀 Feeling 주차할때만 해도 따뜻해서 괜찮겠다 싶었는데 막상 조구장 안에 있으니 바람도 많이 불고 추워서 3~4시간만 하고 철수 15척 쵸친으로 시작해서 3수 달성 ㅠㅠ 평소보다 조황이 좋지 않은 듯 2024. 3. 14. JavaScript 문법 정리 - 실행컨텍스트 (스코프, 변수, 객체, 호이스팅) 실행 컨텍스트란? 실행 컨텍스트는 실행할 코드에 제공할 환경 정보들을 모아놓은 객체이다. 자바스크립트는 어떤 실행 컨텍스트가 활성화되는 시점에 다음과 같은 일을 한다. 1. 선언된 변수를 위로 끌어올림 (=호이스팅) 2. 외부 환경 정보를 구성 3. this 값을 설정 1. 스택 vs 큐 실행 컨텍스트를 이해하기 위해서는 "콜 스택"에 대한 이해가 반드시 필요하다. 그 전에 "스택" 과 "큐"에 대해 살펴보면 아래와 같다. 스택은 바스캣, 큐는 원통과 같은 것이라고 생각하면 되고 스택은 LIFO, 큐는 FIFO이다. 2. 콜 스택 (call stack) 실행 컨텍스트란 실행할 코드에 제공할 환경정보를 모아놓은 객체! 라고 했었는데 그 객체. 즉, 동일 환경에 있는 코드를 실행할 때 필요한 환경정보들을 모.. 2024. 3. 14. JavaScript 문법 정리 - 데이터 타입 종류 및 메모리, 데이터 할당, 불변 객체 데이터 타입 1. 데이터 타입의 종류 (기본형과 참조형) 자바스크립트에서 값의 타입은 기본형과 참조형으로 구분된다. 기본형과 참조형의 구분 기준은 값의 저장 방식과 불변성 여부이다. [기본형과 참조형의 구분 기준] 1. 저장 / 복제 방식 가. 기본형 : 값이 담긴 주소값을 바로 복제 나. 참조형 : 값이 담긴 주소값들로 이루어진 묶음을 가리키는 주소값을 복제 2. 불변성의 여부 가. 기본형 : 불변성을 띔 (=불변하다) 나. 참조형 : 불변성을 띄지 않음 (=불변하지 않다) 기본형이 불변하다는 것에 대해 이의를 제기할 수도 있는데 예를 들어 var a = 6; a = "abc"; 와 같이 값을 재할당해서 a라는 변수의 값이 변했기 때문에 "불변하지 않는 것 아니냐" 라고 할 수 있는데 불변하다라는 말은.. 2024. 3. 14. 이전 1 2 3 4 5 6 7 8 ··· 41 다음
