Today I Learned
jest를 이용한 테스팅 방법을 배웠다.
describe()로test()를 묶는다.
describe('Group tests', () => {
test('1 + 2 to equal 3', () => {
expect(add(1, 2)).toBe(3);
});
}eslint를 설치하고 airbnb를 사용하는 법을 배웠다.
.eslintrc.js혹은.eslintrc.json을 이용하여 설정을 한다. (eslint --init으로 생성)yarn run lint명령어로 eslint를 실행해도 되고(package.json에서scripts를 설정해줘야 한다.), vscode의 eslint extension을 설치해도 된다..eslintrc.js혹은.eslintrc.json을 이용하여 설정을 한다. (eslint --init으로 생성)- DOM을 이용하거나 jest를 사용하기 위해선
env설정에 추가해줘야 한다.
module.exports = {
env: {
browser: true,
jest: true,
}
}- airbnb Coding style을 적용하기 위해서
eslint-config-airbnb-base와eslint-plugin-import를 설치해야 한다. (.eslintrc에extends: 'airbnb-base'추가해서 적용)
Scope와 Closure를 복습했다.
this 키워드를 복습했다.
- 전역 범위에서
window혹은global을 가리키는this - 일반 함수 내부에서
window혹은global을 가리키는this - 객체 내부에서 그 객체를 가리키는
this new연산자를 사용해서 생성한 인스턴스를 가리키는thiscall,apply,bind에 의해 결정된this
ES6, jest, lint를 적용해서 pass-me 문제를 다시 풀어보았다.
- 화살표 함수에서 구조 분해 할당과 spread 연산자를 매우 유용하게 사용할 수 있다.
수정 전:
const array = [['key1', 'value1'], ['key2', 'value2'], ['key3', 'value3']];
const object = array.reduce(function(bag, element) {
bag[element[0]] = element[1];
return bag;
}, {});
console.log(object); // {key1: "value1", key2: "value2", key3: "value3"}수정 후:
const array = [['key1', 'value1'], ['key2', 'value2'], ['key3', 'value3']];
const object = array.reduce((bag, [key, value]) => ({ ...bag, [key]: value }), {});
console.log(object); // {key1: "value1", key2: "value2", key3: "value3"}- lint를 사용하면 위와 같은 사용을 권장하도록 만들 수 있다.
주의
- 모듈은
global로 설치하지 말고local로 설치해야 한다. git pull <repo-name> <branch> --rebase명령어를 통해merge없이 보다 깔끔하게 pull이 가능하다.
이번 페어 프로그래밍은 네비게이터와 드라이버의 역할을 확실히 나눠서 한 문제 혹은 몇 문제마다 역할을 바꾸며 진행했다. 역할을 바꿀 때, git push와 git pull을 적극적으로 이용했는데, 그럴 때마다 서로의 코드가 일부분 달라서 그 부분을 수정하는데 조금 애를 먹었다. git merge를 할 때 충돌이 없는데도 FETCH_HEAD가 분기되고 그런 부분들이 헷갈려서 이 부분에 관해서는 더 공부가 필요해 보인다.
