Jerry

이번 시간은 promise(프라미스 / 프로미스)에 대해서 알아보는 시간을 가지겠다. JAVASCRIPT.INFO를 참고하여 정리를 해보았다! promise promise 객체는 다음과 같은 문법으로 만들 수 있다. let promise = new Promise(function(resolve, reject) { // executor (제작 코드, '가수') }); new Promise에 전달되는 함수는 executor(실행자, 실행 함수)라고 부른다. executor는 new Promise가 만들어질 때 자동으로 실행되며 인수로 resolve와 reject라는 자바스크립트 자체적으로 제공하는 콜백을 즉각적으로 반드시 호출해야 한다. resolve(value)는 에러 없이 성공적으로 일이 끝날 때, val..

필자는 리덕스에 대한 코드 스테이츠 과정에서 리덕스에 대해서 학습하였지만 코드로 구현하는 부분과 리덕스 코드를 이해하는 부분이 부족하다고 느껴져 '인프런에서 제로초님의 'Redux vs MobX (둘 다 배우자!)'라는 유료 강의를 결제해 공부하고 있다. 강의 특성상 MobX 내용이 포함되어 있지만, 시간 관계상 redux에 관한 내용 위주로 학습하려고 한다. 이 글의 목적은 강의를 수강하면서 학습한 내용을 이해 및 정리하고자 이렇게 글을 적게 되었다. 이번 기회를 통해 리덕스에 대해 제대로 이해해보고 프로젝트에서 사용한 리덕스 코드도 같이 이해하려고 한다. (프로젝트 관련한 내용은 언급하지 않습니다) 아래 이미지에 대해서 알아보자 💪🧐💪🧐💪🧐 store 리덕스는 store 중심으로 생각하는 게 좋다고 ..

필자는 리덕스에 대한 코드 스테이츠 과정에서 리덕스에 대해서 학습하였지만 코드로 구현하는 부분과 리덕스 코드를 이해하는 부분이 부족하다고 느껴져 인프런에서 제로초님의 'Redux vs MobX (둘 다 배우자!)'라는 유료 강의를 결제해 수강하고 있다. 강의 특성상 MobX 내용이 포함되어 있지만, 시간 관계상 redux에 관한 내용 위주로 학습하려고 한다. 이 글의 목적은 강의를 수강하면서 학습한 내용을 이해 및 정리하고자 이렇게 글을 적게 되었다. 이번 기회를 통해 리덕스에 대해 제대로 이해해보고 프로젝트에서 사용한 리덕스 코드도 같이 이해하려고 한다. 리덕스의 필요성 리액트를 활용한다면 무조건 리덕스를 사용해야 한다는 것은 아니라고 한다. 리덕스와 몹엑스는 리액트와 상관없다고 한다. 리덕스는 상태관..

이번 시간은 이벤트 등록, 이벤트 버블링, 이벤트 캡처링, 이벤트 흐름, 이벤트 위임에 대해서 알아보겠습니다. 1. 이벤트 등록 이벤트 버블링, 캡쳐, 위임에 알아보기 위해 우리는 먼저 이벤트 등록에 대해서 알고 있어야 합니다. 이벤트 등록이란 웹 애플리케이션에서 사용자의 입력을 받기 위한 기능입니다. 아래 코드 예시에서 addEventListener를 이용하여 이벤트를 등록할 수 있습니다. click! 클릭 시, 해당 이벤트 내용이 콘솔에 찍히는 걸 확인할 수 있습니다. 추가로, 만약에 핸들러를 제거 해주고 싶다면, 어떻게 해야 할까요? 그럴 때는 '이벤트 등록'했던 것과 비슷하게 '이벤트 해제' 혹은 '이벤트 제거'를 해줘야 합니다. removeEventListener를 같은 단계에 두고 사용하시면 ..

이 글은 인프런, Javascript 핵심 개념 알아보기 - JS Flow, 정재남 강의를 수강하면서 정리한 내용입니다. 오늘 함수 선언문과 함수 표현식에 대해서 알아보자! 💪😎💪😎💪😎💪😎💪😎💪😎💪😎 함수 선언문과 함수 표현식의 대해 살펴보겠다. 이전의 브라우저에서는 디버깅을 할 때, 기명 함수 표현식은 해당 변수명에 값을 할당하여 보여주어서 익명 함수 표현식 보다 분명한 이점이 존재하였다고 한다. 하지만, 최근에 이르러 브라우저에서, (익명 함수 표현식도) 변수명이 비어 있을 경우, 자동으로 변수명을 할당하기 때문에 이제 기명 함수 표현식을 잘 쓰지 않는다고 한다. 선언한 함수를 변수에 할당한다. 이것이 함수 표현식의 개념이다. 할당 여부에 따라, 함수 선언문과 함수 표현식의 차이가 생긴다. 할당을 하..

이 글은 인프런, Javascript 핵심 개념 알아보기 - JS Flow, 정재남 강의를 수강하면서 정리한 내용입니다. 오늘 데이터 타입에 대해서 알아보자! 오늘도 데이터 타입을 정복하러 가보자! 💪😎💪😎💪😎💪😎💪😎💪😎💪😎 자바스크립트 데이터 타입은 Primitive Type과 Reference Type으로 분류한다. (기본형 타입 / 참조형 타입) 기본형에는 Number, String, Boolean, null, undefined 참조형에는 Object가 대표적으로 있고, 하위에 Array, Function, RegExp .. 등이 존재한다. 구분하는 이유가 무엇이고 어떤 차이가 있는지 메모리와 함께 살펴보겠다. 기본형 타입의 메모리 흐름 변수를 선언하면 컴퓨터는 메모리가 담길 공간을 미리 확보하고 ..

이 글은 인프런, Javascript 핵심 개념 알아보기 - JS Flow, 정재남 강의를 수강하면서 정리한 내용입니다. 오늘 클래스에 대해서 알아보자! 오늘도 클래스를 정복하러 가보자! 💪😎💪😎💪😎💪😎💪😎💪😎💪😎 1. 클래스 클래스는 인스턴스라는 용어와 같이 나온다. 인스턴스는 어떤 클래스의 속성을 지니고 있는 구체적인 객체 및 대상을 의미한다. 클래스상에도 상위 클래스 / 하위 클래스로 나뉠 수 있다. 아래 이미지처럼. 자바스크립트는 프로토타입 언어라고 하지만, 일단은 여기서는 인스턴스를 제외한 나머지를 클래스로 보자! 일반적인 클래스의 정의는 인스턴스를 생성하는 데에 보조하는 역할을 한다. Array에 있는 애들을 static methods, static properties라고 하는데, 얘네들은 클..

이 글은 인프런, Javascript 핵심 개념 알아보기 - JS Flow, 정재남 강의를 수강하면서 정리한 내용입니다. 오늘 프로토타입에 대해서 알아보자! 오늘도 프로토타입을 정복하러 가보자! 💪😎💪😎💪😎💪😎💪😎💪😎💪😎 0. prototype, constuctor, __propto__ 이번 프로토타입 정리 글에서 제목에 보이는 키워드가 자주 등장하니 인사 정도 해봐도 좋을 것 같습니다. 먼저! 아래 이미지가 무엇이냐면... 바로 이것입니다! 우리가 평소에 사용하는 생성자 함수를 가지고 설명을 시작해보겠습니다. 생성자 함수를 new 연산자를 통해서 인스턴스를 만들었을 때, 그 인스턴스에는 constructor의 prototype이라고 하는 프로퍼티의 내용이 __proto__ 프로퍼티로 참조를 전달하게 됩..