dh_0e

객체 리터럴{}로 객체 리터럴을 정의할 때 사용키-값 쌍으로 구성된 데이터 구조블록 문{}로 코드 블록을 정의할 때 사용여러 명령문을 묶어서 실행하는데 사용 객체 리터럴과 블록 문 구분JavaScript에서 똑같이 중괄호 '{}'를 사용하는 두 경우를 어떻게 구분할 수 있을까?'{}'가 객체 리터럴인지 블록 문인지 구분하기 어려운 경우가 있다.다음 예시는 그 구분이 애매할 때 발생할 수 있는 에러이다.let name, age;{ name, age } = { name: 'Alice', age: 30 }; // SyntaxError 발생name, age를 key값으로 가진 객체 리터럴에서 구조 분해 할당을 하려 한다.이때, 작성자는 '{ name, age }'를 객체 리터럴을 목적으로 작성했지만 실제로 컴파..

rest parametersES6에서 도입되었으며 함수의 매개변수로 전달된 가변 개수의 인자를 배열 형태로 처리할 수 있는 기능함수 정의에서 사용되며 스프레드 연산자('...')를 매개변수로 사용하여 구현 (C와 동일)function exampleFunction(arg1, arg2, ...restArgs) { console.log(arg1); // 첫 번째 인자 console.log(arg2); // 두 번째 인자 console.log(restArgs); // 나머지 인자들 (배열 형태)}function sum(...numbers) { return numbers.reduce((acc, num) => acc + num, 0);}console.log(..

캠프가 시작한 지 3달째, 벌써 3일 뒤면 최종 프로젝트를 시작한다. 나중에 다른 컴퓨터나 노트북으로 Visual Studio Code를 사용할 때를 대비해서 지금까지 Visual Studio Code로 코딩하면서 사용했던 확장 프로그램을 정리해보려 한다.Korean Language Pack for Visual Studio Code가장 먼저 설치한 확장 프로그램으로 한국어 기능을 제공한다.설치한 후 재시작해야 적용된다.Open in browserhtml code를 웹 페이지로 빠르게 실행해 주는 단축키를 생성해 준다.code에 오른쪽 마우스를 클릭하면 다음과 같이 직접적으로 접근할 수 있다.Live Serveropen in browser과 비슷하게 html code를 웹 페이지로 실행시켜 준다.open ..

ESLint 사용하여 컴파일 전에 에러 찾기npm init @eslint/config@latest다음 명령어로 eslint를 설치한다.package.json에 영향을 주지만 package.lock 파일을 생성하거나 yarn.lock 파일에 영향을 주지는 않는다.yarn을 사용했어도 걱정하지 말고 다음 명령어를 입력하여 설치해준다.설치가 완료되면 프로젝트에 eslint.config.js 파일이 생성된다.이 때 확장프로그램에서 eslint를 검색하여 설치해준다.그러면 다음과 같이 사용하지 않는 변수들이 경고가 아니라 에러가 뜬다고 빨간 줄로 위협할 것이다!이게 거슬린다면 다음과 같이 설정을 변경하면 된다.강조된 부분에 마우스 커서를 올려서 eslint의 경고문을 확인한다.괄호 안의 내용을 복사하여 eslin..

localStorage는 웹 스토리지 객체(Web Storage Object)로 브라우저 내에 객체로서 저장할 수 있게끔 해주는 문법이다.localStorage에 저장한 값은 웹을 새로고침하거나 꺼도 유지되며 다시 실행하면 데이터가 사라지지 않고 남아있다.하지만 api를 사용하는 것이 아닌 브라우저 내에 저장하는 것으로 다른 컴퓨터(사용자)와 코드만 공유할 경우 저장한 값을 공유할 수는 없다. 본인의 로컬에서만 저장 및 수정이 가능하며 대부분의 브라우저가 2MB 이상의 객체를 저장할 수 있다. get, set, remove localStorage.setItem(key, value) - key, value 쌍을 저장함 (이미 존재하는 key라면 덮어씀)localStorage.getItem(key) - ke..