Ajax

Ajax란 자바스크립트를 사용하여 브라우저가 서버에게 비동기 방식으로 데이터를 요청하고 서버가 응답한 데이터를 수신하여 웹페이지를 동적으로 갱신하는 프로그래밍 방식을 말한다. Ajax는 브라우저에서 제공하는 Web API인 XMLHttpRequest객체를 기반으로 동작

2021년 1월 8일
·
0개의 댓글

자바스크립트 비동기 프로그래밍

실행 컨텍스트에서 함수를 호출하면 함수 코드가 평가되어 함수 실행 컨텍스트가 생성이 된다. 그리고 함수 실행 컨텍스트는 실행컨텍스트 스택에 푸시되고 함수 코드가 실행된다. 그리고 종료하면 스택에서 제거된다. 이게 동기적으로 할 수 밖에 없다. 자바스크립트 엔진은 단 하

2021년 1월 7일
·
0개의 댓글

자바스크립트 타이머

함수를 명시적으로 호출하면 함수가 즉시 실행된다. 근데 만약 함수를 명시적으로 호출하지 않고 일정 시간이 경과된 이 후에 호출되도록 함수 호출을 예약하려면 타이머 함수를 사용한다.타이머 함수는 ECMAScript사양에 정의된 빌트인 함수가 아니지만 브라우저 환경과 No

2021년 1월 7일
·
0개의 댓글

자바스크립트 이벤트

이벤트 브라우저는 처리해야할 특정 사건이 발생하면 이를 감지하여 이벤트를 발생 시킨다. 예를 들어 클릭, 키보드 입력, 마우스 이동등이 일어나면 브라우저는 이를 감지하여 특정한 타입의 이벤트를 발생시킨다. 이벤트가 발생했을 때 호출될 함수를 이벤트 핸들러라고 하고

2021년 1월 7일
·
0개의 댓글

#1 DOM part.2

자식 노드 탐색 이전에 NodeList와 HTMLCollection에 대해서 공부했었다. 이제 DOM 트리의 노드를 옮겨 다니며 부모, 형제, 자식 노드 등을 탐색 해야 할 때가 있다. 다음 예제를 살펴보자. ul요소는 3개의 자식 요소를 갖는다. 이때 부모의 i

2021년 1월 7일
·
0개의 댓글

#1 DOM part.1

DOM이란 DOM이란 렌더링 엔진은 HTML 문서를 파싱하여 브라우저가 이해할 수 있는 자료구조인 DOM을 생성한다. DOM은 HTML 문서의 계층적 구조와 정보를 표현하며 이를 제어할 수 있는 API,즉 프로퍼티와 메서드를 제공하는 트리 자료 구조이다. > 트리

2020년 12월 22일
·
0개의 댓글

브라우저 렌더링 과정

브라우저가 HTML,CSS, 자바스크립트로 작성된 텍스트 문서를 어떻게 파싱하여 브라우저에 렌더링을 할까? 일단 파싱이란건 무엇일까? 파싱은 프로그래밍 문법에 맞게 작성된 텍스트 문서를 읽어 들여 실행하기 위해 텍스트 문서의 문자열을 토큰으로 분해 > 토큰은 문법적

2020년 12월 14일
·
0개의 댓글

디스트럭처링 할당

디스트럭처링 할당은 구조화된 배열과 같은 이터러블 또는 객체를 비구조화하여 1개이상의 변수에 개별적으로 할당 하는 것을 말한다.배열과 같은 이터러블 또는 객체 리터럴에서 필요한 값만 추출하여 변수에 할당할 때 유용하다.ES5에서 구조화된 배열을 디스트럭처링하여 1개 이

2020년 12월 11일
·
0개의 댓글

Rest 파라미터와 스프레드 문법

Rest 파라미터는 매개변수 이름앞에 세개의 점...을 붙여서 정의한 매개변수를 의미한다. Rest 파라미터는 함수에 전달된 인수들의 목록을 배열로 전달 받는다.일반 매개변수와 Rest파라미터는 함께 사용할 수 있다.일반 매개변수 앞에 Rest 파라미터는 못 쓴다.이처

2020년 12월 9일
·
0개의 댓글

ES6 함수의 추가 기능

ES6 사양에서의 메서드는 메서드 축약 표현으로 정의된 함수만을 의미한다.위 에서는 foo()는 메서드이고 bar는 일반 함수다.ES6사양에서 정의한 메서드는 인스턴스를 생성할 수 없다.즉 ES6사양에서 정의한 메서드는 non-constructor이다.그래서 ES6사양

2020년 12월 9일
·
0개의 댓글

자바스크립트 배열

배열은 여러개의 값을 순차적으로 나열한 자료구조 입니다.하지만 자바스크립트 배열은 배열이 아닙니다.자료구조에서 말하는 배열은 동일한 크기의 메모리 공간이 빈틈없이 나열된 자료구조입니다. 하지만 자바스크립트 배열은 객체입니다.어떤 값도 들어갈 수 있고 각 타입마다 크기가

2020년 12월 8일
·
0개의 댓글

자바스크립트 클래스

클래스를 한마디로 이야기 하면 클래스는 객체만을 생성하는 함수입니다.(다른 일은 안 합니다.)생성자 함수는 일반 함수로 호출할 수 있지만 클래스는 객체만을 위한 전용 함수입니다.클래스는 생성자 함수와 유사한 부분이 많고 new와 함께 호출합니다. 즉 클래스도 함수 입니

2020년 12월 8일
·
0개의 댓글

클로저와 실행 컨텍스트

ECMAScript에선 클로저를 알려주지는 않습니다.그래서 Mdn 자료를 찾아보면Mdn에선 클로저를 그 함수와 그 함수가 선언된 렉시컬 환경의 조합이라고 합니다.이 말만 들으면 이해하기 어려울 수도 있습니다.하지만 실행 컨텍스트와 렉시컬 스코프를 이해하고 나서 Mdn에

2020년 12월 8일
·
0개의 댓글

JavaScript-this

객체지향 프로그래밍에서 살펴보았듯이 객체는 상태를 나타내는 프로퍼티와 프로퍼티의 동작을 나타내는 메서드를 하나의 논리적인 단위로 묵은 복합적인 자료구조 이다.이때 동작을 나타내는 메서드는 자신이 속한 객체의 프로퍼티에 참조하고 변경할 수 있어야 한다.즉 자신이 속한 객

2020년 12월 8일
·
0개의 댓글

프로토타입

자바스크립트는 멀티 패러다임 프로그래밍 언어다. 명령형,함수형,프로토타입 기반 객체지향 프로그래밍을 지원한다. 자바스크립트는 객체 키반의 프로그래밍 언어이고 자바스크립트를 이루고 있는 거의 모든 것이 객체입니다. 원시 타입의 값을 제외한 모든 것이 객체라고 생각하

2020년 12월 6일
·
0개의 댓글

함수와 일급 객체

함수는 일급 객체이다. 일단 일급 객체는 조건이 필요하다.무명의 리터럴로 생성할 수 있다. 즉 런타임에 생성이 가능하다.변수나 자료구조에 저장할 수 있다.함수의 매개변수에게 전달할 수 있다.함수의 반환값으로 사용할 수 있다.함수가 일급 객체라는 것은 함수를 객체와 동일

2020년 12월 2일
·
0개의 댓글

생성자 함수

저번 시간에 객체 리터럴로 객체 생성 방식을 공부했다.요번에는 생성자 함수로 생성하는 객체 생성 방식을 보자new 연산자와 함께 Object 생성자 함수를 호출하면 빈 객체를 생성하여 반환한다. 빈 객체를 생성하고 프로퍼티나 메서드를 추가하여 객체를 완성 할 수 있다.

2020년 12월 2일
·
0개의 댓글

프로퍼티 어트리뷰트

프로퍼티 어트리뷰트는 프로퍼티 속성에 대해서 공부해 보자일단 프로퍼티 어트리뷰트를 이해하기 앞서 내부슬롯과 내부 메서드에 대해서 공부해 보자내부슬롯과 내부 메서드는 ECMAScript사양에 정의된 대로 구현되어 자바스크립트 엔진에서 실제로 동작하지만 개발자가 직접 접근

2020년 12월 1일
·
0개의 댓글

let,const와 블록 레벨 스코프

var 키워드로 선언한 변수는 중복 선언이 가능합니다.위 예제의 var키워드로 선언한 x변수는 재할당이 되어서 x는 100으로 재할당 되었다. 그리고 var로 선언한 변수는 오로지 함수의 코드 블록만을 지역 스코프로 인정합니다. 따라서 함수 외부에서 var키워드로 선언

2020년 12월 1일
·
0개의 댓글

전역 변수의 문제점

변수의 생명 주기는 짧으면 짧을 수록 성능면에서 좋다.만약 변수에 생명 주기가 없다면 한번 선언된 변수는 프로그램을 종료하지 않는 한 영원히 메모리 공간을 점유하게 된다.즉 변수를 전역에 선언을 하면 프로그램이 종료되지 않는 한 죽지를 않는다. 지역 변수를 쓰면 함수가

2020년 12월 1일
·
0개의 댓글