blog

*순수 바닐라자바스크립트 작성전에 ‘use strict’; 를 작성하자 ⭐⭐⭐⭐⭐ -자바스크립트는 유연한 언어이기때문에 개발자의 실수가 많을 수 있다. -해당 선언은 비상식적인것을 쓸 수 없게 하는 엄격한 모드로 실행하는 방법이다. 'use strict'; console.log('Hello World!'); 꿀팁 ==>> type=modaule 선언하면 자동으로 엄격모드에 진입함 * head 안에 script 넣기 -스크립트 다운로드 -> 실행 -> 파싱.. => js 파일의 용량이 크고 웹이 느리다면 아주 많은 시간이 소요됨. ❌ * body 안 가장 맨 끝에 script 넣기 -자바스크립트에 의존적인 사이트라면 사용자가 정상적으로 페이지를 보기전까지 패칭하는 시간을 기다려야함 . ❌ async와 de..

*일반적인 변수명/함수명 카멜형식으로 사용 *ES6 적극 (var ,for 증감식 등 활용X) *패키지 매니저 통일 (npm/ yarn) *공유시 node_module 폴더 제외 *api key등 보안이 필요한 정보들은 env 폴더 이용 *함수 표현식을 사용 (호이스팅의 영향을 받지 않기때문) bar(); // TypeError: bar is not a function // 함수 표현식 var bar = function() { console.log("Hello, World!"); }; *상수를 뜻하는 변수는 대문자로 작성 const PI = 3.14159; const MAX_VALUE = 100; console.log(PI); // 3.14159 console.log(MAX_VALUE); // 100

-새 페이지 열때마다 깜빡거리는 문제 => 세션스토리지를 로컬스토리지로 변경 -다크모드 스크립트 -> 우선순위 제일 상위로 -아래 코드 추가 (스토리지는 상황에 맞게 수정필요)

여러 html 페이지 스크립트 코드를 한 js 파일에 작성할때 콘솔에 오류 찍히는 문제 if (btn !== null) { btn.addEventListener('click', function () { }); }

* 바닐라 자바스크립트 'closest()' 메서드 사용하기 -IE 버전 9부터 지원 [html] [js] const grandchild = document.querySelector('.grandchild'); const parent = grandchild.closest('.parent'); *제이쿼리 closest() 메서드 바닐라 자바스크립트 함수로 바꾸기 // 함수: closest function closest(el, selector) { let matchesFn; // find vendor prefix ['matches', 'webkitMatchesSelector', 'mozMatchesSelector', 'msMatchesSelector', 'oMatchesSelector'].some(funct..

* (함수 -> 함수)로 함수값 리턴하기 const handleToDoSubmit = function (e) { e.preventDefault(); const inputStyle = document.querySelector('.dress_style') const inputSize = document.querySelector('.dress_size') style = inputStyle.value; size = inputSize.value; return { style, size }; // return [style, size]; } const returnFunction = function () { console.log(style); console.log(size); }