분류 전체보기(472)
-
javascript 33가지 기본 컨셉: 1. CallStack
javascript 33가지 기본 컨셉: 1. CallStack 항상 애용하고 있는 노마더코드 니콜라스 선생님이 새로운 강의를 시작하셨는데 나름 흥미가는 주제라 하루에 하나씩( 진짜 특별한 일이 없으면 이를 지킬려고 노력할 것이다.) 포스팅할 것이다. 나도 다른 사람의 강의 혹은 깃을 보고 하는 거라서 url을 첨부해놓는다. youtube: https://www.youtube.com/watch?v=QkFkFqg-J04 git: https://github.com/leonardomso/33-js-concepts 자바스크립트에서는 함수를 실행할 때 Stack에 저장하여 실행한다. 그래서 CallStack이라고 부르는 것 같습니다. Stack 이란? 바닥이 막혀있고 윗 구멍을 통해 차곡 차곡 쌓이는 구조이다. ..
2019.03.15 -
ReactHooks (Custom Hooks) 사용하기
ReactHooks (Custom Hooks) 자기가 커스텀한 hooks을 만들어 함수나 state의 추가 생성없이 간단하게 만들 수 있습니다. 자신만의 hooks를 만들어 이전에 react의 단점들을 가볍게 보완할 수 있을 것 같습니다. ex) datafetch, form input 태그 주의할 점 1. 커스텀 hook의 이름은 use를 꼭 붙여주자!!자동적으로 규칙이 맞는지 확인하지 못합니다. 특정 함수에 hook이 호출되는지 알 수 없습니다. 2. 각 input별로 같은 함수를 이용하지만 같은 state를 공유하는 것이 아닙니다. hook은 state적인 특성을 갖고있어서 공유하지 않습니다. 완전히 독립적입니다. 예제 코드 import React, { useState, useEffect } from..
2019.02.25 -
React hooks(UseEffect) 사용하기
React hooks(UseEffect) 사용하기 저번에는 useState를 사용하는 방법을 알아봤습니다. 이번에는 UseEffect를 사용해보겠습니다. 부족한 영어 실력으로 document를 읽어 보고 있는데 간단히 생각하면 ComponentDidMountComponentDidUpdateComponentWillUnMount가 작동할 때 함수들이 한번에 사용할 수 있게 만들어 준 것이 useEffect입니다. Dom이 업데이트되거나, state가 바뀐 뒤 useEffect가 실행됩니다. Hooks 규칙 1. 리액트 함수의 제일 상단에 작성해야합니다. - 조건문, 내부 함수, 반복문 안에 사용하지 않습니다. 2. 리액트 함수 안에서만 사용합니다. - custom 함수 안에서는 예외적으로 호출 할 수 있습니..
2019.02.25 -
React hooks(UseState) 사용하기
React hooks 사용해보기 react hooks는 리액트 16.8부터 새로생긴 기능이다. react에서 평소에 state를 관리해주기 위해 ComponentDidMount ComponentWillMount등과 같은 내장 함수를 사용했습니다. 그리고 이러한 내장함수와 state를 사용하기 위해서는 무조건 Class를 사용했어야 했습니다. 하지만 hooks부터는 클래스를 사용하지 않고도 함수 형태로 state를 관리할 수 있습니다. 그리고 ComponentDidMount나 ComponentWillMount 등을 사용하지 않고도요. 요약하자면 클래스 없이 함수의 형태로 state를 다루고 관리할 수 있다. 입니다. 그렇게 된다면 완전한 함수형 프로그래밍이 가능하게 될 것입니다. 그럼 간단한 사용기를 올려..
2019.02.25 -
[디자인 패턴] Mediator Pattern
Mediator Pattern Mediator를 영어로는 중개자라는 뜻이다. 객체사이의 복잡한 통신들을 중지시키고 Mediator에게 중재를 시켜 처리를 정리합니다. 특히 GUI 프로그래밍에 자주 쓰입니다. 사용될 상황 1. 객체들 끼리 통신은 잘되지만 복잡한 방법으로 될때2. 객체를 재사용하는 것은 다른 많은 객체들끼리 연관되어 있기 때문에 어려울 때 3. 객체의 동작들이 분산되어서 사용하기 어려울 때. 파일 구조 UML Mediator.javapublic interface Mediator{ public abstract void publishMessage(User sender, String message, User receiver); public abstract void addUser(User rece..
2019.02.13 -
[디자인 패턴] Memento Pattern
Memento Pattern Memento Pattern은 인스턴스의 상태를 되돌리고 싶을 때 그 전의 인스턴스를 저장하고 있어야한다. 하지만 과거의 상태로 되돌리려면 클래스에 마음대로 접근할 수 있어야합니다. 그런데 잘못된 접근을 하게 된다면 의존 되어있는 코드가 여기저기 흩어지게 됩니다. 이러한 상태를 캡슐화의 파괴라고합니다. 캡슐화의 파괴를 일으키지 않고 상태(이전의 인스턴스)를 저장하게 해주는 패턴을 Memento Pattern이라고 합니다. - 상태를 저장하여 필요할때 마다 바꿔주고 다시 저장한다. 예시 프로그램으로 텍스터나 ide 등에서 ctrl + z 나 command + z를 통해 과거의 상태로 돌아갈 수 있게 해줍니다. 이러한 상황에서도 보통 Memento Pattern을 사용하게 됩니다..
2019.02.12