자바스크립트 전역 스코프에 정의된 것은 코드 내의 어디서든지 접근이 가능하다는 것이 문제가 되고는 합니다. 이때 외부에 공유되면 안되거나 충돌날 위험이 있는 경우 즉시 실행 함수를 통해 해결하고는 합니다. 즉시 실행 함수(IIFE) 단순하게 함수와의 차이를 보자면 즉시 실행되는지 아닌지의 차이입니다. 함수표현식은 함수를 정의하고, 변수에 함수를 저장하고 실행하는 일련의 과정이 있습니다. 하지만 즉시실행함수는 이러한 과정없이 즉시 실행됩니다. 문법의 차이는 단순히 함수를 괄호 "()"로 랩핑한다는 것입니다. 형태 (function() { console.log('즉시 실행 함수'); }()); var now = (function () { console.log('즉시 실행 함수') })(); 익명, 기명 즉시..
자바스크립트 반복기(Iterator)와 생성기(Generator)
이터러블 (Iterable) 순회가능한 객체를 말합니다. 순회 가능한 객체는 Symbol.iterator 심볼 속성을 가지고 있으며 이터레이터 객체를 반환하는 객체를 말합니다. 이러한 것을 이터러블 프로토콜이라고 하며 이터러블 객체라고 합니다. 이터레이터 (Iterator) 이터러블 메소드로 반환하는 객체입니다. next 메소드를 구현하고 있으며 value, done을 반환하는 객체입니다. 반환되는 IteratorResult는 {done: boolean, value: any} 형태의 단순한 객체입니다. next 메소드를 통해 모든 값을 돌고 나면 done이 true로 나오며 끝납니다. 한번 끝난 이터레이터는 다시 돌아가지 않으며 value가 undefined로 리턴합니다 이러한 것을 이터레이터 프로토콜이..
cross-env 패키지 / webpack 설정 development와 production으로 나누기
개발일때에는 development, 배포일때에는 production로 process.env.NODE_ENV를 구분해서 webpack의 설정을 진행해야하는 경우들이 있다. 예를 들면... 보안에 안좋아서 옵션을 달리해야한다던가..? 맥에서는 명령어만 삽입해도 진행이 되는데, windows에서는 라이브러리를 사용해줘야한다. cross-env는 이때 운영체제나 플랫폼에 종속되지 않고 동일한 방법으로 env 변수를 주입해주는 패키지이다. 이것을 사용하면 동적으로 process.env(환경 변수)를 변경할 수 있다. 설치 npm i cross-env 사용할 커맨드 앞에 cross-env 를 붙여주기만 하면 된다. package.json 사용 전 "scripts": { "dev": "next -p 3060", "b..
Javascript로 사이트에서 메일을 발송해보자! _Contact Form 만들자_ EmailJS를 사용해보자
사이트에 Form을 만들고 이것을 통해 '사이트 주인에게 메일 발송'하는 기능을 작업해보도록하겠습니다. EmailJS - http://www.emailjs.com/ Send email from Javascript - no server code required | EmailJS Send email directly from your client-side Javascript code – no server side code required. Add static or dynamic attachments, dynamic parameters, captcha code and more. Start with our free tier! www.emailjs.com - 무료는 텍스트만 가능, 파일전송 X 1. 가입 2. Em..