IIFE란?Immediately Invoked Function Expression의 줄임말로 정의되지마자 득시 실행되는 함수 표현식을 말한다.// 아래 두 함수는 동일한 동작을 수행한다.var app = function() { console.log('함수 호출');};app(); // '함수 호출'// 즉시실행함수 IIFE(function() { console.log('함수 호출');}()); // '함수 호출' 위의 두 함수는 동일한 로직을 가지고 있다. IIFE는 전체 익명함수를 괄호로 감싸 줌으로써 내부 코드가 선언문이 아니라 표현식인 것처럼 Parser를 속인다. 단, 익명함수이기 때문에 재사용은 적합하지 않다. 물론 기명으로도 가능은 하다. 하지만 보통 함수의 이름을 짓는 것은 호..

this 정의let group = { title: "1team", students: ["Kim", "Lee", "Park"], title2 : this.title, title3() { console.log(this.title) }};console.log(group.title2); //undefinedgroup.title3(); // 1team this는 함수의 블록 스코프 내에서 선언되어야 작동한다.  브라우저의 콘솔창을 켜고(F12) this를 입력해 보자.this; // Window {} 그리고 이번엔 변수와 함수 안에 넣어서 실행해 보자.var ga = 'Global variable';console.log(this.ga); // === window.gafunction a() { console..

자바스크립트 AJAX 요청 방식정통적으로 XMLHttpRequest 객체를 생성하여 요청하는 방법이 있지만 문법이 난해하고 가독성 또한 좋지 않다. 따라서 이번 포스트에서는 자바스크립트 AJAX 통신의 최신 기술인 fetch() 사용법에 대해 알아보려 한다.   XMLHttpRequest 방식 XMLHttpRequest 객체를 이용한 정통적인 초창기 비동기 서버 요청 방식이다. 성능에는 문제가 없지만 코드가 복잡하고 가독성이 좋지 않다는 단점이 있다.var httpRequest = new XMLHttpRequest();httpRequest.onreadystatechange = function () { if (httpRequest.readyState == XMLHttpRequest.DONE && htt..

AJAX(Asynchronous Javascript And XML)AJAX는 웹 페이지 전체를 다시 로딩하지 않고도 웹 페이지의 일부분만을 갱신할 수 있게 해 준다. AJAX를 이용하면 백그라운드 영역에서 서버와 통신하여 그 결과를 웹 페이지의 일부분에만 표시할 수 있다. AJAX를 통한 웹 브라우저와 웹 서버 간의 통신 절차는 다음과 같다.사용자에 의한 요청 이벤트 발생.요청 이벤트 발생 시 이벤트 핸들러에 의해 자바스크립트가 호출.자바스크립트는 XMLHttpRequest 객체를 사용하여 서버로 요청을 보냄.서버는 전달 받은 XMLHttpRequest 객체를 가지고 요청을 처리.서버는 처리한 결과를 HTML, XML 또는 JSON 형태의 응답 데이터를 생성 및 웹 브라우저에 전달.이때 전달되는 응답은 ..

브라우저를 통해 웹을 이용해 온 우리에게 URL이라는 단어는 익숙할 것이다. 하지만 가끔 뭔가 비스무리하면서도 다른 듯한 URI나 URN이라는 단어를 사용하기도 하는데 이번 포스트에서는 URL과 URI, URN의 명확한 차이에 대해 알아보려 한다.   위 그림에서 볼 수 있듯 URI는 URN과 URL을 포함하는 개념이다. 이들의 각 뜻은 다음과 같이 정의할 수 있다.    URI: 자원의 식별자URL: 위치(Location)URN: 이름(Name)      URI(Uniform Resource Identifier) 통합 자원 식별자(Uniform Resource Identifier)는 인터넷에 있는 자원을 어디에 있는지 자원 자체를 식별하는 방법이다.Uniform: 리소스를 식별하는 통일된 방식Resou..

개발자 도구의 네트워크 창에서 서버로부터 다운 받은 파일을 눌러 보면 아래와 같이 Headers 탭에 적혀 있는 것을 본 적 있을 것이다. 이는 클라이언트와 서버 간에 HTTP 메시지를 통해 통신한 이력이라고 이해할 수 있다.  Request Headers는 클라이언트가 서버에 보내는 HTTP 메시지 이력이며, Response Headers는 서버가 클라이언트에 응답하는 HTTP 메시지 이력이다.    HTTP 메시지 구조 HTTP 메시지는 기본적으로 위에서부터 차례대로 시작 라인(Start Line), 헤더(Header), 공백 라인(Empty Line 또는 Blank Line), 바디(Message Body)로 구성되어 있다. 이중 공백 라인의 경우 HTTP 메시지 값 구분을 하기 위한 라인이므로 단..