algml0703

이터레이터와 제너레이터 - 자바스크립트의 내장 객체인 Array, set, map 은 대표적인 이터러블 객체이다. 이터러블 객체는 다양한 자료 형태에 대한 처리를 손쉽게 할 수 있도록 한다. - 이터러블 : 이터레이터를 반환하는 [ Symbol.iterator] () 을 가진 값 - 이터레이터 : { value , done } 객체를 리턴하는 next()를 가진 값 - 이터러블/이터레이터 프로토콜 : 이터러블을 for...of, 전개 연산자 등과 함께 동작하도록 한 규약 이터레이터는 아래와 유사한 구조로 되어 있으며, 각 요소는 for of 문을 통해 순회할 수 있다. - 제너레이터 : 이터레이터이자 이터러블을 생성하는 함수 즉 이터레이터를 반환하는 함수이다. - 제너레이터는 function* 를 통해 ..

Map과 Set map과 set은 es6에서 새롭게 등장한 자료구조 타입이다. HTML 삽입 미리보기할 수 없는 소스 map은 객체와 유사하게 키와 값으로 데이터를 저장하는 반면, 문자열만을 키로 가질 수 있는 객체와 달리 map은 다양한 자료타입을 키로 가질 수 있다. 주요 메서드 new Map() map.set(key, value) : key와 value를 저장한다. map.get(key) : 해당 key에 해당하는 값을 반환한다. key가 존재하지 않으면 undefined를 반환한다. map.has(key) : 해당 key의 존재 여부에 따라 true/false를 반환한다. map.delete(key) : 해당 key에 속하는 데이터를 지운다. map.clear() : map 안의 모든 요소를 제거..

리스트 순회하기 HTML 삽입 미리보기할 수 없는 소스 for i++ HTML 삽입 미리보기할 수 없는 소스 for of 자바스크립트의 내장값 Array / Set / Map Array, map, set은 자바스크립트 내장객체로서 이터러블, 이터레이터 브로토콜을 따른다. [ Symbol.iterator ] * 이터러블 -> 이터레이터를 리턴하는 [ Symbol.iterotor]( )를 가진 값, 즉 [Symbol.iterator]()을 실행 시 이터레이터를 반환하는 값. * 이터레이터 -> { value , done} 객체를 리턴하는 next()를 가진 값. * 이터러블/이터레이터 프로토콜 -> 이터러블을 for...of, 전개 연산자 등과 함께 동작하도록 한 규약 1) Array를 통한 접근 // Sy..

함수 고급 개념 HTML 삽입 미리보기할 수 없는 소스 HTML 삽입 미리보기할 수 없는 소스 const log = console.log; const a = 10; const add10 = a => a+ 10; const r = add10(a); log(r); HTML 삽입 미리보기할 수 없는 소스 자바스크립트에서 함수는 일급이기 때문에, 값으로도 다뤄질 수 있다. 또한 함수가 일급이라는 의미는 함수의 결과값으로 함수가 올 수 도 있음을 의미한다. const log = console.log; // 일급은 값으로 다뤄질 수 있고, 변수에 담길 수 있다. const a = 10; const add10 = a => a+ 10; const r = add10(a); log(r); // 일급은 함수의 인자로 사용될..

화살표함수와 일반함수 화살표함수 ( ) => { } 화살표 함수는 es6에서 새롭게 나타난 문법이다. 화살표함수는 기본적으로 함수명을 가지지 않아서 항상 함수를 생성후 변수에 할당해주는 함수표현식으로 작성해주어야 한다. 화살표함수에는 this가 존재하지 않는다. 화살표함수는 생성자함수가 될 수 없다. 일반함수 function( ) { } 일반함수는 기본적으로 함수선언식으로, 호이스팅의 영향을 받아 선언위치에 상관없이 함수 호출이 가능하다. 일반함수에는 this가 존재하는데, this는 자기자신을 가리킨다. 즉 fun내부에 count가 존재하기 때문에 this.count는 fun 내부의 count를 가리키게 된다. ...args를 통해 인자를 배열형태로 받을 수 있다. 출처 https://www.youtu..

함수표현식 const 변수명 = () => { } const 변수명 = function ( ) { } 아래와 같이 함수를 변수에 할당하는 방식이다. 함수가 선언되고 그 이후 즉 아래에 구현되는 코드에서만 해당 함수를 사용 가능하다. - return을 생략한 화살표 함수 - 객체를 반환하는 경후에는 ( )안에 넣어 이와 같은 형식으로 ({}) 작성해주어야 한다. 자바스크립트는 단순 {}는 함수의 바디라고 생각해서 해당 바디안에 return을 작성하지 않는 이상 반환하지 않고, 단순 계산에 그치게된다. - 함수가 선언되기 이전에 해당 함수를 사용하려 하면 아래와 같은 에러메시지가 발생한다. 함수선언식 function 함수명 ( ) { } 아래와 같은 형식으로 함수 생성하는 것을 의미하며, 함수가 선언되기 이..

HTML 삽입 미리보기할 수 없는 소스 obj(=객체) 안에 특정 property의 존재 여부에 따라 true / false 를 반환하여 준다. HTML 삽입 미리보기할 수 없는 소스 obj(=객체)가 지닌 property의 수만큼 반복한다. 속성명이 숫자인 경우에는 숫자 순서대로 출력되며, 그외에는 객체 순서대로 출력한다. HTML 삽입 미리보기할 수 없는 소스 조건식에 따라 true/false를 반환한다. HTML 삽입 미리보기할 수 없는 소스 조건식에 해당하는 요소만 반환하여 준다.

Ngrok 애플리케이션 개발시에 프론트엔드와 백엔드 api 연동 테스스 등을 하는 경우 로컬 서버를 외부에서 접속할 수 있게 하여 유용하게 사용할 수 있다. > brew install --cask ngrok https://ngrok.com/ 위의 사이트에 들어가서 회원가입 후 Getting-started - Your authtoken 에 들어가서 token 복사해둔다. 로컬에 구현한 서버를 실행시킨다. 서버를 실행시키지 않고, ngrok를 실행하면 해당 서버에 접속할 수 없다. 반드시 서버를 먼저 실행시키고, 아래의 명령어를 통해 ngrok를 실행한다. > ngrok http [외부에 공개하려는 port] 위와 같이 하면 아래와 같이 창이 나오는데 Forwarding 에 있는 url에 접속한다. 접속시에..

write-excel-file 엑셀 파일을 만들어 준다. > npm install write-excel-file --save 코드 const writeXlsxFile = require("write-excel-file/node"); const fs = require("fs"); const HEADER_ROW = [ { value: "Name", fontWeight: "bold", }, { value: "Birth", fontWeight: "bold", }, { value: "phone", fontWeight: "bold", }, { value: "region", fontWeight: "bold", }, ]; const DATA_ROW_1 = [ // "Name" { type: String, value: "..

sendgrid는 메일 보내기 등의 서비스를 제공하는 플랫폼이다. 일정 수준 내에서 무료 서비스를 제공한다. 1. https://sendgrid.com/ 해당 사이트를 들어가 회원가입 한다. 2. 회원가입 후 로그인을 하면 우측 상단에 Dashboard 라고 되어있는 부분을 클릭한다. 3. Dashboard창으로 이동되면 가운데 부분에 Create a Single Sender라고 되어있는 부부을 클릭한다. 4. 아래와 같은 창이 나오면 해당 하는 정보를 입력한다. 나는 테스트 용으로 만든것이여서 임의로 정보를 입력하였다. From Email Address는 본인이 이메일을 보내려는 이메일 주소이끼 때문에, 해당 이메일 주소는 정확하게 입력하여야 한다. 5. 정보를 입력 후 create를 클릭하면 아래와 ..