본문 바로가기

전체 글

(47)

11월 중순에 기록하는 2020년 회고록 ✍🏻 2020년 2월, 티스토리를 개설한 뒤 1일 1 포스팅을 시작했고, 프론트엔드 기술 트렌드 파악의 중요성과 공부해야 할 기술이 많다는 것을 체감했다. 취업 이후 수동적이고 안일했던 내 모습을 후회하면서, 내게 부족한 점이 무엇인지, 나아가야 할 방향에 대해서 구체적으로 파악할 수 있는 계기가 되었다. 구글 애드센스 승인에 도전하였으나 아직도 이해하지 못한 이유 때문에 실패했다... 4월 무렵 개인적인 사정으로 의욕이 급감한 뒤 약 8개월의 시간이 흘렀고, 추석 연휴 동안 갑자기 나타난 인생 선배의 조언을 듣고 머리를 띵 하고 맞은듯한 자극을 받아 10월이 되어서야 포스팅을 재개했다. ✍🏻 2020년 10월, 조언의 내용은 다음과 같았다. 1. 막막할수록 action을 취해야 후련해진다. --> 즉각..

클로져 (Closure) 클로져는 함수와 함수에 의해 생성되는 scope 객체를 함께 지칭하는 용어입니다. - MDN 'JavaScript 재입문하기 (JS 튜토리얼) 클로져는 JavaScript를 공부한다면 한 번쯤 골머리를 썩게 하는 알 듯 말듯한(?) 개념이다. scope와 closure 개념을 이론적으로 이해가 되었더라도 막상 코드를 작성하다 보면 이해가 가지 않는 상황이 와 버린다.. (모든 개발 언어가 그렇겠지만 항상 새롭다..^^) 최근 여러 강의들을 들으면서 접한 클로저에 대한 내용을 복기하고자 포스팅을 적어본다. function makeAdder(a) { return function(b) { return a + b; }; } var add5 = makeAdder(5); var add20 = makeAdder(20..

[코드스피츠 87, 88] 위임된 속성 & async await ✔️코드스피츠 87 - JS의 위임된 속성 (Delegated Property) *Property 은닉과 캡슐화되어있는 것 *Property to Object --> delegate ✔️코드스피츠 88 - async await #1/2 *Sync Flow 메모리에 적재된 명령이 순차적으로 실행됨 *Sync Flow Control Goto를 통해 명령의 위치를 이동함 *Sub Flow 함수 등을 통해 별도의 명령 셋을 여러 번 실행함 (예제) function : 반복 사용할 수 있다. (sub flow에 속함) promise : 한번 사용되면 파기되고 다시 만들어야 함 (sub flow가 아님) *Blocking Sync Flow가 실행되는 동안 ㅏ른 일을 할 수 없는 현상 멀티태스킹 불가능 (노이만 머신..

[코드스피츠 78] ES6+함수와 OOP ✔️코드스피츠 78 - ES6+함수와 OOP 1회차 *Sub Routine Flow 메인 플로우가 아니라 서브루틴을 중심으로 보고 함수가 아니라 루틴의 관점에서 본다. -ES6에서는 function을 절대 쓰지 않는다. 왜? Class의 method에 정의하기 때문 this(function)는 의미가 없어진다. -Arrow Function 사용 -method는 class 구문으로 대체 *value vs reference 서브루틴에서 return 하는 게 ref 값이면 메인 플로우 안에 있는 원본 데이터를 변경시킬 가능성이 있다. 따라서, 되도록 서브루틴의 리턴 값은 1. readonly로 반환한다. 2. 또는 새 객체로 만들어 반환한다. *Structured Design(구조적 설계) by 래리 콘스탄틴..

[코드스피츠 77] ES6+ 기초 편 ✔️코드스피츠 77 - Es6+ 기초 편 1회차 *개발 시 생각해야 하는 요인들 철학 : 합리주의와 상대주의 가치 : 의사소통, 단순함, 유연함 원칙 : 지역화, 중복제거, 대칭성(get, set) 패턴 : 개발론, 설계론, 각종 적용 패턴 동기 : 돈, 시간 *Program & Timing -Compile Program language code (lint time) Machine Language (compile time) file Load* Run (run time) Terminate (context error) -Script Program language code (lint time) file Load* Machine Language Run (run time) Terminate *Runtime -cp..

코드스피츠 ES6 객체지향 JavaScript 강의를 듣고 든 생각들 ✔️코드스피츠 77, 78, 88 강의를 듣고... 본격적으로 ES6 VanillaJS 공부를 시작한 지 어느덧 2주가 넘었다. 그 간 노마드코더의 TodoApp ChromeApp 클론 코딩을 진행했는데 강의 텀이 짧은만큼 내용이 간결화되어있어 수강하기 간편한 만큼 내가 제대로 이해한 것인지 확신하기 어려웠다. 그러던 중 현재 소속되어있는 react 관련 오픈 카톡방에서 새로운 유튜브 무료 강의를 추천받았다. 이름은 코드 스피츠. 구글이던 책이던 초보 JavaScript 입문자를 위한 강의는 굉장히 많다. 조금 더 JS 언어 근본적인 구조와 프로세스를 이해하기 좋다고 무작정 ES6 JS OOP 관련 강의를 재생했다. 결과는 신세계 -! ✨ 그저 암기처럼 느껴지던 클로저 개념과 컨텍스트 등 실무 중 와 닿..

JavaScript의 Array 관련 함수들 자바스크립트의 알고리즘 공부를 하다보면 Array 관련 메소드들을 활용이 비일비재하다. 가장 자주 사용되고 기본적으로 알고 있어야 할 prototype 함수들을 정리해보고자 한다. Array.from() console.log(Array.from('foo')); // expected output: Array ["f", "o", "o"] console.log(Array.from([1, 2, 3], x => x + x)); // expected output: Array [2, 4, 6] console.log(Array.from({ a: '1', b: '2' })); // [] : object는 빈 배열로 리턴된다. let obj = { a: '1', b: '2' }; Array.from(Object.keys(..

JavaScript를 위한 자료구조 학부 시절부터 지금까지, 자료구조와 알고리즘은 지루하기만 하고, 하기 싫은 숙제처럼 나를 괴롭혀왔다.. 하지만 현업에 들어오면서 "아 이 내용이 이런 식으로 활용되는구나" 몸소 깨달으면서 코드를 작성하는 일에 조금씩 재미를 느껴온 지 3년 차, 의구심이 들었다. 나는 과연 JavaScript의 기본적인 알고리즘 패턴을 제대로 이해하고 있는가? 실무에서 JavaScript를 다루면서 기본은 충실하게 이해하고 있는지 궁금해졌다. 그렇게 시작한 알고리즘 테스트 방법은 바로 "프로그래머스의 코딩 테스트 연습 문제" Level 순서대로 풀어보기! 기본적인 것도 익숙지 않은 문제 형태로 만나게 되면 머릿속이 백지처럼 바뀌는 마법...(그리고 몰려오는 현자 타임..) 따라서 이 글에서는 최근 알고리즘 공부를 하면서 ..

이전 1 2 3 4 5 6 다음

티스토리툴바

티스토리툴바