본문 바로가기
LocalStorage & SessionStorage 1. LocalStorage 데이터를 서버에 저장 및 전송하지 않고, 브라우저에 저장합니다. HTML5부터 사용가능 cookie 는 4 kb 가 최고 용량이지만, localstorage는 2.5 ~ 5 mb 까지 저장 가능합니다. localStorage의 storage 이름에 제약은 없습니다. localStorage는 string만 저장할 수 있습니다. JS 객체로 저장할 필요가 있는경우, JSON.stringify() 를 이용합니다. 다시 JSON을 객체로 사용하기 위해서는 JSON.parse() 를 이용하여 변경합니다. // storage에 값을 set 합니다. localStorage.setItem("lastname", "Smith"); localStorage.test = '123'; // stora.. 2020. 5. 9.
ES6 문법 (2) 더보기 7. Destructing 1) Array 2) Object 3) JSON parsing 4) Event 객체 전달 8. Template 1) Tagged Tamplate literals 9. Module 1) export 2) import 10. Proxy 7. Destructing 1) Array에서 let data = ["crong", "honux", "jk", "hinny"]; // 기존 ES5 방법 let myname = data[0]; let jisu = data[0]; // ES6 let [jisu,,jung] = data; // jisu = data[0], jung = data[2] console.log(jisu, jung); // "crong", "jk" 2) Object에서 ke.. 2020. 5. 9.
Vuex 구조 및 정리 1. 상태관리자 Flux architecture Flux 는 facebook이 제작한 내부적으로 하나의 스토어로 데이터를 관리하는 모델. 상태관리자를 사용하는 것도 항상 옳은 것은 아닙니다. state가 하나(공유된상태) 이기 때문에 하나를 잘못 바꿀경우 복잡해질 수도 있습니다. 종류) React - redux, Vue - vuex 2. Vuex 기본 구조 store component script내 등록 위치 동작/변경 방법 $store 호출방식 비고 state ...mapState computed this.$store.state 저장된 상태 getters ...mapGetters computed this.$store.getters state를 화면에 바인딩 할 수 있음 actions ...mapMuta.. 2020. 5. 7.
ES6 문법 (1) - 수정중 더보기 1. new String Method – ES6 전용 1) starts with, endsWith(), include() 2. Array 1) for of 2) spread operator 와 활용 3) from() 3. Obejct 1) df 2) class 3) Object.assign() - object 제작 4) Object.assign() - immutable 객체 제작 5) setPrototypeOf() 6) prototype chain 활용 4. Function 1) Arrow function 2) Arrow function – this context 3) default parameters 4) rest parameters 5. Set, WeakSet – 특별한 자료구조 1) Set .. 2020. 5. 4.