1. Set 객체와 배열 Set 객체는 중복되지 않는 유일한 값들의 집합입니다. Set 객체는 배열과 유사한 점이 많지만 다음과 같은 차이가 있습니다. 구분배열Set 객체동일한 값을 중복하여 포함할 수 있다OX요소 순서에 의미가 있다OX인덱스로 요소에 접근할 수 있다OX또한 Set 객체는 수학적 집합을 구현하기 위한 자료구조이기에 Set를 통해 교집합, 합집합, 차집합, 여집합 등을 구현할 수 있습니다.Set 객체는 Set 생성자 함수로 생성하며 이 때 인수를 전달하지 않으면 빈 Set 객체가 생성됩니다.const set = new Set();console.log(set); // Set(0) {}Set 생성자 함수는 이터러블을 인수로 전달받아 Set 객체를 생성합니다. 이 때 이터러블의 중복된 값은 Se..

1. What is DOM?DOM은 Document Object Model의 약자로, HTML 요소를 JavaScript Object처럼 조작할 수 있는 모델입니다.DOM은 웹페이지의 콘텐츠 및 구조, 그리고 스타일 요소를 구조화 시켜 표현하여 프로그래밍 언어가 해당 문서에 접근하여 읽고 조작할 수 있도록 API를 제공하는 일종의 인터페이스입니다. 즉 자바스크립트와 같은 스크립팅 언어가 쉽게 웹 페이지에 접근하여 조작할 수 있게끔 연결시켜주는 역할을 담당합니다.만들고자 하는 웹 사이트가 단순하게 정보의 전달만을 목적으로 하는 정적인 웹이라면 HTML과 CSS만으로도 충분합니다. 하지만 그 이상의 동적인 기능을 구현하려고 한다면 자바스크립트와 DOM이 반드시 필요하게 됩니다.2. DOM의 구조DOM은 HT..

JSX?JSX는 JavaScript XML의 줄임말입니다. JSX는 React에서 UI를 구성할 때 사용하는 문법으로, JavaScript를 확장한 문법입니다.JSX는 브라우저가 바로 실행할 수 있는 코드는 아닙니다. JSX로 작성된 코드를 브라우저가 이해할 수 있는 JavaScript 코드로 변환해주는 과정이 필요한데, 이 때 사용되는 것이 바로 Babel입니다. Babel은 JSX를 JavaScript 코드로 컴파일해주고 브라우저가 변환된 코드를 읽고 화면에 렌더링할 수 있게 해줍니다.React에서는 DOM과 다르게 CSS, JSX 문법만으로 웹 애플리케이션 개발을 할 수 있습니다. 각각의 컴포넌트 구현을 위해 필요한 파일이 줄어들고, 한눈에 컴포넌트를 확인할 수 있죠. JSX를 활용하면 JavaS..

재귀: 원래의 자리로 되돌아가거나 되돌아오는 것을 뜻함재귀함수는 자기 자신을 호출하는 함수를 말합니다.function recursion () {console.log("이것은")console.log("재귀함수입니다.")recursion()}//함수 recursion은 무한히 콘솔로그를 찍는 재귀함수입니다.함수 recursion은 자기 자신을 끝없이 호출합니다. 이 함수는 그저 콘솔로그에 무한히 문장을 출력하는 딱히 써먹을 곳이 없는 함수일 뿐이지만, 재귀함수의 이런 특성을 잘 활용하면 반복적인 작업을 해야 하는 문제가 발생했을 때, 좀 더 간결한 코드로 해결할 수 있습니다. 재귀 함수를 언제 써야 할까요?어떤 문제가 비슷한 구조의 더 작은 문제로 나누어지는 경우중첩된 반복문이 많거나 반복문의 중첩 횟수를 ..

첫 주차가 눈 깜짝할 새 지나가는 동안 HTML과 CSS를 개략적으로 배우고 난 뒤 2주차 첫 날부터 곧바로 JavaScript를 배우게 되었다. HTML과 CSS는 그래도 무엇인가 코드에 변화를 주면 시각적으로 바로 나타나기 때문에 직관적으로 이해할 수 있었지만, 자바스크립트는 무엇인가 잘못된 부분이 있을 경우 에러가 날 뿐이기 때문에 문제의 원인을 파악하기가 생각보다 쉽지 않았다. 또한 기본적인 수준이지만 수학적인 사고력도 조금 필요한 부분이 있어서, 수학에 굉장히 약한 나로서는 지레 겁을 먹고 시작할 수밖에 없었다. 하지만 프론트엔드 개발자라면 반드시 익숙해져야 할 언어 중의 하나가 바로 자바스크립트이기 때문에 기초적인 개념을 반복해서 암기함과 동시에, 표현식을 자유자재로 사용해 보면서 문법에 익숙..