인생은 반복문

1. 바닐라JS 2주완성 챌린지 4일차이다. 아침 9시부터 11시까지 2시간 정도 소요됐던 것 같다. 아직까진 eventListener에 대해 다루며 익숙해지는 시간인거 같다. 마찬가지로 과제 코드에 대해 깃허브에 업로드 했다. 2. 블랙커피 스터디 레벨1 5기에서 첫 페어프로그래밍 시간을 가졌다. 짝은 랜덤으로 매칭이 되었는데 나와 짝이 된 분은 React Native 개발자 분이셨다. todoList 구현에 대한 미션을 번갈아가며 같이 해결해야했는데 많은 것을 배울 수 있던 시간이었다. code convention 부분부터 내가 모르던 많은 문법, 혼자 공부 했으면 몰랐을 세세한 설정까지 화면 공유를 통해 현업에서 일하는 사람의 실력을 엿볼수 있었다. 제일 기억에 남은 것은 그 분의 검색 능력이었다...

1. 노마드코더 바닐라JS 2주완성 챌린지: 드디어 코딩 과제가 시작됐다. EventHandler를 이용해 다양한 event에 대해 binding해야하는 과제였는데 3일차부터 제법 난이도가 느껴졌다. 2주차 과제부터 많이 힘들다는데 정말 그럴거 같다고 느꼈다. 그래도 무사히 완료해서 제출을 했고 그 과정에서 javascript의 function이 값으로 쓰일 수 있다는 정보를 알게 되었고 이 정보에 대해서는 생활코딩 강의를 통해 약간의 개념 정리만 하고 넘어갔다. 나중에 콜백, 비동기 처리할 때 좀 더 자세히 공부해야지. 오늘도 마찬가지로 과제에 대한 코드를 github private repository에 업로드 하는 것으로 챌린지 3일차 종료. 2. 블랙커피 프론트엔드 레벨1: 미션1 과제 진행을 시작..

*혼자 내용 정리를 위해 작성하는 글이라 정확하지 않은 정보가 포함되어 있을 수 있습니다. addEventListener: event를 binding한다. binding이란 event에 대한 반응을 어떻게 할 지 정의하는 과정이다. *event는 마우스 클릭, 키보드 입력, 창 조절 같은 사용자가 행하는 특정 행위라고 할 수 있다. 자세한 event 목록은 MDN의 event reference를 보면 확인할 수 있다. // 예시 코드 const title = document.querySelector("h1"); title.addEventListener("click", handleClick); // click: event // handleClick: listener parameter로는 event와 lis..

*혼자 내용 정리를 위해 작성하는 글이라 정확하지 않은 정보가 포함되어 있을 수 있습니다. // 예시1 function print() { console.log("hello world"); } // 예시2 const print = function() { console.log("hello world"); } // 예시3 (function() { console.log("hello world"); })(); 함수 부분을 다루다 특이하게 생긴 함수들을 발견했다. 예시2, 3이다. 예시1과 2는 같은 함수를 표현만 다르게 한 것이고 예시3은 일회성 함수, 익명함수라고 한다. 특징은 선언과 동시에 호출하는 것. javascript는 다른 언어와 다르게 함수를 값처럼 다룰 수 있다고 한다. const print = f..

1. 블랙커피 레벨1 스터디 5기가 시작되었다. 오늘은 첫 온라인 세션을 가졌는데 간단히 메이커준님이 자기소개와 블랙커피 스터디의 취지 등을 말씀하시며 시작되었다. 그리고 4주 동안의 과정 설명과 페어프로그래밍, 미션 등에 대해 간단히 안내 받고 끝이 났다. 따로 강의가 없고 미션과 미션을 해결하기 위한 가이드라인, 슬랙채널의 질문게시판만을 활용하여 스스로 해결해야하는 점이 특징이다. 스터디 기간동안 자기주도적으로 미션에 열심히 참여해서 꼭 얻어가는 것이 많았으면 좋겠다. 특히 매주 온라인 세션에서, pull request로 묶이는 팀에서, 짝프로그래밍에서 묶이는 페어에서 코드 리뷰 를 받을 수 있다는 것이 제일 좋은 것 같다. 혼자 공부하는 입장에서 이렇게 여러 사람이 코드를 봐준다는 것은 스스로의 코..

*혼자 내용 정리를 위해 작성하는 글이라 정확하지 않은 정보가 포함되어 있을 수 있습니다. "localStorage를 사용하면 Document's origin의 Storage 객체에 접근할 수 있습니다. 저장한 데이터는 브라우저 세션 간에 공유됩니다. localStorage는 sessionStorage와 비슷하지만, localStorage의 데이터는 만료되지 않고 sessionStorage의 데이터는 페이지 세션이 끝날 때, 즉 페이지를 닫을 때 사라지는 점이 다릅니다. ("사생활 보호 모드" 중 생성한 localStorage 데이터는 마지막 "사생활 보호" 탭이 닫힐 때 지워집니다.) localStorage에 저장한 자료는 프로토콜 별로 구별 합니다. 특히 HTTP로 방문한 페이지에서 저장한 데이터는 ..

*혼자 내용 정리를 위해 작성하는 글이라 정확하지 않은 정보가 포함되어 있을 수 있습니다. 1. 어떤 용도? 입력된 함수를 특정 시간을 주기로 반복하기 위해 사용된다. WindowOrWorkerGlobalScope mixin를 통해 사용된다. 해당 mixin은 Window, Worker interface를 통해 구현되었다. 참고로 mixin은 간단히 말해 여러 클래스, 인터페이스를 통해 구현될 수 있으며 구현된 mixin은 자신을 구현한 클래스, 인터페이스로부터 속성과 메소드를 가져와 사용할 수 있다. + 오리지널 자신의 속성, 메소드도 존재할 수 있다. 2. parameter setInterval(func, 1000); 이런식으로 사용한다. func은 반복시킬 함수명이다. 여기서 주의할 것은 뒤에 '(..

*혼자 내용 정리를 위해 작성하는 글이라 정확하지 않은 정보가 포함되어 있을 수 있습니다. var, let의 차이가 뭘까? 그리고 왜 var보다 let 사용을 권장할까? let은 block scope를 지원하기 때문이다. 하지만 var는 지원하지 않는다. 그럼 무슨 문제가 발생할까? // 예시 코드 - var for(var i = 0; i < 3; i++) { console.log(i); for(var i = 0; i < 3; i++) { console.log(i); } } // 출력 결과 0 0 1 2 출력 결과가 좀 이상하지 않은가? 적어도 block scope를 지원하는 언어를 다루던 사람 입장에선 이상하게 느껴질 것이다. 대략 짐작했겠지만 해당 코드에서는 안쪽 반복문에서 바깥쪽 반복문의 i에 관여..