diff --git a/koans/01_Introduction.js b/koans/01_Introduction.js
index f9cfaa6..99947ee 100644
--- a/koans/01_Introduction.js
+++ b/koans/01_Introduction.js
@@ -29,13 +29,13 @@ describe('expect에 대해서 학습합니다.', function () {
expect(true).to.be.true;
*/
// TODO: 테스트가 통과될 수 있도록(테스트하는 값이 true가 되도록) expect의 첫 번째 전달인자를 수정합니다.
- expect(false).to.be.true;
+ expect(true).to.be.true;
});
it('테스트하는 값(expect의 전달인자)이 falsy 여부를 검사합니다.', function () {
// 반대의 경우에는 어떻게 해야할까요?
// TODO: 테스트가 통과될 수 있도록(테스트하는 값이 false가 되도록) expect의 첫 번째 전달인자를 수정합니다.
- expect(true).to.be.false;
+ expect(false).to.be.false;
});
/*
@@ -53,7 +53,7 @@ describe('expect에 대해서 학습합니다.', function () {
it("'테스트하는 값'을 '기대하는 값'과 비교한 결과가 참 인지 확인합니다.", function () {
// '테스트하는 값'은 우리가 작성한 어떤 코드의 실제 실행 결과 값이므로 '실제 값'이라고 불러도 됩니다.
let actualValue = 1 + 1;
- let expectedValue = FILL_ME_IN; // TODO: 'FILL_ME_IN'을 변경하여 테스트 케이스를 완성합니다.
+ let expectedValue = 2; // TODO: 'FILL_ME_IN'을 변경하여 테스트 케이스를 완성합니다.
expect(actualValue === expectedValue).to.be.true;
});
@@ -68,13 +68,13 @@ describe('expect에 대해서 학습합니다.', function () {
이후에도 같은 방식으로 'FILL_ME_IN' 변경하면 됩니다.
*/
it('Matcher .equal 의 사용법을 학습합니다.', function () {
- let expectedValue = FILL_ME_IN; // TODO
+ let expectedValue = 2; // TODO
// .equal은 두 값이 타입까지 엄격하게 같은지 검사(strict equality, ===)합니다.
expect(1 + 1).to.equal(expectedValue);
});
it('Matcher .equal의 사용법을 학습합니다.', function () {
let actualValue = (1 + 1).toString();
- expect(actualValue).to.equal(FILL_ME_IN); // TODO
+ expect(actualValue).to.equal("2"); // TODO
});
});
diff --git a/koans/02_Types-part1.js b/koans/02_Types-part1.js
index a54a4d6..9630f06 100644
--- a/koans/02_Types-part1.js
+++ b/koans/02_Types-part1.js
@@ -1,7 +1,7 @@
describe('type에 대해서 학습합니다.', function () {
it("비교연산자 '=='는 두 값의 일치 여부를 느슨하게 검사(loose equality)합니다.", function () {
let actualValue = 1 + 1;
- let expectedValue = FILL_ME_IN;
+ let expectedValue = 2;
expect(actualValue == expectedValue).to.be.true;
/*
@@ -33,26 +33,26 @@ describe('type에 대해서 학습합니다.', function () {
it("비교연산자 '==='는 두 값의 일치 여부를 엄격하게 검사(strict equality)합니다.", function () {
let actualValue = 1 + 1;
- let expectedValue = FILL_ME_IN;
+ let expectedValue = 2;
expect(actualValue === expectedValue).to.be.true;
// 이제 'FILL_ME_IN'을 대신할 수 있는 건 number 타입의 2뿐입니다.
// 문자열 '2'는 테스트를 통과하지 못합니다.
});
it('expect의 전달인자로 들어간 표현식의 평가(evaluation) 결과를 예측해 봅니다.', function () {
- expect(1 + '1').to.equal(FILL_ME_IN);
+ expect(1 + '1').to.equal('11');
});
it('expect의 전달인자로 들어간 표현식의 평가(evaluation) 결과를 예측해 봅니다.', function () {
- expect(123 - '1').to.equal(FILL_ME_IN);
+ expect(123 - '1').to.equal(122);
});
it('expect의 전달인자로 들어간 표현식의 평가(evaluation) 결과를 예측해 봅니다.', function () {
- expect(1 + true).to.equal(FILL_ME_IN);
+ expect(1 + true).to.equal(2);
});
it('expect의 전달인자로 들어간 표현식의 평가(evaluation) 결과를 예측해 봅니다.', function () {
- expect('1' + true).to.equal(FILL_ME_IN);
+ expect('1' + true).to.equal('1true');
});
/*
diff --git a/koans/03_LetConst.js b/koans/03_LetConst.js
index c3756c3..95663ba 100644
--- a/koans/03_LetConst.js
+++ b/koans/03_LetConst.js
@@ -2,17 +2,17 @@ describe("'const'에 대해서 학습합니다.", function () {
it("'const'로 선언된 변수에는 재할당(reassignment)이 금지됩니다.", function () {
// 아래 코드에서 문제가 되는 부분을 삭제합니다.
const constNum = 0;
- constNum = 0;
+ // constNum = 0;
expect(constNum).to.equal(0);
const constString = 'I am a const';
- constString = "which means I'm a constant variable, delete me.";
+ // constString = "which means I'm a constant variable, delete me.";
expect(constString).to.equal('I am a const');
});
it("'const'로 선언된 배열의 경우 새로운 요소를 추가하거나 삭제할 수 있습니다.", function () {
const arr = [];
- const toBePushed = FILL_ME_IN;
+ const toBePushed = 42;
arr.push(toBePushed);
expect(arr[0]).to.equal(42);
@@ -22,15 +22,15 @@ describe("'const'에 대해서 학습합니다.", function () {
it("'const'로 선언된 객체의 경우, 속성을 추가하거나 삭제할 수 있습니다.", function () {
const obj = { x: 1 };
- expect(obj.x).to.equal(FILL_ME_IN);
+ expect(obj.x).to.equal(1);
delete obj.x;
- expect(obj.x).to.equal(FILL_ME_IN);
+ expect(obj.x).to.equal(undefined); /// expect(obj); 는 {} 빈객체, expect(obj.x)는 undefined
// 여전히 재할당은 금지됩니다.
// obj = { x: 123 };
- obj.occupation = FILL_ME_IN;
+ obj.occupation = 'SW Engineer';
expect(obj['occupation']).to.equal('SW Engineer');
});
diff --git a/koans/04_Scope.js b/koans/04_Scope.js
index 83a1705..3add077 100644
--- a/koans/04_Scope.js
+++ b/koans/04_Scope.js
@@ -2,14 +2,14 @@ describe('scope 대해서 학습합니다.', function () {
// scope는 변수의 값(변수에 담긴 값)을 찾을 때 확인하는 곳을 말합니다. 반드시 기억하시기 바랍니다.
it('함수 선언식(declaration)과 함수 표현식(expression)의 차이를 확인합니다.', function () {
let funcExpressed = 'to be a function';
-
- expect(typeof funcDeclared).to.equal(FILL_ME_IN);
- expect(typeof funcExpressed).to.equal(FILL_ME_IN);
+ // 함수는 선언돼면 그냥 위로 올라옴. (일종의 호이스팅)
+ expect(typeof funcDeclared).to.equal('function');
+ expect(typeof funcExpressed).to.equal('string');
function funcDeclared() {
return 'this is a function declaration';
}
-
+ // 함수 재할당. 함수 표현식으로 표현돼면 안 끌어올려짐.
funcExpressed = function () {
return 'this is a function expression';
};
@@ -17,38 +17,43 @@ describe('scope 대해서 학습합니다.', function () {
// 자바스크립트 함수 호이스팅(hoisting)에 대해서 검색해 봅니다.
const funcContainer = { func: funcExpressed };
- expect(funcContainer.func()).to.equal(FILL_ME_IN);
+ // 함수 실행을 하려면 () 가 있어야 함.
+ expect(funcContainer.func()).to.equal('this is a function expression');
funcContainer.func = funcDeclared;
- expect(funcContainer.func()).to.equal(FILL_ME_IN);
+ expect(funcContainer.func()).to.equal('this is a function declaration');
});
it('lexical scope에 대해서 확인합니다.', function () {
let message = 'Outer';
function getMessage() {
+ // 이 때 message는 'Outer'
return message;
}
function shadowGlobal() {
let message = 'Inner';
- return message;
+ return message; // 'Inner'
}
function shadowGlobal2(message) {
- return message;
+ return message; // 바로 위의 message
}
function shadowParameter(message) {
message = 'Do not use parameters like this!';
- return message;
+ return message; // 어떤 데이터가 들어와도 재할당 함. 'Do not use parameters like this!' 만 출력됨.
}
- expect(getMessage()).to.equal(FILL_ME_IN);
- expect(shadowGlobal()).to.equal(FILL_ME_IN);
- expect(shadowGlobal2('Parameter')).to.equal(FILL_ME_IN);
- expect(shadowParameter('Parameter')).to.equal(FILL_ME_IN);
- expect(message).to.equal(FILL_ME_IN);
+ expect(getMessage()).to.equal('Outer');
+ expect(shadowGlobal()).to.equal('Inner');
+ expect(shadowGlobal2('Parameter')).to.equal('Parameter');
+ expect(shadowParameter('Parameter')).to.equal('Do not use parameters like this!');
+ expect(message).to.equal('Outer');
+ // shadowParameter();
+ // 함수를 실행해야 밑의 코드가 올바름.
+ // expect(message).to.equal('Do not use parameters like this!');
});
it('default parameter에 대해 확인합니다.', function () {
@@ -56,32 +61,36 @@ describe('scope 대해서 학습합니다.', function () {
return num;
}
- expect(defaultParameter()).to.equal(FILL_ME_IN);
- expect(defaultParameter(10)).to.equal(FILL_ME_IN);
+ expect(defaultParameter()).to.equal(5);
+ // 함수는 매개변수 num을 갖음. 초기값(아무것도 안 넣었을 때 대응하기 위한)이 5이다.
+ // 10이 들어오면 우선순위가 더 높음.
+ expect(defaultParameter(10)).to.equal(10);
function pushNum(num, arr = []) {
arr.push(num);
return arr;
}
-
- expect(pushNum(10)).to.deep.equal(FILL_ME_IN);
- expect(pushNum(20)).to.deep.equal(FILL_ME_IN);
- expect(pushNum(4, [1, 2, 3])).to.deep.equal(FILL_ME_IN);
+ // num에 변수 들어감.
+ expect(pushNum(10)).to.deep.equal([10]);
+ expect(pushNum(20)).to.deep.equal([20]);
+ expect(pushNum(4, [1, 2, 3])).to.deep.equal([1, 2, 3, 4]);
});
it('클로저(closure)에 대해 확인합니다.', function () {
function increaseBy(increaseByAmount) {
+ // 밑 함수는 이름이 없음( 익명함수.) 따로 호출 X. 위 함수를 불러야 실행 가능해짐.
return function (numberToIncrease) {
return numberToIncrease + increaseByAmount;
};
}
-
+ // function (numberToIncrease) {return numberToIncrease + 3};
const increaseBy3 = increaseBy(3);
+ // function (numberToIncrease) {return numberToIncrease + 5};
const increaseBy5 = increaseBy(5);
- expect(increaseBy3(10)).to.equal(FILL_ME_IN);
- expect(increaseBy5(10)).to.equal(FILL_ME_IN);
- expect(increaseBy(8)(6) + increaseBy(5)(9)).to.equal(FILL_ME_IN);
+ expect(increaseBy3(10)).to.equal(13);
+ expect(increaseBy5(10)).to.equal(15);
+ expect(increaseBy(8)(6) + increaseBy(5)(9)).to.equal(28);
/*
mdn에 따르면 클로저의 정의는 다음과 같습니다. 반드시 기억하시기 바랍니다.
@@ -109,28 +118,28 @@ describe('scope 대해서 학습합니다.', function () {
let height = 179;
function outerFn() {
- let age = 24;
+ let age = 24; // 26이 해당됨. 범위 안에 있는게 우선순위가 더 높음. innerFn()이 실행돼서
name = 'jimin';
let height = 178;
function innerFn() {
age = 26;
- let name = 'suga';
- return height;
+ let name = 'suga'; // innerFn에서만 해당. 아무 영향 X
+ return height; // 바로 밖에 있는 178을 반환
}
innerFn();
- expect(age).to.equal(FILL_ME_IN);
- expect(name).to.equal(FILL_ME_IN);
-
+ expect(age).to.equal(26);
+ expect(name).to.equal('jimin');
+ // 함수 자체를 반환. 실행 X
return innerFn;
}
-
+ // 실행돼서 이름이 지민이 됨.
const innerFn = outerFn();
-
- expect(age).to.equal(FILL_ME_IN);
- expect(name).to.equal(FILL_ME_IN);
- expect(innerFn()).to.equal(FILL_ME_IN);
+
+ expect(age).to.equal(27);
+ expect(name).to.equal('jimin');
+ expect(innerFn()).to.equal(178);
});
});
diff --git a/koans/05_ArrowFunction.js b/koans/05_ArrowFunction.js
index 116e39d..b69dd1a 100644
--- a/koans/05_ArrowFunction.js
+++ b/koans/05_ArrowFunction.js
@@ -4,7 +4,7 @@ describe('화살표 함수에 관해서', function () {
return x + y
}
- expect(add(5, 8)).to.eql(FILL_ME_IN)
+ expect(add(5, 8)).to.eql(13)
})
it('화살표 함수 사용법을 익힙니다', function () {
@@ -12,20 +12,22 @@ describe('화살표 함수에 관해서', function () {
const add = (x, y) => {
return x + y
}
- expect(add(10, 20)).to.eql(FILL_ME_IN)
+ expect(add(10, 20)).to.eql(30)
// 리턴을 생략할 수 있습니다
const subtract = (x, y) => x - y
- expect(subtract(10, 20)).to.eql(FILL_ME_IN)
+ expect(subtract(10, 20)).to.eql(-10)
// 필요에 따라 소괄호를 붙일 수도 있습니다
+ // return문과 중괄호를 같이 삭제할 수 있다. 무조건 '같이', 혼자는 안됨.
const multiply = (x, y) => (x * y)
- expect(multiply(10, 20)).to.eql(FILL_ME_IN)
+ expect(multiply(10, 20)).to.eql(200)
// 파라미터가 하나일 경우 소괄호 생략이 가능합니다
const divideBy10 = x => x / 10
- expect(divideBy10(100)).to.eql(FILL_ME_IN)
+ expect(divideBy10(100)).to.eql(10)
})
+ // 파라미터가 없을 경우 소괄호는 무조건 사용해야 합니다.!!!
it('화살표 함수를 이용해 클로저를 표현합니다', function () {
const adder = x => {
@@ -34,19 +36,23 @@ describe('화살표 함수에 관해서', function () {
}
}
- expect(adder(50)(10)).to.eql(FILL_ME_IN)
-
+ expect(adder(50)(10)).to.eql(60)
+ //const subtractor = x => y => x - y;
const subtractor = x => y => {
return x - y
}
-
- expect(subtractor(50)(10)).to.eql(FILL_ME_IN)
+ // function subtractor(x) {
+ // return function (y) {
+ // return x- y;
+ // }
+ //}
+ expect(subtractor(50)(10)).to.eql(40)
const htmlMaker = tag => textContent => `<${tag}>${textContent}${tag}>`
- expect(htmlMaker('div')('javascript')).to.eql(FILL_ME_IN)
+ expect(htmlMaker('div')('javascript')).to.eql('
javascript
')
- const liMaker = htmlMaker('li')
- expect(liMaker('1st item')).to.eql(FILL_ME_IN)
- expect(liMaker('2nd item')).to.eql(FILL_ME_IN)
+ const liMaker = htmlMaker('li') // -> undefined 커링함수.
+ expect(liMaker('1st item')).to.eql('1st item')
+ expect(liMaker('2nd item')).to.eql('2nd item')
})
})
diff --git a/koans/06_Types-part2.js b/koans/06_Types-part2.js
index 52c8bf6..90a40c8 100644
--- a/koans/06_Types-part2.js
+++ b/koans/06_Types-part2.js
@@ -8,12 +8,13 @@ describe('primitive data type과 reference data type에 대해서 학습합니
*/
it('원시 자료형은 값 자체에 대한 변경이 불가능(immutable)합니다.', function () {
let name = 'javascript';
- expect(name).to.equal(FILL_ME_IN);
- expect(name.toUpperCase()).to.equal(FILL_ME_IN);
- expect(name).to.equal(FILL_ME_IN);
+ expect(name).to.equal('javascript');
+ // 원본을 안 바꿈.
+ expect(name.toUpperCase()).to.equal('JAVASCRIPT');
+ expect(name).to.equal('javascript');
// 새로운 값으로 재할당은 가능합니다.
name = name.toUpperCase();
- expect(name).to.equal(FILL_ME_IN);
+ expect(name).to.equal('JAVASCRIPT');
/*
원시 자료형은 값 자체에 대한 변경이 불가능하다고 하는데, 한 변수에 다른 값을 할당하는 것은 변경이 된 것이 아닌가요?
@@ -29,14 +30,14 @@ describe('primitive data type과 reference data type에 대해서 학습합니
let allowedToDrink = overTwenty;
overTwenty = false;
- expect(overTwenty).to.equal(FILL_ME_IN);
- expect(allowedToDrink).to.equal(FILL_ME_IN);
+ expect(overTwenty).to.equal(false);
+ expect(allowedToDrink).to.equal(true);
let variable = 'variable';
let variableCopy = 'variableCopy';
- variableCopy = variable;
- variable = variableCopy;
- expect(variable).to.equal(FILL_ME_IN);
+ variableCopy = variable; // -> variable = 'variable' / variableCopy = 'variable'
+ variable = variableCopy; // -> variable = 'variable' / variableCopy = 'variable'
+ expect(variable).to.equal('variable');
});
it('원시 자료형 또는 원시 자료형의 데이터를 함수의 전달인자로 전달할 경우, 값 자체의 복사가 일어납니다.', function () {
@@ -45,14 +46,14 @@ describe('primitive data type과 reference data type에 대해서 학습합니
year = year + 10;
}
afterTenYears(currentYear);
- expect(currentYear).to.equal(FILL_ME_IN);
+ expect(currentYear).to.equal(2020);
function afterTenYears2(currentYear) {
currentYear = currentYear + 10;
return currentYear;
}
let after10 = afterTenYears2(currentYear);
- expect(currentYear).to.equal(FILL_ME_IN);
- expect(after10).to.equal(FILL_ME_IN);
+ expect(currentYear).to.equal(2020);
+ expect(after10).to.equal(2030);
// 사실 함수의 전달인자도 변수에 자료(data)를 할당하는 것입니다.
// 함수를 호출하면서 넘긴 전달인자가 호출된 함수의 지역변수로 (매 호출 시마다) 새롭게 선언됩니다.
});
@@ -106,20 +107,20 @@ describe('primitive data type과 reference data type에 대해서 학습합니
*/
it('참조 자료형의 데이터는 동적(dynamic)으로 변합니다.', function () {
const arr = [1, 2, 3];
- expect(arr.length).to.equal(FILL_ME_IN);
+ expect(arr.length).to.equal(3);
arr.push(4, 5, 6);
- expect(arr.length).to.equal(FILL_ME_IN);
+ expect(arr.length).to.equal(6);
arr.pop();
- expect(arr.length).to.equal(FILL_ME_IN);
+ expect(arr.length).to.equal(5);
const obj = {};
- expect(Object.keys(obj).length).to.equal(FILL_ME_IN);
+ expect(Object.keys(obj).length).to.equal(0); // 빈배열 출력
obj['name'] = 'codestates';
obj.quality = 'best';
obj.product = ['sw engineering', 'product manager', 'growth marketing', 'data science'];
- expect(Object.keys(obj).length).to.equal(FILL_ME_IN);
+ expect(Object.keys(obj).length).to.equal(3);
delete obj.name;
- expect(Object.keys(obj).length).to.equal(FILL_ME_IN);
+ expect(Object.keys(obj).length).to.equal(2);
});
it('참조 자료형을 변수에 할당할 경우, 데이터의 주소가 저장됩니다.', function () {
@@ -131,23 +132,24 @@ describe('primitive data type과 reference data type에 대해서 학습합니
따라서 일단은 주소만 복사해서 동일한 데이터를 바라보는 게 만드는 것이 효율적입니다.
배열과 객체의 데이터를 복사하는 방법은 06_Array.js, 07_Object.js에서 다룹니다.
*/
- const overTwenty = ['hongsik', 'minchul', 'hoyong'];
- let allowedToDrink = overTwenty;
+ const overTwenty = ['hongsik', 'minchul', 'hoyong']; // 재할당 불가능.
+ let allowedToDrink = overTwenty; // 공유함 같은 주소값o
overTwenty.push('san');
- expect(allowedToDrink).to.deep.equal(FILL_ME_IN);
+ expect(allowedToDrink).to.deep.equal(['hongsik', 'minchul', 'hoyong', 'san']);
overTwenty[1] = 'chanyoung';
- expect(allowedToDrink[1]).to.deep.equal(FILL_ME_IN);
+ expect(allowedToDrink[1]).to.deep.equal('chanyoung');
// .deep.equal은 배열의 요소나 객체의 속성이 서로 같은지 확인하는 matcher입니다.
// .equal아닌 .deep.equal을 사용하는 이유는 아래 테스트 코드를 통해 고민하시기 바랍니다.
const ages = [22, 23, 27];
- allowedToDrink = ages;
- expect(allowedToDrink === ages).to.equal(FILL_ME_IN);
+ allowedToDrink = ages; // 공유 o
+ expect(allowedToDrink === ages).to.equal(true);
const nums1 = [1, 2, 3];
const nums2 = [1, 2, 3];
- expect(nums1 === nums2).to.equal(FILL_ME_IN);
+ // 주소값은 다름. const num1 === const num2 이건 true
+ expect(nums1 === nums2).to.equal(false);
const person = {
son: {
@@ -155,10 +157,10 @@ describe('primitive data type과 reference data type에 대해서 학습합니
},
};
- const boy = person.son;
- boy.age = 20;
- expect(person.son.age).to.equal(FILL_ME_IN);
- expect(person.son === boy).to.equal(FILL_ME_IN);
+ const boy = person.son; // boy -> {age: 9};
+ boy.age = 20; // 값만 변경이라 가능. boy = 20; 이건 불가능
+ expect(person.son.age).to.equal(20);
+ expect(person.son === boy).to.equal(true); // 얕은복사여서 주소가 같음.
/*
아래의 테스트 코드들은 선뜻 받아들이기 힘들 수 있습니다.
diff --git a/koans/07_Array.js b/koans/07_Array.js
index 9c754c8..64fb273 100644
--- a/koans/07_Array.js
+++ b/koans/07_Array.js
@@ -1,8 +1,8 @@
describe('Array에 대해서 학습합니다.', function () {
it('Array의 기본을 확인합니다.', function () {
const emptyArr = [];
- expect(typeof emptyArr === 'array').to.equal(FILL_ME_IN);
- expect(emptyArr.length).to.equal(FILL_ME_IN);
+ expect(typeof emptyArr === 'array').to.equal(false); // typeof는 array 구분이 안되기 때문에 object가 나옴.
+ expect(emptyArr.length).to.equal(0);
const multiTypeArr = [
0,
@@ -14,48 +14,49 @@ describe('Array에 대해서 학습합니다.', function () {
{ value1: 4, value2: 5 },
[6, 7],
];
- expect(multiTypeArr.length).to.equal(FILL_ME_IN);
- expect(multiTypeArr[0]).to.equal(FILL_ME_IN);
- expect(multiTypeArr[2]).to.equal(FILL_ME_IN);
- expect(multiTypeArr[3]()).to.equal(FILL_ME_IN);
- expect(multiTypeArr[4].value1).to.equal(FILL_ME_IN);
- expect(multiTypeArr[FILL_ME_IN][FILL_ME_IN]).to.equal(5);
- expect(multiTypeArr[FILL_ME_IN][FILL_ME_IN]).to.equal(7);
+ expect(multiTypeArr.length).to.equal(6);
+ expect(multiTypeArr[0]).to.equal(0);
+ expect(multiTypeArr[2]).to.equal('two');
+ expect(multiTypeArr[3]()).to.equal(3);
+ expect(multiTypeArr[4].value1).to.equal(4);
+ //expect(multiTypeArr[4]['value2']).to.equal(5); // 문자열로 작성해야함.
+ expect(multiTypeArr[4].value2).to.equal(5);
+ expect(multiTypeArr[5][1]).to.equal(7);
});
it('Array의 요소(element)를 다루는 방법을 확인합니다.', function () {
const arr = [];
expect(arr).to.deep.equal([]);
- arr[0] = 1;
+ arr[0] = 1; // [1]
expect(arr).to.deep.equal([1]);
- arr[1] = 2;
- expect(arr).to.deep.equal([1, FILL_ME_IN]);
-
- arr.push(3);
- expect(arr).to.deep.equal(FILL_ME_IN);
-
- const poppedValue = arr.pop();
- expect(poppedValue).to.equal(FILL_ME_IN);
- expect(arr).to.deep.equal(FILL_ME_IN);
+ arr[1] = 2; //[1, 2]
+ expect(arr).to.deep.equal([1, 2]);
+
+ arr.push(3); // [1, 2, 3]
+ expect(arr).to.deep.equal([1, 2, 3]);
+ // 마지막 요소를 제거함. 함수임.
+ const poppedValue = arr.pop(); // pop 은 우리가 지운요소를 반환함. 빈배열에 pop 할 시 undefined.
+ expect(poppedValue).to.equal(3);
+ expect(arr).to.deep.equal([1, 2]);
});
- it('Array 메소드 slice를 확인합니다.', function () {
+ it('Array 메소드 slice를 확인합니다.', function () { //깊은복사
const arr = ['peanut', 'butter', 'and', 'jelly'];
- expect(arr.slice(1)).to.deep.equal(FILL_ME_IN);
- expect(arr.slice(0, 1)).to.deep.equal(FILL_ME_IN);
- expect(arr.slice(0, 2)).to.deep.equal(FILL_ME_IN);
- expect(arr.slice(2, 2)).to.deep.equal(FILL_ME_IN);
- expect(arr.slice(2, 20)).to.deep.equal(FILL_ME_IN);
- expect(arr.slice(3, 0)).to.deep.equal(FILL_ME_IN);
- expect(arr.slice(3, 100)).to.deep.equal(FILL_ME_IN);
- expect(arr.slice(5, 1)).to.deep.equal(FILL_ME_IN);
+ expect(arr.slice(1)).to.deep.equal(['butter', 'and', 'jelly']);
+ expect(arr.slice(0, 1)).to.deep.equal(['peanut']);
+ expect(arr.slice(0, 2)).to.deep.equal(['peanut', 'butter']);
+ expect(arr.slice(2, 2)).to.deep.equal([]);
+ expect(arr.slice(2, 20)).to.deep.equal(['and', 'jelly']);
+ expect(arr.slice(3, 0)).to.deep.equal([]);
+ expect(arr.slice(3, 100)).to.deep.equal(['jelly']);
+ expect(arr.slice(5, 1)).to.deep.equal([]);
// arr.slice는 arr의 값을 복사하여 새로운 배열을 리턴합니다.
// 아래의 코드는 arr 전체를 복사합니다. 자주 사용되니 기억하시기 바랍니다.
- expect(arr.slice(0)).to.deep.equal(FILL_ME_IN);
+ expect(arr.slice(0)).to.deep.equal(['peanut', 'butter', 'and', 'jelly']); //깊은복사. 1차원 배열일 때만.
});
it('Array를 함수의 전달인자로 전달할 경우, reference가 전달됩니다.', function () {
@@ -66,25 +67,28 @@ describe('Array에 대해서 학습합니다.', function () {
refArr[1] = 'changed in function';
}
passedByReference(arr);
- expect(arr[1]).to.equal(FILL_ME_IN);
+ // 아래는 깊은 복사 코드입니다. 2라인. 원본이 안변함.
+ //passedByReference(arr.slice(0));
+ // passedByReference([...arr])
+ expect(arr[1]).to.equal('changed in function'); // 바뀜 arr 주소값을 전달. 같이 바뀜.
- const assignedArr = arr;
+ const assignedArr = arr; //공유 o 얕은복사.
assignedArr[5] = 'changed in assignedArr';
- expect(arr[5]).to.equal(FILL_ME_IN);
+ expect(arr[5]).to.equal('changed in assignedArr');
- const copiedArr = arr.slice();
+ const copiedArr = arr.slice(); // 0 안넣어도 전체 복사. 깊은 복사( spread syntex [...arr] 사용)
copiedArr[3] = 'changed in copiedArr';
- expect(arr[3]).to.equal(FILL_ME_IN);
+ expect(arr[3]).to.equal('three');
});
it('Array 메소드 shift와 unshift를 확인합니다.', function () {
const arr = [1, 2];
arr.unshift(3);
- expect(arr).to.deep.equal(FILL_ME_IN);
+ expect(arr).to.deep.equal([3, 1, 2]);
const shiftedValue = arr.shift();
- expect(shiftedValue).to.deep.equal(FILL_ME_IN);
- expect(arr).to.deep.equal(FILL_ME_IN);
+ expect(shiftedValue).to.deep.equal(3); // shift() 도 반환함.
+ expect(arr).to.deep.equal([1, 2]); // 원본이 바뀜.
});
-});
+})
diff --git a/koans/08_Object.js b/koans/08_Object.js
index 15fb442..12c67b0 100644
--- a/koans/08_Object.js
+++ b/koans/08_Object.js
@@ -5,8 +5,9 @@ describe('Object에 대해서 학습합니다.', function () {
*/
it('Object의 기본을 확인합니다.', function () {
const emptyObj = {};
- expect(typeof emptyObj === 'object').to.equal(FILL_ME_IN);
- expect(emptyObj.length).to.equal(FILL_ME_IN);
+ expect(typeof emptyObj === 'object').to.equal(true);
+ // => 객체는 길이라는 속성이 기본적으로 정의 X , object는 길이를 못 씀. .key 등으로 배열로 바꿔서
+ expect(emptyObj.length).to.equal(undefined);
const megalomaniac = {
mastermind: 'Joker',
@@ -23,30 +24,30 @@ describe('Object에 대해서 학습합니다.', function () {
},
};
- expect(megalomaniac.length).to.equal(FILL_ME_IN);
- expect(megalomaniac.mastermind).to.equal(FILL_ME_IN);
- expect(megalomaniac.henchwoman).to.equal(FILL_ME_IN);
- expect(megalomaniac.henchWoman).to.equal(FILL_ME_IN);
- expect(megalomaniac.getMembers()).to.deep.equal(FILL_ME_IN);
- expect(megalomaniac.relations[FILL_ME_IN]).to.equal('Lucy');
- expect(megalomaniac.twins['Heath Ledger']).to.deep.equal('FILL_ME_IN');
+ expect(megalomaniac.length).to.equal(undefined); // 왜 5가 아니죠?? => 객체는 길이 개념이 없다.
+ expect(megalomaniac.mastermind).to.equal('Joker');
+ expect(megalomaniac.henchwoman).to.equal('Harley');
+ expect(megalomaniac.henchWoman).to.equal(undefined); // W가 대문자이다. 대소문자를 따짐.
+ expect(megalomaniac.getMembers()).to.deep.equal(['Joker', 'Harley']);
+ expect(megalomaniac.relations[2]).to.equal('Lucy');
+ expect(megalomaniac.twins['Heath Ledger']).to.deep.equal('The Dark Knight');
});
it('Object의 속성(property)를 다루는 방법을 확인합니다.', function () {
const megalomaniac = { mastermind: 'Agent Smith', henchman: 'Agent Smith' };
- expect('mastermind' in megalomaniac).to.equal(FILL_ME_IN);
+ expect('mastermind' in megalomaniac).to.equal(true);
megalomaniac.mastermind = 'Neo';
- expect(megalomaniac['mastermind']).to.equal(FILL_ME_IN);
+ expect(megalomaniac['mastermind']).to.equal('Neo');
- expect('secretary' in megalomaniac).to.equal(FILL_ME_IN);
+ expect('secretary' in megalomaniac).to.equal(false);
megalomaniac.secretary = 'Agent Smith';
- expect('secretary' in megalomaniac).to.equal(FILL_ME_IN);
+ expect('secretary' in megalomaniac).to.equal(true);
delete megalomaniac.henchman;
- expect('henchman' in megalomaniac).to.equal(FILL_ME_IN);
+ expect('henchman' in megalomaniac).to.equal(false);
});
it("'this'는 method를 호출하는 시점에 결정됩니다.", function () {
@@ -63,14 +64,14 @@ describe('Object에 대해서 학습합니다.', function () {
},
};
- expect(currentYear).to.equal(FILL_ME_IN);
- expect(megalomaniac.calculateAge(currentYear)).to.equal(FILL_ME_IN);
+ expect(currentYear).to.equal(2024);
+ expect(megalomaniac.calculateAge(currentYear)).to.equal(54);
megalomaniac.birthYear = 2000;
- expect(megalomaniac.calculateAge(currentYear)).to.equal(FILL_ME_IN);
+ expect(megalomaniac.calculateAge(currentYear)).to.equal(24);
megalomaniac.changeBirthYear(2010);
- expect(megalomaniac.calculateAge(currentYear)).to.equal(FILL_ME_IN);
+ expect(megalomaniac.calculateAge(currentYear)).to.equal(14);
/**
* !!Advanced [this.mastermind]? this.birthYear? this가 무엇일까요?
@@ -99,16 +100,18 @@ describe('Object에 대해서 학습합니다.', function () {
const megalomaniac = {
mastermind: 'Brain',
henchman: 'Pinky',
+ // 함수표현식 익명함수이지만 key를 알면 부를 수 있음.
getFusion: function () {
return this.henchman + this.mastermind;
},
+ // 밑 코드도 함수.
battleCry(numOfBrains) {
return `They are ${this.henchman} and the` + ` ${this.mastermind}`.repeat(numOfBrains);
},
};
- expect(megalomaniac.getFusion()).to.deep.equal(FILL_ME_IN);
- expect(megalomaniac.battleCry(3)).to.deep.equal(FILL_ME_IN);
+ expect(megalomaniac.getFusion()).to.deep.equal('PinkyBrain');
+ expect(megalomaniac.battleCry(3)).to.deep.equal( 'They are Pinky and the Brain Brain Brain');
});
it('Object를 함수의 전달인자로 전달할 경우, reference가 전달됩니다.', function () {
@@ -128,21 +131,23 @@ describe('Object에 대해서 학습합니다.', function () {
refObj.henchwoman = 'Adam West';
}
passedByReference(obj);
- expect(obj.henchwoman).to.equal(FILL_ME_IN);
+ expect(obj.henchwoman).to.equal('Adam West'); // 얕은복사 - 값 공유
- const assignedObj = obj;
+ const assignedObj = obj; // 얕은복사 - 값 공유.
assignedObj['relations'] = [1, 2, 3];
- expect(obj['relations']).to.deep.equal(FILL_ME_IN);
+ expect(obj['relations']).to.deep.equal([1, 2, 3]);
- const copiedObj = Object.assign({}, obj);
+ const copiedObj = Object.assign({}, obj); // 깊은복사 - 상태 공유 X
copiedObj.mastermind = 'James Wood';
- expect(obj.mastermind).to.equal(FILL_ME_IN);
+ expect(obj.mastermind).to.equal('Joker');
obj.henchwoman = 'Harley';
- expect(copiedObj.henchwoman).to.equal(FILL_ME_IN);
+ expect(copiedObj.henchwoman).to.equal('Adam West');
delete obj.twins['Jared Leto'];
- expect('Jared Leto' in copiedObj.twins).to.equal(FILL_ME_IN);
+ // 깊은 복사여도 1차원만 복사됨. 중첩된 배열이기 때문에 복사 x.
+ // for문으로 순회하면서 복사 , JSON 이용해서 복사해야 중첩된 참조자료형도 복사됨.
+ expect('Jared Leto' in copiedObj.twins).to.equal(false);
/*
마지막 테스트 코드의 결과가 예상과는 달랐을 수도 있습니다.
diff --git a/koans/09_SpreadSyntax.js b/koans/09_SpreadSyntax.js
index b6d9331..52a833a 100644
--- a/koans/09_SpreadSyntax.js
+++ b/koans/09_SpreadSyntax.js
@@ -2,21 +2,21 @@ describe('Spread syntax에 대해 학습합니다.', function () {
it('전개 문법(spread syntax)을 학습합니다.', function () {
const spread = [1, 2, 3];
// TODO: 전개 문법을 사용해 테스트 코드를 완성합니다. spread를 지우지 않고 해결할 수 있습니다.
- const arr = [0, spread, 4];
+ const arr = [0, ...spread, 4]; // 깊은복사가 됨.
expect(arr).to.deep.equal([0, 1, 2, 3, 4]);
});
it('빈 배열에 전개 문법을 사용할 경우, 아무것도 전달되지 않습니다.', function () {
const spread = [];
// TODO: 전개 문법을 사용해 테스트 코드를 완성합니다. spread를 지우지 않고 해결할 수 있습니다.
- const arr = [0, spread, 1];
+ const arr = [0, ...spread, 1];
expect(arr).to.deep.equal([0, 1]);
});
it('여러 개의 배열을 이어붙일 수 있습니다.', function () {
const arr1 = [0, 1, 2];
const arr2 = [3, 4, 5];
- const concatenated = [FILL_ME_IN, FILL_ME_IN];
+ const concatenated = [...arr1, ...arr2];
expect(concatenated).to.deep.equal([0, 1, 2, 3, 4, 5]);
// 아래 코드도 같은 동작을 수행합니다.
// arr1.concat(arr2);
@@ -35,9 +35,9 @@ describe('Spread syntax에 대해 학습합니다.', function () {
todos: ['coplit', 'koans'],
};
- const merged = { FILL_ME_IN, FILL_ME_IN };
+ const merged = { ...fullPre, ...me };
// 변수 'merged'에 할당된 것은 'obj1'과 'obj2'의 value일까요, reference일까요?
- // 만약 값(value, 데이터)이 복사된 것이라면, shallow copy일까요, deep copy일까요?
+ // 만약 값(value, 데이터)이 복사된 것이라면, shallow copy일까요, deep copy일까요? deep copy
expect(merged).to.deep.equal({
cohort: 7,
@@ -54,43 +54,47 @@ describe('Spread syntax에 대해 학습합니다.', function () {
function returnFirstArg(firstArg) {
return firstArg;
}
- expect(returnFirstArg('first', 'second', 'third')).to.equal(FILL_ME_IN);
+ expect(returnFirstArg('first', 'second', 'third')).to.equal('first');
function returnSecondArg(firstArg, secondArg) {
return secondArg;
}
- expect(returnSecondArg('only give first arg')).to.equal(FILL_ME_IN);
+ expect(returnSecondArg('only give first arg')).to.equal(undefined);
// rest parameter는 spread syntax를 통해 간단하게 구현됩니다.
function getAllParamsByRestParameter(...args) {
- return args;
+ return args;// type은 배열
}
// arguments를 통해 '비슷하게' 함수의 전달인자들을 다룰 수 있습니다. (spread syntax 도입 이전)
// arguments는 모든 함수의 실행 시 자동으로 생성되는 '객체'입니다.
function getAllParamsByArgumentsObj() {
+ // 매개변수를 arguments가 함수내부적으로 관리함. 매개변수 몇개받을지 모를 때 사용. 라떼 문법... 현재 안씀
return arguments;
+ // {'0': 'first', '1': 'second', '2': 'third'}, 유사객체
}
const restParams = getAllParamsByRestParameter('first', 'second', 'third');
const argumentsObj = getAllParamsByArgumentsObj('first', 'second', 'third');
- expect(restParams).to.deep.equal(FILL_ME_IN);
- expect(Object.keys(argumentsObj)).to.deep.equal(FILL_ME_IN);
- expect(Object.values(argumentsObj)).to.deep.equal(FILL_ME_IN);
+ expect(restParams).to.deep.equal(['first', 'second', 'third']); // 이게 중요
+ expect(Object.keys(argumentsObj)).to.deep.equal(['0', '1', '2']);
+ expect(Object.values(argumentsObj)).to.deep.equal(['first', 'second', 'third']);
// arguments와 rest parameter를 통해 배열로 된 전달인자(args)의 차이를 확인하시기 바랍니다.
- expect(restParams === argumentsObj).to.deep.equal(FILL_ME_IN);
- expect(typeof restParams).to.deep.equal(FILL_ME_IN);
- expect(typeof argumentsObj).to.deep.equal(FILL_ME_IN);
- expect(Array.isArray(restParams)).to.deep.equal(FILL_ME_IN);
- expect(Array.isArray(argumentsObj)).to.deep.equal(FILL_ME_IN);
+ expect(restParams === argumentsObj).to.deep.equal(false);
+ expect(typeof restParams).to.deep.equal('object'); //typeof는 arrray 구분X
+ expect(typeof argumentsObj).to.deep.equal('object');
+ expect(Array.isArray(restParams)).to.deep.equal(true);
+ expect(Array.isArray(argumentsObj)).to.deep.equal(false);
+ // 객체를 배열 형태로 바꿈.
const argsArr = Array.from(argumentsObj);
- expect(Array.isArray(argsArr)).to.deep.equal(FILL_ME_IN);
- expect(argsArr).to.deep.equal(FILL_ME_IN);
- expect(argsArr === restParams).to.deep.equal(FILL_ME_IN);
+ expect(Array.isArray(argsArr)).to.deep.equal(true);
+ expect(argsArr).to.deep.equal(['first', 'second', 'third']);
+ expect(argsArr === restParams).to.deep.equal(false);
});
+ // arguments 쓰지 말자!
it('Rest Parameter는 전달인자의 수가 정해져 있지 않은 경우에도 유용하게 사용할 수 있습니다.', function () {
function sum(...nums) {
@@ -100,8 +104,8 @@ describe('Spread syntax에 대해 학습합니다.', function () {
}
return sum;
}
- expect(sum(1, 2, 3)).to.equal(FILL_ME_IN);
- expect(sum(1, 2, 3, 4)).to.equal(FILL_ME_IN);
+ expect(sum(1, 2, 3)).to.equal(6);
+ expect(sum(1, 2, 3, 4)).to.equal(10);
});
it('Rest Parameter는 전달인자의 일부에만 적용할 수도 있습니다.', function () {
@@ -109,14 +113,15 @@ describe('Spread syntax에 대해 학습합니다.', function () {
function getAllParams(required1, required2, ...args) {
return [required1, required2, args];
}
- expect(getAllParams(123)).to.deep.equal(FILL_ME_IN);
+ expect(getAllParams(123)).to.deep.equal([123, undefined, []]);
function makePizza(dough, name, ...toppings) {
const order = `You ordered ${name} pizza with ${dough} dough and ${toppings.length} extra toppings!`;
return order;
}
- expect(makePizza('original')).to.equal(FILL_ME_IN);
- expect(makePizza('thin', 'pepperoni')).to.equal(FILL_ME_IN);
- expect(makePizza('napoli', 'meat', 'extra cheese', 'onion', 'bacon')).to.equal(FILL_ME_IN);
+ expect(makePizza('original')).to.equal('You ordered undefined pizza with original dough and 0 extra toppings!');
+ const order = `You ordered ${name} pizza with ${dough} dough and ${toppings.length} extra toppings!`;
+ expect(makePizza('thin', 'pepperoni')).to.equal('You ordered pepperoni pizza with thin dough and 0 extra toppings!');
+ expect(makePizza('napoli', 'meat', 'extra cheese', 'onion', 'bacon')).to.equal('You ordered meat pizza with napoli dough and 3 extra toppings!');
});
});
diff --git a/koans/10_Destructuring.js b/koans/10_Destructuring.js
index 7580755..9e2d8c4 100644
--- a/koans/10_Destructuring.js
+++ b/koans/10_Destructuring.js
@@ -3,8 +3,8 @@ describe('구조 분해 할당(Destructuring Assignment)에 관해서', () => {
const array = ['java', 'spring', 'im', 'course']
const [first, second] = array
- expect(first).to.eql(FILL_ME_IN)
- expect(second).to.eql(FILL_ME_IN)
+ expect(first).to.eql('java')
+ expect(second).to.eql('spring')
const result = []
function foo([first, second]) {
@@ -18,9 +18,9 @@ describe('구조 분해 할당(Destructuring Assignment)에 관해서', () => {
it('rest/spread 문법을 배열 분해에 적용할 수 있습니다', () => {
const array = ['java', 'spring', 'im', 'course']
- const [start, ...rest] = array
- expect(start).to.eql(FILL_ME_IN)
- expect(rest).to.eql(FILL_ME_IN)
+ const [start, ...rest] = array
+ expect(start).to.eql('java')
+ expect(rest).to.eql(['spring', 'im', 'course'])
// 다음과 같은 문법은 사용할 수 없습니다. 할당하기 전 왼쪽에는, rest 문법 이후에 쉼표가 올 수 없습니다
// const [first, ...middle, last] = array
@@ -31,26 +31,29 @@ describe('구조 분해 할당(Destructuring Assignment)에 관해서', () => {
const age = 28
const person = {
- name,
- age,
+ name, // '김코딩'
+ age, // 28
level: 'Junior',
}
- expect(person).to.eql(FILL_ME_IN)
+ expect(person).to.eql({
+ name: '김코딩',
+ age: 28,
+ level: 'Junior'})
})
it('객체를 분해합니다', () => {
const student = { name: '박해커', major: '물리학과' }
const { name } = student
- expect(name).to.eql(FILL_ME_IN)
+ expect(name).to.eql('박해커');
})
it('rest/spread 문법을 객체 분해에 적용할 수 있습니다 #1', () => {
const student = { name: '최초보', major: '물리학과' }
- const { name, ...args } = student
+ const { name, ...args } = student // 객체로 묶임.
- expect(name).to.eql(FILL_ME_IN)
- expect(args).to.eql(FILL_ME_IN)
+ expect(name).to.eql('최초보')
+ expect(args).to.eql({major: '물리학과'})
})
it('rest/spread 문법을 객체 분해에 적용할 수 있습니다 #2', () => {
@@ -60,7 +63,7 @@ describe('구조 분해 할당(Destructuring Assignment)에 관해서', () => {
return `${name}님은 ${grade}의 성적으로 ${course}을 수강했습니다`
}
- expect(getSummary(student)).to.eql(FILL_ME_IN)
+ expect(getSummary(student)).to.eql('최초보님은 B+의 성적으로 양자역학을 수강했습니다')
})
it('rest/spread 문법을 객체 분해에 적용할 수 있습니다 #3', () => {
@@ -81,13 +84,38 @@ describe('구조 분해 할당(Destructuring Assignment)에 관해서', () => {
name: '박해커',
age: 20
}
+ /*
+ {
+ name: '박해커',
+ company: {
+ name: 'Javascript',
+ department: 'Development',
+ role: {
+ name: 'Software Engineer'
+ }
+ },
+ age: 20
+ }
+ */
const overwriteChanges = {
name: '박해커',
age: 20,
...user
}
-
+ /*
+ {
+ name: '김코딩',
+ company: {
+ name: 'Javascript',
+ department: 'Development',
+ role: {
+ name: 'Software Engineer'
+ }
+ },
+ age: 35
+ }
+ */
const changedDepartment = {
...user,
company: {
@@ -95,11 +123,55 @@ describe('구조 분해 할당(Destructuring Assignment)에 관해서', () => {
department: 'Marketing'
}
}
+ /*
+ {
+ name: '김코딩',
+ company: {
+ name: 'Javascript',
+ department: ''Marketing'',
+ role: {
+ name: 'Software Engineer'
+ }
+ },
+ age: 35
+ }
+ */
+
- expect(changedUser).to.eql(FILL_ME_IN)
+ expect(changedUser).to.eql({
+ name: '박해커',
+ company: {
+ name: 'Javascript',
+ department: 'Development',
+ role: {
+ name: 'Software Engineer'
+ }
+ },
+ age: 20
+ });
- expect(overwriteChanges).to.eql(FILL_ME_IN)
+ expect(overwriteChanges).to.eql( {
+ name: '김코딩',
+ company: {
+ name: 'Javascript',
+ department: 'Development',
+ role: {
+ name: 'Software Engineer'
+ }
+ },
+ age: 35
+ });
- expect(changedDepartment).to.eql(FILL_ME_IN)
+ expect(changedDepartment).to.eql( {
+ name: '김코딩',
+ company: {
+ name: 'Javascript',
+ department: 'Marketing',
+ role: {
+ name: 'Software Engineer'
+ }
+ },
+ age: 35
+ });
})
})