본문 바로가기

반응형

Frontend

(29)
[JavaScript] 코어 자바스크립트 7장 - 클래스 아래 책을 읽고 정리한 내용입니다. http://www.yes24.com/Product/Goods/78586788 코어 자바스크립트 - YES24자바스크립트의 근간을 이루는 핵심 이론들을 정확하게 이해하는 것을 목표로 합니다최근 웹 개발 진영은 빠르게 발전하고 있으며, 그 중심에는 자바스크립트가 있다고 해도 결코 과언이 아니www.yes24.com 💡 자바스크립트의 클래스를 이해하기 위해서는 프로토타입의 이해가 우선되어야 한다. 자바스크립트에서의 클래스자바스크립트는 프로토타입 기반 언어이므로 클래스의 개념이 존재하지 않는다.그저 프로토타입을 클래스의 관점에서 접근해 상속 흉내를 것이다.프로토타입 체이닝에 의한 참조를 상속으로 이해하는 것이다. 예시를 통해 자세히 알아보자. 아래 Array와 arr를 클래..
[JavaScript] 코어 자바스크립트 6장 - 프로토타입 아래 책을 읽고 정리한 내용입니다. http://www.yes24.com/Product/Goods/78586788 코어 자바스크립트 - YES24 자바스크립트의 근간을 이루는 핵심 이론들을 정확하게 이해하는 것을 목표로 합니다최근 웹 개발 진영은 빠르게 발전하고 있으며, 그 중심에는 자바스크립트가 있다고 해도 결코 과언이 아니 www.yes24.com 💡 프로토타입 기반 언어인 자바스크립트에서는 객체를 원형으로 삼고 이를 참조함으로써 상속과 비슷한 효과를 얻는다. 프로토타입 개념 이해하기 new 연산자로 Constructor를 호출하면 인스턴스가 만들어지는데, 이 인스턴스의 프로퍼티인 __proto__는 Constructor의 prototype을 참조한다. 생성자 함수의 prototype에 어떤 메서드가..
[JavaScript] 코어 자바스크립트 5장 - 클로저 아래 책을 읽고 정리한 내용입니다. http://www.yes24.com/Product/Goods/78586788 코어 자바스크립트 - YES24 자바스크립트의 근간을 이루는 핵심 이론들을 정확하게 이해하는 것을 목표로 합니다최근 웹 개발 진영은 빠르게 발전하고 있으며, 그 중심에는 자바스크립트가 있다고 해도 결코 과언이 아니 www.yes24.com 💡A closure is the combination of a function and the lexical environment within which that function was declared. 클로저란? 클로저는 여러 함수형 프로그래밍 언어에서 등장하는 보편적인 특성이다. MDN에 따르면, 클로저란 함수와 그 함수가 선언될 당시의 lexical e..
[JavaScript] 코어 자바스크립트 4장 - 콜백 함수 아래 책을 읽고 정리한 내용입니다. http://www.yes24.com/Product/Goods/78586788 코어 자바스크립트 - YES24 자바스크립트의 근간을 이루는 핵심 이론들을 정확하게 이해하는 것을 목표로 합니다최근 웹 개발 진영은 빠르게 발전하고 있으며, 그 중심에는 자바스크립트가 있다고 해도 결코 과언이 아니 www.yes24.com 💡콜백 함수를 통해 자바스크립트의 비동기 처리 발전 과정을 이해할 수 있다. 콜백 함수란? 콜백 함수는 다른 코드(함수 또는 메서드)의 인자로 넘겨줌으로써 그 제어권도 함께 위임한 함수이다. 콜백 함수의 제어권을 넘겨받은 코드는 콜백 함수 호출 시점에 대한 제어권을 가진다. 콜백 함수는 함수다. 콜백 함수로 어떤 객체의 메서드를 전달하더라도 그 메서드는 함..
[JavaScript] 코어 자바스크립트 3장 - this 아래 책을 읽고 정리한 내용입니다. http://www.yes24.com/Product/Goods/78586788 코어 자바스크립트 - YES24 자바스크립트의 근간을 이루는 핵심 이론들을 정확하게 이해하는 것을 목표로 합니다최근 웹 개발 진영은 빠르게 발전하고 있으며, 그 중심에는 자바스크립트가 있다고 해도 결코 과언이 아니 www.yes24.com 💡상황별로 this가 어떻게 달라지는지, 왜 그렇게 되는지 이해할 수 있다. 그리고 예상과 다른 대상을 바라보고 있을 경우 그 원인을 효과적으로 추적하는 방법을 알 수 있다. 상황에 따라 달라지는 this 자바스크립트에서 this는 기본적으로 실행 컨텍스트가 생성될 때(실행 컨텍스트의 ThisBinding에서) 함께 결정된다. 일반적으로 실행 컨텍스트는 함..
[JavaScript] 코어 자바스크립트 2장 - 실행 컨텍스트 (feat. 호이스팅, 스코프 체인) 아래 책을 읽고 정리한 내용입니다. http://www.yes24.com/Product/Goods/78586788 코어 자바스크립트 - YES24 자바스크립트의 근간을 이루는 핵심 이론들을 정확하게 이해하는 것을 목표로 합니다최근 웹 개발 진영은 빠르게 발전하고 있으며, 그 중심에는 자바스크립트가 있다고 해도 결코 과언이 아니 www.yes24.com 💡실행 컨텍스트를 정확하게 알면 자바스크립트의 동작 방식을 이해할 수 있다. 특히 호이스팅과 스코프 체인에 대해 이해할 수 있다. 실행 컨텍스트란? 실행 컨텍스트는 실행할 코드에 제공할 환경 정보들을 모아놓은 객체로, 일반적으로 함수를 실행(호출)할 때 구성된다. 함수가 호출되면, 해당 함수에 필요한 환경 정보들을 모아 컨텍스트를 구성하고, 이를 콜 스택에..
[JavaScript] 코어 자바스크립트 1장 - 데이터 타입 아래 책을 읽고 정리한 내용입니다. http://www.yes24.com/Product/Goods/78586788 코어 자바스크립트 - YES24자바스크립트의 근간을 이루는 핵심 이론들을 정확하게 이해하는 것을 목표로 합니다최근 웹 개발 진영은 빠르게 발전하고 있으며, 그 중심에는 자바스크립트가 있다고 해도 결코 과언이 아니www.yes24.com 💡 자바스크립트가 데이터를 처리하는 과정을 통해 기본형과 참조형 타입이 서로 다르게 동작하는 이유를 이해할 수 있다. 데이터 타입의 종류자바스크립트의 데이터 타입은 크게 두 가지가 있다.기본형 (Primitive Type)Number, String, Boolean, null, undefined, Symbol참조형 (Reference Type)Object (Ar..
[Cypress] Cypress 도입기 (feat. MSW) 개요 이번달 초, 회사에서 운영 중인 서비스에 E2E 테스트 도입을 위해 Cypress 공부를 시작했다. 그동안 테스트 코드에 대한 관심은 있었지만 막상 시작할 엄두를 못 냈는데, 이렇게 실제 서비스에 적용할 수 있는 기회가 주어져 좋았다! 새로운 것을 시작할 때의 설렘 때문인지, 퇴사 전 마지막 임무가 주어진 느낌이라 그런지 왠지 더 잘하고 싶었다. 아무튼 테스트 코드에 대해 무지한 상태로 약 20일 간 공부하면서 Cypress를 적용했고, 어느 정도 돌아가는(?) 코드가 나온 시점에서 그 과정을 정리해보려고 한다. Cypress와 MSW Cypress? 모던 웹을 위한 프론트엔드 테스팅 툴로, E2E 테스트에 최적화되어 있다. 테스트란 서비스가 요구사항에 맞는지 검증하는 행위이고, E2E 테스트란 사..

반응형