자바스크립트

런타임소스코드가 순차적으로 실행되는 시점을 말한다.변수 호이스팅자바스크립트 엔진은 변수 선언이 어디 있는 상관없이 다른 코드보다 먼저 실행한다. 즉, 변수 선언문이 끌어 올려진 것처럼 동작하는 특징을 변수 호이스팅이라고 한다.아래의 예를 보자위에서 설명한 변수 호이스팅

예를들어 아래와 같은 코드를 보자.하지만 내 예상과는 다르게 string으로 출력이 되었다.이게 왜 이럴까 하며 javascript에 대해 공부를 해보았다. 그 이유는 바로 원시값은 변경 불가능한 값!!!이기 때문이었다.먼저 문자열은 유사배열객체 이면서 이터러블 이므로

지난 번에 원시 값에 대해 공부해 보았다. 이와 밀접한 관련이 있는 객체에 대해 알아보자!원시 값 vs 객체(참조 값)원시 값: 원시 값을 할당한 변수가 기억하는 메모리 주소를 통해 메모리 공간에 접근하면 원시 값에 접근할 수 있다. 즉, 원시 값을 할당한 변수는 원

식별자(변수나 함수, 클래스 이름 등)가 유효한 범위스코프를 통해 식별자의 충돌을 방지할 수 있다.코드는 전역과 지역으로 구분할 수 있다.1.블록 레벨 스코프 범위 결정: {..} (ES6의 화살표 함수는 블록 스코프로 취급된다.)2.함수 레벨 스코프 범위 결정: 함

자바스크립트 엔진의 구현 알고리즘을 설명하기 위해 ECMAScript 사양에서 사용되는 의사 프로퍼티와 의사 메서드이며 \[...] 이중 대괄호로 감싼 이름들이 내부슬롯과 내부 메서드다.개발자가 직접 접근할 수 없다. 일부 내부 슬롯과 내부 메서드에 한해 간접적인 접근

new 연산자와 함께 호출하여 객체(인스턴스)를 생성하는 함수를 말한다.일반 함수와 기술적인 차이는 없지만 생성자 함수는 함수 이름의 첫 글자는 대문자로 시작 해야하고 반드시 'new' 키워드로 호출해야 한다.인스턴스 : 생성자 함수에 의해 생성된 객체메서드 : 자바스

프로그래밍 언어의 함수는 일련의 과정을 문으로 구현하고 코드 블록으로 감싸서 하나의 실행단위로 정의한 것이다.코드의 재사용을 높일 수 있다!기본적인 내용은 나중에 추가하기로 하자.자바스크립트에서 함수는 일급객체로 취급한다.무명의 리터럴로 생성 가능하다. 즉, 런타임에

들어가기에 앞서... > 자바스크립트는 명령형, 함수형, 프로토타입 기반, 객체지향 프로그래밍을 지원하는 멀티 패러다임 언어다. --> 프로토타입 기반의 객체지향 프로그래밍 언어이다! 추가적으로 객체지향 프로그래밍에 대해서는 해당 포스트를 참고하길 바란다. 용어 정리

자바 스크립트의 동작 원리를 담고 있는 핵심 개념.4가지 소스코드를 구분한 이유는 이에 따라 실행 컨텍스트 생성 과정과 관리 내용이 다르기 때문이다.자바스크립트 엔진은 소스코드를 2개의 과정 소스코드의 평가와 실행 과정으로 나누어 처리한다. 1) 소스코드 평가 : 소스

내 생각으로는클로저를 이해하기 전 스코프와 실행컨텍스트 개념이 선행 된다면 클로저를 이해하기 편할 것 같다.정의 : 클로저는 함수와 그 함수가 선언된 렉시컬 환경과의 조합이다. (출처: mdn)이렇게만 보니 처음에는 이게 무슨 말인가 했다.하지만 계속 찾아보고 알아보

클래스 Class는 객체를 생성하기 위한 템플릿으로 클래스는 데이터와 이를 조작하는 코드를 하나로 추상화한다. 클래스는 객체를 만들기위한 생성자 함수를 포함하며 new 키워드가 실행되면 생성자 함수가 실행 되며 변수에 클래스의 설계를 가진 인스턴스가 할당된다. 클래스는

ES6 이전의 모든 함수는 일반 함수로서 호출할 수 있는 것은 물론 생성자 함수로서 호출할 수 있었다.(객체에 바인딩된 메서드도 일반함수 호출, 생성자 함수로 호출이 가능 등..)하지만 이는 사용 목적에 따라 명확한 구분이 없으므로 혼란스러우며 실수를 유발 할 수 있다

정규 표현식은 문자열을 대상으로 패턴 매칭 기능을 제공한다. 패턴 매칭 기능이란 특정 패턴과 일치하는 문 자열을 검색하거나 추출 또는 치환할 수 있는 기능을 말한다.정규 표현식 객체(RegExp 객체)를 생성하기 위해서는 정규 표현식 리터럴과 RegEXp 생성자 함수를

순회 가능한 데이터 컬렉션(자료구조)을 만들기 위해 ES6에 도입 되었다.ES6 에서는 순회 가능한 데이터 컬렉션을 이터레이션 프로토콜을 준수하는 이터러블로 통일하여 for...of문, 스프레드 문법, 배열 디스트럭처링 할당의 대상으로 사용할 수 있도록 일원화 하였다.

이터러블에 사용할 수 있다. 이터러블 참고 링크... 은 하나로 뭉쳐 있는 여러 값들의 집함을 펼쳐서 개별적인 값들의 목록으로 만든다.연산자가 아니므로 스프레드 문법의 결과는 값이 아니며 변수에 할당할 수 없다.Rest 파라미터는 함수에 전달된 인수들의 목록을 배열로

Set 객체는 배열과 다음과 같은 차이가 있다.1\. 동일한 값을 중복할 수 없다.2\. 요소 순서에 의미가 없다.3\. 인덱스로 요소에 접근할 수 없다.Set 생성자 함수는 이터러블을 인수로 전달받아 Set 객체를 생성한다. 이때 이터러블의 중복된 값은 Set 객체에

임시

브라우저가 HTML, CSS, 자바스크립트 파일로 작성된 텍스트 문서를 어떻게 파싱하는지 알아보자.파싱 parsing파싱은 프로그래밍 언어의 문법에 맞게 작성된 텍스트 문서를 실행하기 위해 텍스트 문서의 문자열을 토큰으로 분해하고, 파스 트리를 생성하는 과정을 말한다.

자바스크립트 엔진은 단 하나의 실행 컨텍스 스택을 갖는다.그러므로 싱글 스레드 방식으로 동작한다.한번에 하나의 태스크만 실행할 수 있기 때문에 처리에 시간이 걸리는 태스크를 실행하는 경우 블로킹(작업중단)이 발생한다.이와 같은 방식을 동기 처리라고 한다. 동기 처리 방

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

REST는 “Representational State Transfer”의 약자로 자원을 이름(자원의 표현)으로 구분하여 해당 자원의 상태(정보)를 주고 받는 모든 것을 의미REST API는 웹에서 사용되는 데이터나 자원(Resource)을 HTTP URI로 표현하고,

동기 : 특정 코드의 실행이 완료될 때까지 기다리고 난 후 다음 코드를 수행하는 것비동기 : 특정 코드의 실행이 완료될 때까지 기다리지 않고 다음 코드들을 수행하는 것비동기 함수(setTimeout 등..)를 호출 시 함수 내부의 비동기로 동작하는 코드가 완료되지 않아

fetch 함수 > HTTP 요청 전송 기능을 제공하는 클라이언트 사이드 Web API다. XMLHttpRequest 객체보다 사용법이 간단하다. 프로미스를 지원하기에 비동기 처리를 위한 콜백 패턴의 단점을 커버한다. HTTP 응답을 나타내는 Response 객체를

에러가 발생하지 않는 코드를 작성하는 것은 불가능하기에 항상 대처할 수 있도록 준비를 해야한다.예외적인 상황이 발생하면 반환 값 (null 또는 -1)을 if 문이나 단축 평가 또는 옵셔널 체이닝 연사자를 통해 처리하는 방법에러처리 코드를 미리 등록해 두고 에러 발생시

들어가기전...웹을 개발하다보면 다양한 확장자의 파일을 만들게 된다. 이렇게 다양한 소스는 웹 어플리케이션을 무겁게 만든다. 통신이 있을 때마다 이 소스들을 로딩하는 작업은 고비용이다.만약 많은 JS 패키지를 사용하다보면 예상하지 못한 충돌로 인해 어플리케이션이 깨지게