隣のプログラマー君

대망의 ProtoType이다. 대부분 학원 출신 개발자들은 Java를 통해 개발에 입문을 하는 케이스가 많다보니, 아무래도 Class 기반의 객체를 익숙하게 여길텐데, 놀랍게도 이 방식대로 자바스크립트에 접근했다가는 머리통이 아픈 순간이 찾아온다. '아니 뭔소리냐? 자바스크립트도 class라는 문법이 있는데, class기반이 아니라니?' 라고 할 수도 있는데, 그건 ES6 시점에서 문법이 추가된거고, 또한 저 class역시 자바에서 말하는 class와는 다르다. 자 그럼 이 prototype이라는게 뭔지 한번 시작해보도록 하자. 1. ProtoType? 자바스크립트의 요소들은 대부분 객체다. Object 뿐만 아니라 String, Array, Number.. 등등 모두 객체인데, 기존의 자바에서 알고 있..

난 당근마켓을 상당히 애용하는 편인데, 중고 물품에 대한 거리낌도 딱히 없는 편이고, 내가 정가주고 새걸 사면 당연히 기분은 좋겠지만 그 정가가 부담스러운 경우가 꽤 있는데다 꼭 새거가 아니어도 되는 물건은 중고여도 되지 않나? 라는 주의기 때문이다. 이런 내가 가끔 당근마켓을 룰루랄라 보다보면 꼭 중고컴퓨터 판다는 게시물들이 하나 둘은 보이는데 이거 진짜 까딱하면 컴알못이 바가지 씨게 뒤집어 쓸지도 모르겠단 생각이 들어서 한번 써본다. (사무용으로 컴퓨터 사는 사람들은 진짜 그냥 아무거나 사도 문제 없긴하다. windows10이상으로만 깔려있으면 걱정할게 없음. 오늘 얘기하는 대상은 적어도 게임 정도 할 생각인 사람들한테 얘기하는 거다.) 1. 중고 컴퓨터 구매시 행동강령 대부분 중고나라, 번개장터, ..

나를 아는 사람들은 내가 상당한 앱등이임을 알고 있다. 뭐 지난 과거의 역사나 걸어온 발걸음 이런 모든걸 알진 못하겠지만, 단 하나 내가 진짜 마음에 들어하는건 진짜 하나에 제대로 미쳐서 그 하나를 위해 주변 모든걸 직접 만들어내는 창조적인 마인드가 날 그냥 사로잡아버린다. 앞선 얘기와 마찬가지로 애플이 대단한 이유는 사람들에게 감성으로 인기가 엄청나다거나 전세계 휴대폰 시장의 점유율을 엄청나게 먹고 있다거나 이런게 아니라 "기가 막힌 소프트웨어" 이거 하나를 위해서 온갖 하드웨어까지 혁신을 이뤄내고 있다는건데, 저 광적인 집착이 난 참 멋지다고 생각했다. 왜 뜬금없이 애플 얘기를 주절주절 늘어놓고 있냐고 묻는다면 내 새로운 도전이 애플이랑 관련이 있기 때문이다. 오랜 시간 애플을 좋아해오며 지금 현재는..

이어서 바로 this 얘기를 할건데 왜 이렇게 급하게 쓰냐면 앞에 글에서는 객체지향 어쩌고 얘길 했지만, 그 객체지향 프로그래밍할 때의 this랑 이 자바스크립트에서 얘기하는 this랑 진짜 지랄맞게 다르다. 자바같은 언어에서 this를 사용하는걸 보면 진짜 명확하게 언제나 객체 자기 자신을 지칭하는 의미로만 사용하고 있는데 자바스크립트는 얘가 어떤 함수 내에 들어있다가 호출 되는지 그 방법에 따라 다르다.. 어이가 없다.. 그래서 이제 나 같은 애들이 this 좀 쓸 줄 안다고 깔짝 대다가 삽질 엄청나게 하는걸 볼 수 있는데, 이거 제대로 생각하면서 쓰면 괜찮으니까 일단 한번 알아보자. 자바스크립트 함수를 호출하는 방법에 따라 달라지는 this 자바스크립트 함수는 호출하는 방법이 네가지가 있다. 1. ..

요 근래 자바스크립트 함수에 대해서 상당히 아주 많은 신경을 쓰고 있는데, 왜냐면 이 놈의 자바스크립트 함수라는게 다른 언어의 함수들과 비교하면 상당히 독특하다보니 별 희한한 케이스가 많다. 그래서 오늘은 생성자 함수 얘기를 한번 꺼내볼까 하는데, 한번 시작해보자. 이 얘기를 하기 전에 this 에 대한 이야기도 필요할듯하니 그것도 설명하겠다. 1. this 원래 뇌구조 상 프로그래밍이란걸 할 수 없는 대부분의 사람들이 프로그래밍을 할 수 있게 만들어준 개념이 객체지향 프로그래밍이라고 생각하는데, 일단 오늘 이 객체지향 얘기하면 개판나니까 나중에 얘기하고 객체지향 프로그래밍을 배우면 아주 자연스럽게 this라는 개념을 학습한다. this는 본래 object(객체) 내부에서 객체 본인을 지칭하는 자기 참조..

오랜만에 React 게시물을 가져왔다. 요 근래 이직 준비랍시고 JS 자체에만 너무 많은 관심을 가졌는데, 그래도 React 하면서 알게 된 것들도 정리를 게을리 하면 안되기 때문에 가져왔음.. 오늘 해볼 얘기는 Custom Hook에 대한 이야기인데 이 Hook 에 대한 개념자체가 조금 까다롭다보니, 한번 복습 때리고 커스텀 훅으로 넘어가볼 거다. 1) Hook 난 Hook이라고 하면 "히히 못가" 가 제일 먼저 떠오르는데 그 이유가 뭐냐하면 리액트 컴포넌트를 마운트 시킨다고하면 Hook 이 딸려오는거라고 이미징 했기 때문이다. 당연히 스코프 같은 개념들이 적용되서 만들어지는 효과지만, 컴포넌트 하나를 그리려고 하면 리액트 컴포넌트 내에서 사용한 Hook이 덤으로 딸려오기 때문에 이렇게 이미징을 했다...

학원에서 가르치는 내용 중에 정규표현식이라는게 있다. 특정 타입의 데이터가 들어갈 수 있음을 의미하는 식을 통해서 해당하는 값을 찾는다던가, 제한하거나 이런 행위를 하기 위해 주로 사용하는데 아무래도 생겨먹은게 귀찮게 생겼다보니 이걸 통해 해결하기보단 다른 방법을 자꾸 모색하게 된다. 근데 요즘 Vanilla JS 개발 연습하면서 도저히 안쓰고는 못배기겠다 싶은 순간이 찾아와 정리할 때가 온 것 같아 일단 정리한번 해두고 넘어가려고 한다. 1. 정규표현식이란? 프로그래밍에서 문자열을 다룰 때, 문자열의 일정한 패턴을 표현하는 일종의 형식 언어를 말한다. 정규식이라고도 부르며, 보통 RegEx 혹은 RegExp라 많이 쓴다. - 출처 : 나무위키 - 일단 모든 언어들이 정규표현식을 사용할 수 있도록 환경이..

오늘은 자바스크립트 런타임에 대한 이야기다. 원래 생각도 안하고 있었는데, 런타임에 이런이런 에러가 생길 수도 있다. 같은 얘기는 많이 했지만 그래서 런타임이 뭔지는 얘기를 안했어서 한번 이야기 해볼까 한다. 조금 어렵게 들릴 수도 있지만 일단 한번 시작해보자. 1. 스레드 (Thread) 오늘 얘기할 JavaScript의 런타임을 얘기하려고 하면, 이 스레드라는 개념에 대해서 확실히 정리가 되어있어야한다. 그리고 이걸 이해하기 위해선 큐, 스택, 힙이 뭔지에 대해서도 알고 있어야하는데 일단 큐, 스택은 설명을 해둔게 있으니 그걸 보면 될 것 같고, heap은 조만간 정리해서 올려두도록 하겠다. 2023.04.17 - [Dev/Algorithm] - [Algorithm] 큐와 스택(Queue, Stack..

오늘은 코테 풀다가 생각나서 쓴다. ASCII 코드 쓰면 상당히 단순하게 풀릴 수 있는 문제들이 있는데, 일단 적어도 내주변에선 잘 떠올리지 않는 케이스가 많다보니 한번 남겨두면 도움이 되지 않을까 함. 일단 ASCII 코드가 뭔지부터 한 번 알아보자. 1. ASCII Code 일단 백날 설명하는거보다 한번 보는게 낫다고 생각해서 띄워봤는데, 이게 아스키코드표다. 저 10진수, 16진수, 문자들이 컴퓨터에게는 동일한거로 받아들여지는건데, 자세히 설명하면 8비트의 공간 안에서 많이 사용하게 되는 내용들을 미리 할당해놓은 거라고 생각하면 되겠다. (엄밀히 따지면 7비트긴함.) 물론 JavaScript에서만 쓰는거도 아니고 그냥 컴퓨터와 인간의 소통을 위한거라 어떤 언어든 동일한게 있다. 다 외워서 사용할 필..

요즘 나는 내가 공부한게 명확히 잘 되어있는지 확인하기 위해 다른 누군가에게 코딩을 가르쳐주러 다니고 있다. 물론 당연히 나도 공부를 하기 위한 목적이기 때문에, 보수는 받지 않는다. 근데 오늘 수업 중에 우리가 흔히 처음에 개발을 할 때 배우는 함수와 일반적으로 ES6문법을 사용하는 많은 개발자들이 사용하는 Arrow Function이 뭐가 다른거냐는 질문을 받았다. 함수 문법을 간결하게 축약할 수 있다. 괄호나 중괄호를 사용하지 않아도 함수의 역할을 할 수 있다. 함수라는것을 직관적으로 느끼게 할 수 있다. 이런 장점 정도는 생각했는데 특별히 다른게 없는데 왜 Arrow Function을 많이 사용하는지 설명할 수가 없어서, 상당히 난감했었다. 그래서 집에 오자마자 급하게 모던 자바스크립트 열고 Ar..