g-study

Vuex - 주요기술요소 정리state : 여러 컴포넌트에 공유되는 데이터의 상태 datagetters : 연산된 state 값을 접근하는 속성 computedmutations : state 값을 변경하는 이벤트 로직 - methodsactions : 비동기 처리 로직을 선언하는 메서드 - aysnc methodsex) API Call할 경우 기다렸다가 값을 받을 사용 1. state와 getters 소개가. state 란?여러 컴포넌트 간에 공유할 데이터 - 상태예제1 - (Vue vs Vuex)변수 선언하기// Vue data: { message: 'Hello Vue.js!' } // Vuex state: { message: 'Hello Vuex.js!' } 변수 사용 {{ message }} {{ ..

6.4 웹 워커(Web Worker)6.4.1 웹 워커란?가. 정의백그라운드에서 별도의 thread를 생성하여 별도의 thread로 동작함 single thread의 한계를 극복나. 단점하위 브라우저에서 호환성이 떨어짐 ===> 대중적 사용 불가능다. 특징별도의 thread로 동작하므로 직접 DOM에 접근하지 못함 ===> postMessage(), onmessage() 를 통해 접근 가능 6.4.2 웹 워커 interfacepostMessage()onmessage()worker.terminate();데이터 전송데이터 수신종료postMessage()를 통하여 HTML5와 Worker사이에 데이터를 전송 할 수 있으며, onmessage()를 통하여 HTML5와 Worker사이에 데이터를 받을 수 있다.6..

6.3. DOM과 자바스크립트JS가 DOM을 변경하고 검색할 때, repaint 또는 reflow가 발생하여, 컴퓨팅 자원 소모가 심해진다.6.3.1 DOM repaint가. 정의DOM위치가 변경되지 않고, 스타일이 변경될 때 화면을 다시 그리는 것나. 예제(272p)(function () { document.getElementById("changeBackground").addEventListener('click', function () { this.style.backgroundColor = "black"; this.style.color = "white"; }); document.getElementById("changeVisibility").addEventListener("click", function ..

6.1 단일 스레드 환경6.1.1 자바스크립트 환경가. 단일스레드 환경을 가진 자바스크립트나. 스레드 큐단일스레드 환경에서 지연이 발생을 처리함어떠한 순서로 함수나 기능을 수행할 지 결정목록FIFO (First-In First-Out) 정책을 가지고 있다.6.1.2 setTimeout()가. 사용법setTimeOut(func, time) 지정한 time이 지난 후, func 한번만 이벤트 발생 나. 예제1(250p) (function () { var buttonAddItem = document.getElementById("addItem"); buttonAddItem.onclick = function () { console.log("### 1 버튼클릭"); setTimeout(function () { co..