얕은 복사와 깊은 복사에 대해 알아보기 전에 잠시 데이터 타입을 짚고 넘어가자. 기본형(primitive) 타입: number, string, boolean, undefined, null 등 참조형(reference) 타입: object, array, function, date, regexp 등 결론부터 말하자면 얕은 복사: 객체의 참조값(주소)를 복사 깊은 복사: 객체의 값 자체를 복사 예시와 함께 자세히 살펴보자. 얕은 복사 (Shallow Copy) 1. Object.assign() var obj1 = { a: 10, b: { c: 'abc', }, }; var obj2 = Object.assign({}, obj1); obj2.a = 20; obj2.b.c = 'def'; console.log(ob..

자바스크립트에서 ==와 ===는 비슷해 보이지만 서로 다른 비교 연산자이다. ==는 동등성을 비교하고 ===는 일치성을 비교하는데, 무슨 말인지 조금 더 자세히 살펴보자. == 영어로는 loose equality를 비교한다고 표현한다. 말 그대로 느슨한 동등성을 비교하는 연산자이다. === 보다 느슨하게 동등성을 비교하기 때문에 강제 형변환을 수행한다. 예를 들어 숫자 77과 문자열 '77'을 == 연산자를 사용하여 비교하면 실제로는 타입이 다른 두 값이지만 자바스크립트가 수행한 강제 형변환 때문에 true 값으로 동등하다는 결과가 나온다. 77 == '77' /*true*/ === 영어로는 strict equality를 비교한다고 표현한다. 말 그대로 엄격한 동등성을 비교하는 연산자이다. == 보다 엄..

스프린트 우리 팀 팀원분께서 공유해주신 "Flexbox Froggy"라는 교육용 코딩 게임. CSS의 flexbox를 이용해서 같은 색깔의 개구리와 연잎을 매치시켜주는 게임이다. 이제 막 flexbox 개념을 배웠다면 쉽고 재미있게 flex와 친해질 수 있는 게임이다.  Flexbox FroggyA game for learning CSS flexboxflexboxfroggy.com 공부하다가 머리 환기 시킬 겸 해봤는데 재미있고,유익하고,귀엽다!  끝까지 완료해보니 같은 팀에서 개발한 여러가지 다른 게임들도 있다. CSS 뿐만 아니라 HTML, JS,  SQL도 재미있게 학습해볼 수 있다. (다만 대부분 유료이고, 앞서 언급한 Flexbox 속성 게임과 Grid 속성 게임은 무료로 풀려있다.)  Code..