ES6 스터디

let 과 const 를 알아보자

function에 대해 알아보자. arrow function, arrow function 에서의 this 키워드, arrow function 의 사용방법

string 을 조합하기 위해 그동안 + 를 많이 사용하였다.이제 백틱(\`\`) 을 사용해서 탬플릿화 된 방식을 사용하자문자열 식별이 더 간결하고 변수 또는 함수를 바로 사용 할 수 있다.아래와 같이 template leteral string 으로 사용해보자더욱 가독

Array.of 함수에 전달하는 파라미터를 배열로 만들어준다.array 가 아닌 nodeList 같은 요소를 배열로 변경해 준다.배열에서 찾고 싶은 내용을 찾아서 첫번째 내용을 리턴한다.배열에서 찾고 싶은 내용을 찾아서 인덱스 숫자를 리턴한다.순서를 찾아서 가공하고자

5. 비구조화 비구조화란 복잡한 구조의 객체를 단순화 하여 접근하도록 만들어 주는 것이다. 5.1 객체 비구조화 => 기존에 객체 내부에 접근하던 방법 > 아래처럼 복잡한 객체 구조에서 간단하게 const 변수를 생성할 수 있도록 해준다. 아래와 같이 inlin

Spread Opertor(...) 을 이용하여 배열, 객체, 함수 등에서 사용할 수 있는 연산자이다. "풀어 헤친다" 라는 의미를 가지는 연산자이다.배열의 병합에 사용할 수 있다. 기존에는 concat 을 이용했다면 이제는 스프레드 연산자를 이용하여 간결하게 사용

=> 기존 loop 방식배열의 forEach 함수를 사용하여 loop 를 수행한다.loop 중 중지를 해야 한다면 for...of 를 사용해야 한디.Array.forEach 는 중단이 불가능하다.

Promise 란? > 자바스크립에서 비동기 처리를 위해 callback 을 사용해 왔으며 비동기 처리를 연속으로 처리하기 위해 중첩되어 처리를 하다보며 복잡도가 증가되었다. 또한 중첩으로 인해 예외처리가 어려워 지는 단점이 있었다. 이 두가지를 해결하기 위해 추가 된

await/async Promise 를 대체하여 더욱 더 편하고 보기 좋게 사용하기 위한 방법 Promise 를 대체하여 사용된다. 함수 선언 시 async 로 선언하여 비동기 함수임을 선언한다. 내부에서 fetch, json 등 함수 응답 수신이 필요한 경우 awa

자바스크립트에서도 class 를 사용할 수 있다.class 는 객체의 정의이다.extends 를 통해 class 를 상속받아 확장 할 수 있다.확장된 class 의 생성자 constructor() 내에서 부모 class 의 생성자를 호출하는 메소드이다.부모 class

자바스크립트 es6에 추가된 원시 데이터 타입이다.Symbol 은 고유한 데이터이다.Symbol 은 생성자에서 하나의 파라미터를 가진다.이것은 Value 가 아니며 설명을 나타내는 문자열이다.Symbol 을 선언하고 object 의 Key 로 사용 할 수 있다. str

Set() 은 object 로 이루어진 컬렉션이다.Array 와 다르게 동일한 Value 가 중복될 수 없다.해당 데이터가 존재하는지 확인 할 수 있다.생성된 Set 에 데이터를 추가한다.중복된 value 가 있으면 추가되지 않는다.Sets 내에 데이터를 삭제할때 사용

제네레이터 란 이터레이터 객체를 반환하는 함수이다.function 뒤에 \* 을 추가하면 제너레이터 함수라는 의미이다.모든 값을 리턴하지 않고 next()가 호출 될 때까지 실행을 멈춘다.제너레이터 함수는 이터레이터를 리턴하므로 아래와 같이 for of 에서 사용 가능

Proxy 란 대리자라는 뜻으로 뭔가를 대리해주는 객체를 뜻한다. es6에서의 Proxy 는 기본작업, 속성조회, 할당, 삭제, 열거 등등의 행위를 할때 사용자가 정의한 동작을 적용하도록 할 수 있는 객체이다.

?? 오퍼레이터 null, undefined 에 대해서 판단해서 Default Value 를 설정할 수 있도록 한다. 기존에 ||(or) 를 사용하여 Default Value 를 설정할 경우 0 으로 설정한 변수는 false 가 되어 잘못된 결과가 나올 수 있다.

존재하지 않는 Property 에 접근하려고 하면 오류가 발생한다. 이를 방지하기 위해 아래와 같이 작성해 왔다.Depth 가 길어지면 많이 복잡해질수 있다.이것을 방지하기 위해 ?. 오퍼레이터를 사용한다.

padStart 고정된 자리수에 남는 앞자리를 특정 문자로 채워준다. padEnd

문자열의 앞부분과 뒷부분의 빈 문자열을 모두 제거해 준다.문자열의 앞 부분 빈 문자열을 제거해 준다.문자열의 뒷 부분 빈 문자열을 제거해 준다.

객체의 value 만 배열로 리턴한다.객체 속성을 Key, Value 까지 Array 배열로 리턴한다. key, value 배열로 구성 된 entries 를 객체로 변경한다.

배열내의 항목을 상단까지 풀어준다.파라미터에 깊이 지정이 가능하다배역의 데이터를 정렬해준다. 사용자가 정의한 함수를 파라미터로 전달할 수 있다.

Promise.all 은 모든 호출이 성공해야 리턴이 된다.Promise.allSettled 는 그와 다르게 결과 Response 만 배열로 오는 것이 아니라 상태값까지 배열로 전달된다.에러가 있더라도 모든 결과를 리턴한다.