yeeendy

이번 주차는 알고리즘을 중점적으로 푸는 주간이었다. 초반부 문제들은 내장메서드를 알고있으면 쉽게 풀 수 있는 문제들이 많았고 후반부로 갈 수록 수학공식을 알아야 한다던가 발상의 전환이 필요한 문제들이 많아서 시간이 더 많이 걸렸던 것 같다. 스터디를 구성할 기회가 생겨 면접스터디를 구성했는데 스터디를 진행하며 부족한 CS부분을 더 보충해서 공부할 수 있을 것 같아서 기대된다. 잘한 점 다음 주부터 들어가는 리액트를 대비하여 언어 공부가 더 필요할 것 같았고, 전체적인 흐름을 파악해야(객체지향, 불변성, 서버-클라이언트 아키텍처 등) 앞으로 다가올 문제들도 잘 풀 수 있을 것 같아서 필수로 풀어야 하는 문제들을 빨리 풀고 자바스크립트 공부를 더 세심하게 했다. 부트캠프 2번째인 만큼 내가 부족한 부분이 어..

이벤트 예를 들어 클릭했을 때 페이지가 넘어가는 등 이벤트가 발생하면 그에 맞는 반응을 해야 한다. 이를 위해 이벤트는 일반적으로 함수에 연결되며 그 함수는 이벤트가 발생하기 전에는 실행되지 않다가 이벤트가 발생되면 실행된다. -> 이 함수를 이벤트 핸들러라고 한다. 이벤트 루프(Event Loop) 브라우저는 단일 스레드(single-thread)에서 이벤트 드리븐(event-driven) 방식으로 동작한다. 단일 스레드 : 스레드가 하나뿐이라는 의미, 곧 하나의 작업만을 처리할 수 있다 하지만 실제로 동작하는 웹 애플리케이션은 많은 task가 동시에 처리되는 것처럼 느껴진다. 이처럼 자바스크립트의 동시성(Concurrency)을 지원하는 것이 바로 이벤트 루프(Event Loop)다. 주요하게 생각할..

다음 주 리액트과정 들어가기 전 알아두면 좋은 JS 내용들을 다시 한번 잡고 들어가보자 객체 자바스크립트는 객체 기반의 스크립트 언어이며 자바스크립트를 이루고 있는 거의 모든 것이 객체다. 원시 타입을 제외한 나머지 값들(함수, 배열, 정규표현식 등)은 모두 객체이다. 자바스크립트의 객체는 키와 값으로 구성된 프로퍼티들의 집합이다. 프로퍼티 값으로 함수를 사용할 수도 있으며 프로퍼티 값이 함수일 경우, 일반 함수오 구분하기 위해 메소드라 부른다 객체 생성 방법 3가지! 객체 리터럴 Object 생성자 함수 생성자 함수 // 1. 객체 리터럴 const emptyObj = {}; console.log(typeof emptyObj) // object const person = { name: 'Lee', sa..

35개 가량의 알고리즘 풀면서 내가 자주 헷갈리던 메소드를 정리해보자 isNaN 어떤 값이 NaN인지 판별 반환 값 : true or false isNaN(NaN) //true isNaN(undefined) //true isNaN({}) //true isNaN(true) //false isNaN(null) //false isNaN(37) //false substr() 문자열에서 특정 위치에서 시작하여 특정 문자 수 만큼의 문자들을 반환 str.substr(start[, length]) start 추출하고자 하는 문자들의 시작위치 음수일 경우, 문자열총길이 + start의 값으로 취급 length 추출할 문자들의 총 숫자 const str = 'yeeendy'; console.log(str.substr(3..

2월 5일에 시작해 어느덧 한 주가 끝났다. 두 번째로 배우는 만큼 이번에는 더 잘해보겠다고 잠자는 시간도 줄여 공부했고 안 하던 아침운동도 시작했다. 잠이 많던 나로서는 매우 피곤했지만 그래도 일주일 내내 했다고 차차 적응되어 가고있다. 열정이 가득한 사람들이 많이 모인 만큼 공부가 더 잘 됐다. 함께 지식을 나눌 메이트도 생겨서 더 집중도 잘 되고 지식에 대해 회고도 하며 심도있게 공부할 수 있었다. 내가 더 보완해야할 부분은 글실력이 부족해서 블로깅을 나만 볼 메모처럼 하는 경향이 있는데 더 성심성의껏 블로깅 작성하고 싶다. 내 스스로 지금이 가장 열심히 살고 있다고 자부할 수 있는데, 앞으로도 지금 열정 그대로 유지해서 아프지 않고 무리하지만 무리하지 않게 열심히 공부해서 좋은 결과물을 얻고싶다...

DOM(Document Object Modeling) HTML 문서의 계층적 구조와 정보를 표현하며 이를 제어할 수 있는 API, 즉 프로퍼티와 메서드를 제공하는 트리 자료구조 브라우저 환경에서 확인 할 수 있다. Node환경에서는 확인 불가능 브라우저에 내장되어 있기 때문에 HTML 내용을 javascript로 접근, 제어 가능 모든 요소와 요소의 어트리뷰트, 텍스트를 각각의 객체로 만들고 이들 객체를 부자 관계를 표현할 수 있는 트리 구조 모든 DOM의 node들은 '속성'과 '메서드'를 갖고있음 Node 객체의 속성은 값 => 해당 객체의 특성을 나타내는 값을 가져오거나 설정 메서드는 동작을 수행 => 해당 객체가 수행하는 작업을 나타내는 함수 //Finding // 해당 id명을 가진 요소 하나를..

콜백함수 함수의 매개변수를 통해 다른 함수의 내부로 전달되는 함수 ex) forEach, setTimeout 제어권을 넘겨줄테니 너가 알고 있는 그 로직으로 처리해줘! -> 즉, 콜백함수는 다른 코드(함수 또는 메서드)에게 인자로 넘겨줌으로써 그 제어권도 함께 위임한 함수 -> 콜백함수를 위임받은 코드는 자체적으로 내부 로직에 의해 이 콜백 함수를 적절한 시점에 실행 * 고차 함수 : 매개변수를 통해 함수의 외부에서 콜백 함수를 전달받은 함수 동기 / 비동기 promise를 async/await으로 리팩토링 해보자! 참조 - 생활코딩 1초마다 실행되는 코드를 작성해보았다 function timer(time) { return new Promise(function (resolve) { setTimeout(f..

실행 컨텍스트(Execute Context) 실행할 코드에 제공할 환경 정보들을 모아놓은 객체 실행 컨텍스트가 활성화되는 시점에 다음과 같은 일을 한다. 선언된 변수를 위로 끌어올린다. (= 호이스팅) 외부 환경 정보를 구성한다. this 값을 설정한다. 어려울 땐 콘솔로 디버깅하며 확인해보는 것이 도움된다! 예제) 생활코딩 참조 n0 - Global Scope에 쌓인다 var로 선언한 v0도 - Global Scope에 쌓인다 let과 const로 선언한 l0, c0은 Script Scope에 쌓인다 Global에서 가져온 변수는 Window.v0해도 출력된다. console.log(window.v0, window.n0, window.l0, window.c0); 출력값으로 => v0 n0 undefin..

JS 2주차 강의 들으면서 잘 기억해 둘 것만 작성해보자 구조분해할당은 처음엔 어려웠지만 재차 반복하면서 익숙해졌다. 일급객체는 참 완벽히 이해하기가 어려운 것 같다. 구조분해할당 배열이나 객체의 속성을 분해해서 그 값을 변수에 담을 수 있게 해주는 문법 배열 let [value1, value2] = [1, "new"]; console.log(value1, value2); // 1, "new" let arr = ["value1", "value2", "value3"]; let [a,b,c] = arr; console.log(a,b,c) // value1 value2 value3 // let [a,b,c] = arr; 은 아래와 동일! // let a = arr[0]; // let b = arr[1]; //..

오늘의 커리큘럼은 javascript 1주차 강의 듣고 간단한 팀 git과제를 하는 날이었다 봐도봐도 헷갈리는 개념만 다시 짚고 넘어가야겠다 git 너무 어렵다~!!!!!! 배열 고차 함수 Array.prototype.forEach forEach메서드는 for 문을 대체할 수 있는 고차 함수다. 자신의 내부에서 반복문을 실행한다. 원본 배열을 변경하지 않는다 하지만 콜백 함수를 통해 원본 배열을 변경할 수는 있다 forEach 메서드의 반환값은 언제나 undefined 단순히 반복문을 대체하기 위한 고차 함수 const numbers = [1, 2, 3]; const pows = []; numbers.forEach((i) => pows.push(i * 2)); console.log(pows); // [2..