말은 쉽지, 코드를 보여줘!

객체리터럴 선언시 만약에 key 이름으로 선언된 값이 존재하다면 value 를 생략해도 자동으로 매칭시켜준다. let name = "이름"; let languages = "언어"; let value = "벨류"; const extracted = { name, languages, value } //이 코드는 다음 코드와 같다. const extracted = { name: "이름", languages: "언어", value: "벨류" }

const {done, children, onToggle, onRemove} = this.props; //이는 아래와 같다. const done = this.props.done; const children = this.props.children; const onToggle = this.props.onToggle; const onRemove = this.props.onRemove; //아래와 같이 하면 키값을 변환해서 가져올 수 있다. const {done: convertName} = this.props; console.log(convertName); // == this.props.done

특정 js 파일의 클래스나 함수를 다른 곳에서 import 받아서 사용하려면 기본적으로 가장 하단에 export 처리가 되어 있어야 한다. export는 아래와 같이 하면 된다. export default counter; export const increase = () => ({type: INCREASE); ./counter.js 파일을 import 받는다고 가정하면 아래와 같이 하면 된다. 보면 알겠지만 export default 로 내보낸 것들은 그냥 명시하면 되지만 export 로 내보낸 것들은 {}로 묶어줘야 한다. import counter, { increase } from './counter'; 만약 import 받으려는 파일명이 index.js 이고 modules 디렉토리 하위에 있다면 아래..

기존방식 //함수선언식 function func(arg) { ... } //함수표현식 const func = function(arg) { ... } ES6 화살표 함수 const func = (arg) => { ... } 기존의 함수표현식과 비슷한 형태로 사용되지만 this의 기준이 다르기 때문에 화살표함수가 완전히 기존 방식을 대체할 순 없다. 기존 함수에서의 this는 자신이 종속된 객체를 가리키고 화살표함수의 this는 자신이 종속된 인스턴스를 가리킨다. 클래스, 객체, 인스턴스 대한 구분은 아래를 참고하자. findmypiece.tistory.com/35 클래스, 객체, 인스턴스 객체는 뭐고 객체는 뭐고 인스턴스는 뭔가? 그리고 클래스는 또 뭘까? 흔히들 클래스를 객체화한다거나 클래스를 인스턴스화..

배열과 객체 리터럴 값을 복사해온다. const numbers = [1, 2, 3, 4, 5]; const moreNumbers = [...numbers, 6]; //배열을 그대로 복사해오는 것으로 아래와 같다. const numbers = [1, 2, 3, 4, 5]; var numbersLength = numbers.length; const moreNumbers = new Array(); for(var i = 0; i < numbersLength+1; i++){ if(i < numbersLength){ moreNumbers[i] = numbers[i]; }else{ moreNumbers[i] = 6; } } 위와 같이 하면 numbers의 값이 moreNumbers에 그대로 복사된다. 기본적으로 전개..

redux-saga 에서는 ES6의 제너레이터 함수 문법을 사용한다. 사실 이 문법에 대해 딱히 몰라도 redux-saga를 사용법만 알면 큰 문제가 되지 않지만 원리를 알면 아주 조금은 도움이 된다. ​ 제너레이터 함수는 문자그대로 발전기를 만들어주는 것으로 해당 함수를 최초 호출할 경우 함수 내부 구문이 실행되는 것이 아니라 내부 구문을 실행시킬 수 있는 제너레이터 객체를 리턴하게 된다. 이 문법의 핵심기능은 함수를 실행할 때 함수를 특정구간에 멈춰 놓았다가 다음 호출에 이어서 실행시킬 수 있다는 것이다. ​ 제너레이터 함수는 아래와 같이 정의한다. function* generatorFunc(){ console.log('1 구간 진입'); let param = yield; console.log('1구..