공대키메라

https://developer.mozilla.org/ko/docs/Web/API/Document_Object_Model/Introduction DOM 소개 - Web API | MDN 이 문서는 DOM에 대한 개념을 간략하게 소개하는 문서이다: DOM 이 무엇이며, 그것이 어떻게 HTML, XML (en-US) 문서들을 위한 구조를 제공하는지, 어떻게 DOM 에 접근하는지, API 가 어떻게 사용되는지에 developer.mozilla.org MDN사이트는 사기다 모든 정보가 다있다 ! ㅠㅠ 외쳐 MDN 만세! 하여간... REACT를 공부하는 와중에 DOM이 나왔는데 DOM을 많이 접하지만 정확히 설명하라고 하면 못할거 같아서 이렇게 공부를 한다. DOM이란 그래서 뭐냐? 문서 객체 모델(The Do..

거룩한 일요일 필자는 Callback과 Promise에 대해 공부를 했다. https://tech-monster.tistory.com/43 Callback Fucntion 이란? 의미를 파악해 보자. ???? call me back~ 뭔가 전화를 다시 걸라는 건가...? (내 번호 안알랴줌) 그 느낌 그대로 callback을 다시 본다면 단어 뜻 자체가 회신하다/답신하다 라는 뜻을 지닌다. 그러면 callba tech-monster.tistory.com 간단하게 callback에 대해서 알고싶으면 callback Function이란? 이라는 블로그를 참고해주세요 나는 우선 강의를 듣고 그다음에 docs 를 찾아보려고 하는데 좋은 내용을 단시간에 함축해서 전달해 주면 시간 효율이 배가 되기 때문이다 물론 ..

여러분~ let 대신에 Var를 써야고 한답니다. 사실 이번에 회사에 입사하면서 프론트에서 jQuery를 이용할 일이 많아졌다. 문제는 아직도 회사에서 Var를 이용해서 변수를 선언하는 것이다. Let은 ECMAScript 6에서 새로 도입된 것으로 var와 같이 변수를 선언할 수 있다. 그러면 둘의 차이는 뭘까?? 우선 내가 참고해서 공부한 영상 링크를 달아놓겠다. https://www.youtube.com/watch?v=OCCpGh4ujb8&ab_channel=%EB%93%9C%EB%A6%BC%EC%BD%94%EB%94%A9by%EC%97%98%EB%A6%AC 그렇다 나는 그녀의 노예다... 여기 나오는 내용으로 코드를 정리해서 보여주겠다. console.log(age); age = 4; consol..

모든 내용은 Youtube의 ellie teacher가 한 것을 기반으로 한다. https://www.youtube.com/watch?v=tJieVCgGzhs&list=PLv2d7VI9OotTVOL4QmPfvJWPJvkmv6h-2&index=2&ab_channel=%EB%93%9C%EB%A6%BC%EC%BD%94%EB%94%A9by%EC%97%98%EB%A6%AC 영상을 보길 원하면 위에 들어가면 된다. 그렇다... 나는 그녀의 충실한 노예다... 하여간 여기서 script를 불러오는 방식에서 Async와 Defer가 있다. 우선 가장 기본적으로 사용하는 html 형식을 보자 . 브라우저에서 위에서 부터 천천히 html을 읽어들이기 시작한다. 순차적으로 쭉 내려오다가 script를 만난다. 어! test..

Prototype 이란 뭘까? 우선 영어 사전을 검색해 보자 . 검색해 본 결과 원형이라는 말이다. 어떤 원형인지 그것을 이제부터 같이 알아갈 것이다. 생성자 함수가 있을 때 new 연산자로 인스턴스를 만들게 되면 그 인스턴스에는 constructor의 prototype이라고 하는 프로퍼티의 내용이 Prototype이라고 하는 프로퍼티로 참조를 전달하게 된다. 이게 무슨말이냐면 Constructor.prototype이랑 instance[[Prototype]]가 곧 같은 객체를 바라본다는 말이다. 그런데... [[Prototype]]는 접근가능한 것이 아니라 정보를 보여주기만 할 뿐으로, 실제 동작상으로는 instance와 동일시가 된다. 그래서 밑의 그림처럼 삼각형이 된다. 그래서 이게 어쨋다는 건지는 ..

close ? closure? closure를 검색하면 "폐쇄"라는 뜻이 나온다. 뭐를 폐쇄하는지? Closure를 더 검색해보자. MDN 사이트를 확인하자 눈여겨 봐야 할 부분이 "함수와 함수가 선언된 어휘적 환경의 조합이다" 라는 부분이다 다시 정리하면 "에워싸여져 함께 묶여진 함수"라고 할 수 있다. => 둘러쌓인 LexicalEnvironment의 참조 라고 볼 수 있다. 다시 다른말로 보자면 위 그림들을 보자면 뭐... 글 그대로 읽고 그림을 본다면 이해가 갈 것이다. 그러면 특별한 현상이 뭔지 이제 알아가보자. 우선 전에 해봣던 것을 복습해보자. var outer = function(){ var a = 1; var inner = function(){ console.log(++a); }; inn..

의미를 파악해 보자. ???? call me back~ 뭔가 전화를 다시 걸라는 건가...? (내 번호 안알랴줌) 그 느낌 그대로 callback을 다시 본다면 단어 뜻 자체가 회신하다/답신하다 라는 뜻을 지닌다. 그러면 callback function 은 회신하는 함수가 된다. 함수를 하나 처리하고 나서 회신을 준다는 것이다! 이말은 즉 콜백함수에 대한 제어권을 내가 넘기고자 하는 대상한테 위임하는 것이다. 이 콜백을 어떻게 처리할지는 제어권을 넘겨받은 대상이 전적으로 관여를 한다. 넘겨줄 제어권에는 다음과 같은 항목이 있다. 실행 시점 매개 변수 this 1. 실행 시점 setInterval(function(){ console.log('1초마다 실행될 겁니다.'); }, 1000); setTimeou..

전에 Context에 대해 공부해보았다. 다시 보고 싶다면 링크를 달아두겟다옹 히힛 https://tech-monster.tistory.com/41 Context 란? 내가 공부하고자 하는 전반적인 내용이 아래 블로그에 담겨있다. https://poiemaweb.com/js-execution-context Execution Context | PoiemaWeb Execution Context(실행 컨텍스트)는 scope, hoisting, this, functi.. tech-monster.tistory.com 여기 inner안에 보면 ThisBinding이라는 아이가 있다. 이건 뭥미? 우선 제대로 알기 전에 이 문장을 기억하란다 thisBinding은 실행 컨텐스트가 활성화될 때 한다! 실행 컨텍스트가 ..

내가 공부하고자 하는 전반적인 내용이 아래 블로그에 담겨있다. https://poiemaweb.com/js-execution-context Execution Context | PoiemaWeb Execution Context(실행 컨텍스트)는 scope, hoisting, this, function, closure 등의 동작원리를 담고 있는 자바스크립트의 핵심원리이다. 실행 컨텍스트를 바로 이해하지 못하면 코드 독해가 어려워지며 디버 poiemaweb.com 솔직히 나는 글을 정리하는게 너무 귀찮아서 남이 잘 적은 글을 보는 편이다 ㅋㅋ Context란 뭘까? 사실 javascript공부하면서 context라는 단어를 필자는 처음 듣는다 ㅋㅋ(부끄...) context하면 맥락이라는 뜻이다. 사전을 보면..

사실 자바스크립트는 생각도 안하고 있다가 최근 Spring Data Jpa 관련 강의를 전부 공부해서 미니 프로젝트를 만들려고 보니 React + Spring boot 연동을 할 수가 있다고 한다! 그래서 이 기회에 javascript에 대해 다시 공부하고 React도 공부하고 Spring Boot를 Spring Data Jpa를 적용해서 미니 프로젝트를 만들 예정이다. 후... 벌써부터 숨가쁘네... 할게 왜이렇게 많은거야ㅠ 히ㅣㅎㅅ https://velog.io/@yunsungyang-omc/%EC%9E%90%EB%B0%94%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8-%EA%B8%B0%EB%B3%B8%ED%98%95%EA%B3%BC-%EC%B0%B8%EC%A1%B0%ED%98%9..