캐시(cache)란? 자주 사용하는 데이터나 값을 미리 복사해 놓는 임시 장소를 가리킨다. 캐시는 저장 공간이 작고 비용이 비싼 대신 빠른 성능을 제공한다. 캐싱(Caching)이란? 애플리케이션의 처리 속도를 높여 준다. 이미 가져온 데이터나 계산된 결괏값의 본사본을 저장함으로써 처리속도를 향상시키며, 이를 통해 향후 요청을 더 빠르게 처리할 수 있다. 대부분의 프로그램이 동일한 데이터나 명령어를 반복해서 액세스 하기 때문에 캐싱은 효율적인 아키텍처 패턴이다. 웹 캐시(WEB Cache)란? 사용자가 웹사이트(client)에 접속할 때, 정적 컨텐츠(JS, 이미지, CSS)를 특정 위치에 저장하여, 웹 사이트 서버에 해당 콘텐츠를 매번 요청하여 받는 것이 아닌, 특정 위치에서 불러옴으로써 사이트 응답 ..
변수에 값을 저장하는 것을 할당(assignment, 대입, 저장)이라 하며 변수에 저장된 값을 읽어 들이는 것을 참조(reference)라 한다. 그리고 변수명을 자바스크립트 엔진에 알리는 것을 선언(declaration)이라 한다.변수 선언 방식변수의 선언은 var, const, let 키워드로 할 수 있으며 자바스크립트에서 변수 선언은 선언 → 초기화 단계를 거쳐 수행된다.선언 단계: 변수명을 등록하여 자바스크립트 엔진에 변수의 존재를 알린다.초기화 단계: 값을 저장하기 위한 메모리 공간을 확보하고 암묵적으로 undefined를 할당해 초기화한다.var name;console.log(name); // output: undefinedname: 'kjm';var 키워드를 이용한 변수 선언은 선언 단계와..
eslint와 prettier사용 중 이러한 에러가 발생하였다. 구글링을 통하여 알아보니 .eslintrc.json에 "useTabs": false를 추가해 해결하였다. "rules": { "prettier/prettier": "error", "useTabs": false }
document.addEventListener("keydown", (event) => { // 모든 한글 조합에 대한 정규식 /[ㄱ-ㅎ|ㅏ-ㅣ|가-힣]/ console.log(event); console.log(event.key, /[ㄱ-ㅎ|ㅏ-ㅣ|가-힣]/.test(event.key)); this.#keyboardEl .querySelector(`[data-code=${event.code}]`) ?.classList.add("active"); }); consolo.log로 event를 찍어서 a와 ㅁ을 찍어보았다. a는 아래와 같이 key과 keyCode값이 문제없이 출력되었다. 하지만 ㅁ을 입력했을 때는 key값으로 "Process"가 오고 모든 한글의 keyCode가 229로 출력되었다. 왜 이런 ..
#swichEl; constructor() { this.#assignElement(); this.#addEvent(); } #assignElement() { this.#swichEl = document.getElementById("#switch"); } #addEvent() { this.#swichEl.addEventListener("change", (event) => { console.log(event.target.checked); }); } event.target.checked를 통해 boolean데이터로 check여부를 확인하고 싶었다. 하지만 원하는 데이터가 나오지 않았다. 내가 생각한 boolean 데이터가 나오지 않았다. 개발자 도구를 열어보니 .checked가 먹히지 않는 것을 알 수 있었다..
