Konans는 불교에서 유래된 단어로, 결론을 내리기 전에 이게 왜 맞는지 깊게 고민한다는 의미를 가지고 있다고 한다.
JS Koans는 답이 미리 제시되어 있기 때문에 고민 없이 풀면, 큰 어려움 없이 전부 다 풀수 있다. 하지만 그게 왜 정답인지 깊게 고민 해 보는 시간을 갖지 않는다 면 충분히 성장하기 어려울 것이다.
Koans 문제 중에는 학습하지 않은 개념도 의도적으로 포함되어 있습니다. 페어와 함께 깊게 고민하고, 정답을 설명할 수 있도록 연습해 보자.
시작하기에 앞서 koans 의 아쉬운 점 하나만 적고 넘어가고 싶다.
VS를 이용해 문제를 풀고 정답을 확인하기 위해 들어가면 어쩔 수 없이 정답이 보인다.
보지 않고 새로고침을 했을 때 정답이라면 다행이지만 정답이 아닐 때에는 결국 보게 된다.
정답을 숨겨놓고 왜 틀렸는지 도저히 답이 안나올 때 클릭하여 확인 할 수 있는 방식이었다면 조금더 좋았을 것 같다.
블로깅 주제가 JS koans를 풀었던 과정과 새롭게 알게 된 것이라고 되어있는데...
풀었던 과정 자체는 그렇게 어렵지 않게 풀었던 것 같다. Array 과정 까지 순탄하게 풀었다.
배웠던 개념들을 다시금 이해하는 과정이라 생각하며 풀었으며, 새로이 알게된 것 보다는 복습의 중요성을 느낀 과정이었다.
문제는 Object,Spread syntax 와 Destructing Assignment 과정이었다.
- Object Q&A
const megalomaniac = {
mastermind: 'Joker',
henchwoman: 'Harley',
getMembers: function () {
return
//...생략
},
};
라는 보기와 함께
expect(megalomaniac.length).to.equal(undefined);문제가 주어졌는데 내 첫 대답은 모든 주어진 내용들을 포함한 갯 수 였는데, 정답은 undefined 였다.
주관적인 생각으로는 const megalomaniac 속에 포함된 내용들이 동일한 속성이 아니라서 length를 정의하지 못했다고 생각한다.
const megalomaniac = { mastermind: 'Agent Smith', henchman: 'Agent Smith' };
//Q1 - 마스터 마인드가 megalomaniac에 있는가? = true
expect('mastermind' in megalomaniac).to.equal(true);
//Q2 - megalomaniac.mastermind 는 neo로 재 할당한다.
//megalomaniac.mastermind 는 무엇과 동일한가? = Neo
megalomaniac.mastermind = 'Neo';
expect(megalomaniac['mastermind']).to.equal('Neo');
//같은 (.to.equal)을 사용하는데 대답해야하는 내용이 달라 처음엔 헷갈렸으나,
//지정하는 대상이 무엇이냐에 따라 대답의 방식이 달라진다고 주관적인 생각으로 해결했다.(추후 추가 예정)
예측하기 어려운 코드는 오류로 이어진다.
보기 좋은 코드를 쓰는 것 = 개발자의 소양
+a)
//scope 내용 중...
it('함수 선언식(declaration)과 함수 표현식(expression)의 차이를 확인합니다.', function () {
let funcExpressed = 'to be a function';
expect(typeof funcDeclared).to.equal('function');
//함수 선언식은 호이스팅이 된다. = 'function'
expect(typeof funcExpressed).to.equal('string');
// but 함수 표현식은 호이스팅이 되지 않는다 따라서 = 'string'
function funcDeclared() {
return 'this is a function declaration';
}
funcExpressed = function () {
return 'this is a function expression';
}; function shadowGlobal2(message) {
return message;
}
=== function ShadowGlobal12(let message = ()){
return message;
}렉시컬 스코프
const x =10
function bar(){
console.log(x)
}
function foo(){
const x = 1
bar()
}
//bar() === 10
//foo() === ?
// 1 !== foo()
// 10 === foo()
//why? 함수는 불려오는 위치에 따라 결정 x
//함수가 처음에 정의되는 위치에 따라서 어떤 변수를 참조할 지 결정이 된다.
//따라서 foo() 에서 정의된 const x = 1 이 맞으나 bar()는 foo()보다 먼저 위치
//so foo() === 10빈 배열 확인 방법
if (arr.length === 0){~~~}
// not if(arr === []){} <<error