lodash 메소드 중 delay 메소드에 대하여 알아봅니다.# lodash method, delaylodash 메소드 중 하나인 delay는 일정 시간을 지연시킨 후 특정 함수를 실행할 수 있는 메소드입니다. setTimeout처럼 동작하는 함수를 간단하고 쉽게 만들 수 있죠. 먼저 간단한 문법은 아래와 같습니다._.delay(function, delayTime, arguments)이 때 다음과 같이 세 가지 인자 function, delayTime, arguments를 전달할 수 있으며 각각 아래의 목적으로 사용됩니다.function : 시간 지연 뒤 실...
css 스타일 속성 중 하나인 inset에 대하여 알아보려고 합니다. inset은 무엇이고 언제 사용할 수 있는지 아래에서 알아보세요.#css 속성 inset은?inset은 태그 요소의 위치를 결정하는 top, right, bottom, left의 축약 스타일 속성입니다. 즉 상하좌우를 각각의 css 속성으로 설정하지 않고 inset 하나만 사용하는 것이 가능합니다. 사실 inset을 사용하지 않더라도 top, right, bottom, left 등을 사용할 수 있겠습니다.@ 활용 팁자주 사용되지는 않지만 특정 엘리먼트의 위치를 조정하기 위한 방법 중 하나로 사용될 ...
안녕하세요 ~ 오늘은 자바스크립트에서 배열처럼 사용하는 set에 대하여 알아보려고 합니다. 간략하게 set은 무엇이고 배열과의 차이점은 무엇인지 알아볼께요!# set은 무엇인가?그럼 가장 먼저 set은 무엇일까요? 자바스크립트에서 set은 ES 6에서 처음 소개되었으며 새로운 형태의 데이터 타입으로 사용되는 객체입니다.@ 배열처럼 사용하는 set자바스크립트에서 set을 사용하다 보면 배열과 비교되고는 합니다. 왜 그럴까요? 실제로 사용해보면 배열과 크게 다르지 않기 때문입니다. 문법의 차이점과 동일한 값을 가지지 않는다는 점만 제외한다면 사실 set이 반드시...
React의 state 상태 관리를 변경하기 위해서 setState를 사용할 수 있습니다. 이때 비동기, async로 setState를 호출하려면 어떻게 해야 하는지 알아봅니다.# 비동기로 setState() 호출하기, async먼저 비동기 setState()를 호출하기 위해서 아래에서는 다음의 방법을 사용하려고 합니다.async, await, Promise모두 비동기식 호출에 사용되는 API들입니다. async와 await는 페어로 함께 사용되며 Promise 객체 역시 업데이트 후 다음 코드로 이동, resolve하기 위해서 필요합니다.이제 아래에서 순서대로 알아...
React에서 데이터를 사용하고 추가 및 변경할 수 있는 state에 대하여 알아봅니다.# React state 알아보기컴포넌트에서 데이터를 선언하고 변경하기 위해 state를 사용합니다. state의 값을 변경하면 화면 뷰의 렌더링에도 함께 반영되게됩니다. 즉 값이 변경될 수 있는 컴포넌트 내부 데이터에는 state를 사용합니다.멈저 컴포넌트에서 state에 값을 최초 선언하는 방법입니다.class myApp extends components { constructor() { super(); // ...
자바스크립트를 사용하여 스톱워치, 타이머 기능의 함수를 만들어보려고 합니다. 아래에서 자세히 알아봅니다# 자바스크립트로 타이머, 스톱워치 함수 만들기먼저 이 기능은 언제 필요할까요? 간단하게 나열하면 다음과 같습니다.- 함수를 호출시 너무 빠른 간격으로는 호출하지 않을 경우(Debounce 설정)- 정해진 시간 뒤에 함수를 호출할 경우그럼 전체 소스 코드를 먼저 살펴봅니다.@ timer.jsstartTimer = function(_time) { let _oriTime = _time; return function _timerFunc(_nextTim...
VueJS에서 setTimeout() 타이머 함수를 만드는 방법을 알아봅니다. 어떻게하면 될까요?# VueJS setTimeout() 함수 만드는 방법물론 VueJS에서도 setTimeout()을 사용할 수 있습니다. 자바스크립트이므로 당연히 동작합니다. 하지만 VueJS의 모델에 접근할 수 없으므로 내장함수가 있다면 이를 사용하거나 아니면 다른 방법을 사용해야하죠.하지만!!!타이머 함수를 위한 내장함수가 별도로 존재하지 않으며 setTimeout()을 사용하여 해당 vue의 scope에 접근할 수 있는 방법이 존재합니다. 이 경우 두 가지 방법이 있는데요~ 아래에서...
CSS property 중 하나인 all에 대하여 알아봅니다. CSS에서 all은 무엇이고 언제 사용할까요?# CSS property all 알아보기CSS 프로퍼티인 all은 부모로부터 전달받거나 현재 자신이 가지고 있는 모든 CSS 속성을 제거할 수 있도록 도와줍니다. 선택 가능한 값으로 아래와 같이 세 가지가 있습니다.initial : 초기값으로 설정됨inherit : 부모 상속된 스타일만 적용됨unset : 초기 및 부모 스타일 속성 모두를 제거함이를 사용하면 현재 적용되있는 스타일을 한번에 제거할 수 있어 매우 유용합니다. 특히 브라우저가 가진 스타일...
react native에서 타이머 함수를 만드는 방법을 알아봅니다.먼저 react native에서의 타이머 함수는 다른 메소드를 사용하지 않고 동일하게 자바스크립트를 사용합니다. 다만 react native에서는 EC 6로 콜백함수를 호출해야만 현재 scope를 this에 함께 바인딩하는 것이 가능합니다. 아래는 간단한 예제로 2초 후 메시지를 출력합니다.setTimeout(() => { alert('Hi');}, 2000); arrow 함수를 사용한 부분을 제외하면 기존의 자바스크립트와 동일하게 사용합니다. ...
Python에서 redis를 데이터베이스로 사용하는 경우 get() 또는 hget()을 사용하여 값을 불러오거나 저장하게된다. 이때 만약 hget()을 사용한다면 어떻게 저장하고 불러와서 보여줄 수 있을지 알아보자. 또한 이 둘의 차이점 역시 아래에서 알아본다.# get() 그리고 hget() 차이점먼저 hget()은 hashget으로 get()과는 다르다... get()은 set()과 함께 사용하며 set()을 사용해 key에 매칭하는 값을 string인 문자열로 저장하고 get()으로 불러온다. 반면 hget()은 객체처럼 동작하는 redis 하나의 타입으로 hs...