DevLog

🎁 Daily - JavaScript 클래스(class) 학습 - 클래스(Class)와 오브젝트(Object)의 차이점 학습 🤔 Learned 클래스(Class)란? 서로 관련 있는 데이터(fields, method)를 한 곳에 묶어 놓은 컨테이너를 말한다. class Person{ // fields(속성) name; age; // method(행동) speak(); } 위 코드를 보면 Person이라는 이름의 클래스(Class)는 name과 age라는 property가 들어있고 말을 하는 기능 speack()라는 이름의 function이 있습니다. 이렇게 클래스(Class) 안에는 name과 age 같은 속성, 즉 Fields가 들어있고 그리고 행동이라고 볼 수 있는 method가 들어있습니다. 그래서..

🎁 Daily - JavaScript 비동기 JSON 개념 학습 - XML과 JSON의 공통점과 차이점 학습 🤔 Learned JSON(JavaScript Object Notation) JSON은 좀 더 쉽게 데이터를 교환하고 저장하기 위하여 만들어진 텍스트 기반의 데이터 교환 표준입니다. JSON은 XML의 대안으로서 좀 더 쉽게 데이터를 교환하고 저장하기 위하여 고안되었습다. 또한, JSON은 텍스트 기반이므로 어떠한 프로그래밍 언어에서도 JSON 데이터를 읽고 사용할 수 있습니다. XML(EXtensible Markup Language) XML은 HTML과 매우 비슷한 문자 기반의 마크업 언어(text-based markup language)입니다. 이 언어는 사람과 기계가 동시에 읽기 편한 구조로..

🎁 Daily - Section 1 Hiring Assessments - 밀린 레퍼런스 자료 읽기, 깃허브& 블로그 정리 🤔 Learned 어제, 오늘 이틀간 있었던 ha테스트 때문에 공부한다고 바빴기도 했고 심적인 여유도 없어서 블로깅을 못 하고 있었다. 다행히도 시험은 통과했고, 시험을 준비하는 과정 중에 많은 것들을 배울 수 있었다 부끄럽지만 용기내서 질문도 해보았고, 복습의 중요성도 깨닫게 되었고, 끝까지 파다 보면 답이 보인다는 것도 깨달았다. Solo Day와 주말을 포함해 3일 간의 소중한 시간이 생겼다. 밀린 블로깅, 공부계획, 클론코딩, 알고리즘 공부, 복습 등 3일동안 후회 없게 사용해야겠다 . 🌈 Tomorrow 밀린 TIL 블로깅 정리 고차함수 챕터 다시 복습 후 코플릿 처음부터 다..

🎁 Daily JSX문법 학습 및 활용, map을 이용한 반복 활용, React 학습 간단한 React 앱 만들기(JSX 문법을 사용) 🤔 Learned JSX 규칙 - 하나의 엘리먼트 안에 모든 엘리먼트를 포함한다. - 엘리먼트 클래스 사용 시, className 으로 표기한다. - JavaScript 표현식 사용 시, 중괄호({}) 이용 - 사용자 정의 컴포넌트는 대문자로 시작 - 조건부 렌더링에는 삼항연산자 사용 - 여러 개의 HTML 엘리먼트를 표시할 때, map() 함수를 이용 React 에서 map()을 사용해서 엘리먼트를 표시하는 부분은 정말 중요하다! const Tweets = () => { return ( {dummyTweets.map((tweet) => { const isParkHack..

🎁 Today 일급 객체의 특징 학습 고차함수 개념 학습 내장 고차함수(filter, map, reduce)학습 및 내장 고차함수를 사용하여 간단한 알고리즘 문제풀이 🤔 Learned First-class citizen : 일급객체 - 특별한 대우를 받는 함수 비행기에는 First class가 있습니다. 이코노미 클래스와는 탑승수속부터 기내식, 수하물이 나오는 순서까지 항공사와 관련된 모든 부분에서 혜택이 다릅니다. First class 좌석을 구매한 사람은 비싼 가격을 치르고, 항공사로부터 특별한 대우를 받습니다. 자바스크립트에도 특별한 대우를 받는 일급 객체(first-class citizen)가 있습니다. 대표적인 일급 객체 중 하나가 함수입니다. (자바스크립트가 나온 시점을 고려했을 때,) 자바스..

🎁 Daily 이벤트 객체 학습 DOM으로 HTML 조작하기 🤔 Learned onclick에 직접 할당하는 것과 addEventListener의 차이 onclick document.getElementById('test').onclick = () => { alert('hello! I'm onclick'); } addEventListener document.getElementById('test').addEventListener('click',()=>{ alert('hello! I'm addEventListener'); },false);​ 두 가지 방법이 있지만 일반적으로 addEventListener 방법을 쓰는 것이 장점이 더 많다. addEventListener 장점 : 여러 개의 이벤트를 호출할 수 ..

🎁 Daily DOM(Document Object Model), 유효성 검사(Form validation) 학습 DOM을 이용한 유효성 검사(아이디, 패스워드) 🤔 Learned 이벤트(event) - DOM에서 이벤트는 마우스를 클릭하거나, 키보드를 누르는 등의 사용자 액션에 의해 발생한다. - 브라우저 창 크기를 조절하거나, 스크롤하는 것도 DOM 이벤트의 일종이다. - 이벤트가 발생할 때 실행되는 함수를 이벤트 핸들러라고 부른다. - 이벤트와 관련된 속성은 on이라는 접두어가 붙는다. (onclick, onkeyup 등) CRUD(Create, Read, Update and Delete)를 이용하여 DOM을 제어 - CREATE(생성) : const tweetDiv = document.createE..

🎁 Daily 기초 파이썬 알고리즘 문제풀이 koans 10번 마무리하고 push 🤔 Learned 구조 분해 할당이라는 개념이 너무 낯설어서 아래 코드만 거의 1시간 이상 본 것 같다. 완전히 이해한 것이 아니라서 몇번이고 반복해서 복습해야겠지만 아래 코드가 말하고자 하는 것은 rest/spread 문법을 객체 분해에 적용할 수 있냐 없냐를 묻는 것인데 일단 지금까지 이해한 것을 바탕으로 간단하게 정리해보자면 첫번째 changeUser 변수에 user객체를 복사해서 할당해주고 name과 age 프로퍼티 값을 재할당 해주는 것이다. 두번째 overwriteChanges 변수에 객체 프로퍼티로 name: '박해커', age: 20 이 있는데 user객체를 복사해서 할당해주면서 프로퍼티가 덧씌워지고 결국 복..