javascript

[Javascript] 모듈 기능으로 살펴보는 자바스크립트

자바스크립트는 웹의 보조적인 기능을 수행하기 위해서 설계되었다는 태생적인 한계 때문에 모듈 기능을 지원하지 않았습니다. 모듈 기능을 지원하지 않는다는 뜻은 각각의 파일들이 독자적인 스코프를 가지고 있지 않고 동일한 전역 객체를 공유하고 있다는 뜻입니다. 그렇기 때문에 전역변수의 사용을 상당히 조심했어야 했습니다. foo.js와 bar.js에서 동일한 전역 변수를 선언했다면, foo의 변수가 bar의 변수로 재정의되면서 foo의 파일이 의도대로 동작하지 않는 문제가 발생하게 됩니다. 시간이 흘러서, 모듈 지원을 해결하기 위해서 CommonJS와 AMD 진영으로 나뉘게 되었고, ES6에 이르러서 module 기능은 표준화가 되었습니다. script 태그에 type="module" 어트리뷰트를 추가하면 로드된..

[ESLint / Prettier] 레퍼런스 모아보기

🔮ESLint + Prettier시작하기 // npm환경이 존재하는 cra같은 경우에는 사용할 필요 없음 $ npm init -y // eslint 설치 $ npm install eslint prettier --save-dev // or $ yarn add -D eslint prettier // eslint 시작 설정 $ npx eslint --init //or $ yarn eslint --init eslint --init을 해주면 질문이 여러가지가 나오는데 세팅하려는 환경에 맞춰서 답변하면 그에 맞게 세팅하게 된다. $ yarn eslint --init yarn run v1.22.10 $ /home/identity/hanghae99/redux-toolkit-tutorial/node_modules/.bi..

자바스크립트 객체 부수기

객체란? 객체(object)란 실생활에서 우리가 인식할 수 있는 사물로 이해할 수 있다. 자바스크립트에서는 이름과 값으로 구성된 속성을 가지는 기본 데이터 타입을 말한다. 자바스크립트에서의 객체는? typeof([]) > "object" typeof({}) > "object" // 함수는 객체의 특성을 가지고 있지만 typeof로는 function을 출력함. typeof(function(){}) 'function' 자바스크립트에서는 원시 값을 제외한 나머지 값(함수, 배열 정규표현식)은 모두 객체이다. 자바스크립트를 구성하는 거의 모든 것이 객체라고 생각하면 된다. 자바스크립트는 객체 기반의 프로그래밍 언어라고 할 수 있다. 객체 구조 살펴보기 var counter = { num: 0, // 프로퍼티 /..

[Javascript] 이번에야말로 regex를 써보자

✨Regex란? Regular Expressions의 준말이다. 정규 표현식, 또는 정규식이라고도 하며 문자열에서 특정 문자 조합을 찾기 위한 패턴이다. 보통 회원가입 시에 아이디나 비밀번호, 이메일과 같은 정보를 유효성 검사할 때 많이 사용한다. 문자열로 고통받는 이들을 위한 구세주 같은 존재이다. 🔍정규표현식 알아보기 Groups and ranges | 또는 () 그룹 [] 문자셋, 괄호안의 어떤 문자든 [^] 부정 문자셋, 괄호안의 어떤 문가 아닐때 (?:) 찾지만 기억하지는 않음 Quantifiers ? 없거나 있거나 (zero or one) * 없거나 있거나 많거나 (zero or more) + 하나 또는 많이 (one or more) {n} n번 반복 {min,} 최소 {min,max} 최소,..

[Javascript] Array filter 맛깔나게 써보기

가장 많이 사용하는 자료형 중에 하나인 Array의 메소드 중에 존엄 filter에 대해서 알아보자. 📖MDN부터 살펴보기 Array.prototype.filter() - JavaScript | MDN The filter() method creates a shallow copy of a portion of a given array, filtered down to just the elements from the given array that pass the test implemented by the provided function. developer.mozilla.org "filter 메소드는 조건을 통과(참)하는 모든 요소를 모아서 새로운 배열로 반환한다" 배열 데이터에서 원하는 조건의 요소들만 쏙쏙 뽑..