전체 글99 [모던 자바스크립트 Deep Dive] - 26~27장 디이이입 다이브 [모던 자바스크립트 Deep Dive] - 26~27장 디이이입 다이브React에서 배열을 직접 바꾸면 왜 찝찝할까? 저번 정리에서 함수와 배열은 맨날 쓰고..나머지 메서드들 map, filter, push, slice 정도는 너무 익숙한 친구들 아닌가요? 싶었는데근데 막상 다시 보니 생각보다 만만한 친구가 아니었다.🙄... 배열 = 객체이지 않나... 어떤 메서드는 원본을 바꾸고, 어떤 메서드는 새 배열을 만들고,React에서는 배열 상태를 직접 바꾸지 말라고 한다.아니 배열에 값 하나 넣었을 뿐인데.. 왜 이렇게 말이 많아지는 건지🤷🏻♂️그래서 이번에는 저번시간에 이어서 배열을 조금 더 깊게 보려고 한다. 다만 너무 심연까지 들어가면 돌아오지 못할 수 있으니,이번 글에서는 딱 이 정도만 보려.. 2026. 6. 12. [모던 자바스크립트 Deep Dive] - 26~27장 정리 [모던 자바스크립트 Deep Dive] - 26~27장 정리아는 놈이 무섭다. 앞장 클래스 칭긔를 보면서 미뤄뒀던 개념들이 조금씩 맞춰지는 느낌을 받았다면...(좀 많았죠... 객체, prototype, this, private..등등...)이제는 26장부터는 진짜 실무 코드에서 매일 보는 친구들이 등장하게 되는데요?바로 함수와 배열. 솔직히 처음엔 조금 방심을 했었습니다요.(함수? 맨날 쓰는거 아님? 배열? map/filter 맨날 돌리는데요? ㅋㅋ) 막상 다시 보니까 얘네도 그냥 “자주 쓰는 문법” 정도로만 볼 애들이 아니긴 했었습니다요. 함수는 어떻게 정의하느냐에 따라 같은 동작이 달라지고,배열은 그냥 값을 줄 세워둔 자료구조처럼 보이지만 JS에서는 사실 객체처럼 동작한...다고 하네요?(역시 .. 2026. 6. 5. [모던 자바스크립트 Deep Dive] - 25장 정리 [모던 자바스크립트 Deep Dive] - 25장 정리이젠 진짜 실전이야. 지난 이야기...클로저를 보며 함수가 자신이 정의된 렉시컬 환경을 기억하는 구조와 더불어 이를 활용해 외부에 직접 공개하고 싶지 않은 값을 private처럼 감출 수 있다는 이야기를 했었는데요..마참내! 드디어 대망의 class가 등장하게 됩니둥.음... 냄새가...난다 Java 스러움이... 음... (아무래도 객체지향 언어라서 그런거겠쥬?)class Person { constructor(name) { this.name = name; } sayHi() { console.log(`안냐심까, ${this.name}입니다.`); }} 벗-뜨 Java를 배워본 적도 없고,실무에서 소올직히 class보다 function.. 2026. 5. 26. [모던 자바스크립트 Deep Dive] - 24장 디이입 다이브 [모던 자바스크립트 Deep Dive] - 24장 디이입 다이브클로저는 실제로 무엇을 기억하는가 — 미룬이의 그뇨속 딥다이브 지난 노트에서 클로저가 왜 “그뇨속” 소리를 듣는지(?)를 붙잡고 한참 씨름했다.책과 MDN의 정의부터 시작해서,클로저는 함수와 그 함수가 선언된 렉시컬 환경과의 조합이다. 라는 문장을 붙들고외부 함수의 실행이 끝난 뒤에도 내부 함수가 바깥 식별자에 접근할 수 있는 이유를 차근차근 따라가 봤다. 그런데 글을 다 정리하고 나니, 한 문장이 계속 눈에 밟혔달까...함수는 자신이 정의된 렉시컬 환경을 기억한다. 기억한다니 무엇을, 어떻게 기억한다는 거죠? 함수 실행도 끝났고, 콜 스택에서도 빠졌다는디 그 안에 있던 변수는 왜 아직 읽히는 건데 ㅇㅅㅇ? 이번 글에서는 지난 노트에 사.. 2026. 5. 19. [모던 자바스크립트 Deep Dive] - 24장 정리 JavaScript Deep Dive 스터디 노트 (24장)드디어 등장한 그뇨속 hoxy...지난 노트 앗차차리스트에 적어뒀던부분... 기억하실까요... 예. 발표입니다. 마참내 깨질 차례가 왔습니다. (끼이야아아아아악!!)사실 클로저는 "자바스크립트의 어려운 개념" 하면 반드시 나오는 단골손님이라...꼭 알아야하지만.. 외면하고싶은.. ㄱ...그뇨속... (쟤만 보면 속이 안좋아요)맨날 보는 아이지만... 프론트를 배우던 시절엔 늘 아래 사진처럼 이렇게 봤었거든요... ㅔ...일단 책에선 클로저를 이렇게 정의하고, MDN도 같은 취지로 설명합니둥. "A closure is the combination of a function and the lexical environment within which.. 2026. 5. 19. [모던 자바스크립트 Deep Dive] - 22~23장 정리 JavaScript Deep Dive 스터디 노트 (22~23장)내다버린 2주. 안냐심까 저번주엔.. 어른이?날 이슈로 좀 쉬었더니...이번주 숙제를 하려니 귀찮아져서 급하게 우다다다닥 인사올림돠...이번 주제는 어떻게 보면 중요하다고 볼 수 있는 this...랑 실행 컨텍스트인데과거 딥다이브 파면서 메서드 안에서 this도 봤고, 따로 면접 준비하면서 정리했던 노트도 있긴 하지만근데 그게 전부였슴다. 쓸 줄만 알고 왜 그렇게 동작하는지는 모른다는거죠.(쓸 줄 아는거? this는 함수를 호출한 객체를 말한다...라는거?)화살표 함수 관련 this 설명도 마찬가지로 면접용으로 달달 외웠으니"왜?"라는 내용과 연결은 안되어있...고요 하하;심지어 실행 컨텍스트는 이름만 들어본거 같은데.. 큰났네요이거 th.. 2026. 5. 12. [모던 자바스크립트 Deep Dive] - 19~21장 정리 [모던 자바스크립트 Deep Dive] - 19~21장 정리마참내! 드디어 본론이다. 앞서 적어놓은 19장 맛뵈기가 무려 딥다이브 한페이지라는거 ^-^;;;;좀 현타가 오지만? 그래도 정리는 해야겠지 않겠습니까요....빠르게 가...가볼께욧... 19장 - 프로토타입상속 — "왜 필요한지"부터상속이 왜 필요한지 코드로 보면 바로 납득이 된다.// 상속 없이 — getArea가 인스턴스마다 따로 만들어짐function Circle(radius) { this.radius = radius; this.getArea = function() { return Math.PI * this.radius ** 2; };}const c1 = new Circle(1);const c2 = new Circle(2);c.. 2026. 4. 29. [모던 자바스크립트 Deep Dive] - 19장 맛뵈기? JavaScript Deep Dive 스터디 노트 (19장 맛뵈기?)범위가 너무 많아요;;;;; 솔직히 19장 범위가 너무 많아가지고... 읽으면서 넘기기엔 찜찜한 게 너무 많았다.왜냐? 진짜 모르는 내용이 거의 절반이라... (삽질의 미X 연속;;;)그러고 힘을 다 써버렸더니 20장이랑 21장은... 거의 내다버린 수준이 되어버렸다고;(그랬더니 소올직히 제출을 늦게해버렸다.. 내가 늦다니...털썩...)추가로 저번 스터디때 받은 피드백을 기반으로(?)이번엔 그냥 한놈만 팬다 느낌으로 딥다이브를 해보고자한다.아예 갈거면 제대로 패는 형식.... 아예 기초적인 것부터 쭈우우욱 패버릴 예정-! 그리고 여기서도 기억해야 할 부분은 사양(ECMAScript)과 엔진(V8)을 섞어 쓰지 않아야 하는거..19장.. 2026. 4. 29. [모던 자바스크립트 Deep Dive] - 16~18장 정리 (re) JavaScript Deep Dive 스터디 노트 (16~18장)너무 모르겠어서 다시정리하는 프로풔튀. 솔직히 말하면 책 읽고 "아 그렇구나~" 하고 넘기기엔 찜찜한 게 너무 많았다.(사유 : 내가 내 발표때 제대로 못말할거 같아서)"왜 이렇게 동작하는 거야?"가 계속 걸려서, ECMAScript 사양이 어떻게 명세하는지,V8이 그걸 실제로 어떻게 구현하는지까지 다시 re-mind를 가져보고자 한다. 여기서 중요하게 가져가야하는건.. 사양과 엔진(V8)를 두 가지를 섞어 쓰지 않는 것이다.[[DefineOwnProperty]], [[Call]], [[Construct]], SetIntegrityLevel 같은 것은 사양의 개념이고,HiddenClass, DescriptorArray, fast prope.. 2026. 4. 21. 이전 1 2 3 4 ··· 11 다음
