본문 바로가기
  • soldonii's devlog

Javascript 공부/TIL18

200116(목) : Property Descriptor 오늘은 Property Descriptor에 대해서 알아보려고 한다. 이에 대해서 알아보는 이유는 바닐라코딩에서 알고리즘 문제를 풀 때, String.prototype.isAnagram 이런식으로 Native Prototype에 특정 메소드를 추가하는 방식으로 문제를 풀었는데, Native Prototype에 특정 메소드를 임의로 추가할 경우 해당 메소드가 enumerable하게 만드는 것은 bad practice이기 때문에 수정해보라고 하셨기 때문이다. 그래서 내가 구현한 메소드의 enumerable 프로퍼티를 false로 만들면서 공부한 내용을 정리한다. 본 글을 이해하기 위해 알고 있어야 하는 메소드는 Object.getOwnPropertyDescriptor()와 Object.defineProper.. 2020. 1. 16.
200115(수) : import, export 이번 글에서는 import, export에 대해서 정리해보려고 한다. 바닐라코딩에서 과제나 알고리즘 문제를 풀다보면 제발 import, export에 대해서 공부하고 이해한 후에 문제를 풀어달라는 ken님의 간곡한 요청을 종종 볼 수 있다... 내 예상으로는 5주차부터는 react를 배우게 되는데, 우선 React.Component를 불러오는 것부터 시작해서 직접 만든 컴포넌트를 다른 컴포넌트에게 넘겨줄 일이 빈번하게 생기기 때문에 미리 알아두라는 의미가 아닐까 싶다. 물론 리액트 뿐만 아니라 여기저기에서 무수히 쓰이긴 하지만..! 아무튼 mdn 문서를 읽어보니 export 부터 정리하는게 이해하는데 순서가 맞을 것 같다. 1. export export 명령어는 '자바스크립트 모듈에서 함수, 객체, 원시.. 2020. 1. 15.
200114(화) : var, let, const 차이 1. var, let, const의 차이이미 기존에 작성한 글이 있지만, 명확하게 공부하기 위해서 한 번 더 조사한 자료를 토대로 정리한다. var, let, const의 차이를 정확하게 이해하기 위해서는 호이스팅(hoisting), 스코프(scope)에 대해 정확하게 이해하고 있어야 한다. 아래 링크에서 해당 글들에 대한 내용을 확인할 수 있다. 호이스팅(hoisting)을 정리한 글스코프(scope)를 정리한 글 1) Function scope(var) vs. Block Scope(let, const)결론적으로 var은 함수 스코프를 따르고, let과 const는 블록 스코프를 따른다.즉 var로 변수를 선언할 경우, 해당 변수가 선언된 함수가 종료되기 전까지 var로 선언된 변수는 유효하다.따라서 .. 2020. 1. 14.
200110(금) : 프로토타입 오늘은 프로토타입에 대해 정리한다. 1. 프로토타입 # [[Prototype]] 자바스크립트 객체는 [[Prototype]]이라는 내부 프로퍼티를 가지고 있으며, 이 녀석은 다른 객체를 참조하는 단순한 레퍼런스로 사용된다. [[Prototype]] 링크는 현재 객체(obj)에서 찾고자 하는 프로퍼티(a)를 찾지 못할 경우, obj의 프로토타입 링크를 통해 프로토타입 체인을 거슬러 올라가면서 프로퍼티 a를 수색할 수 있도록 한다. 이 연쇄를 따라 올라가면서 프로퍼티 a를 찾고, 최상단에서도 찾지 못할 경우 undefined를 리턴하게 된다. 또한 for ... in 루프로 객체를 순회할 때에도 [[Prototype]] 링크를 통해 객체 연쇄를 전부 찾는다. 모든 자바스크립트 객체는 최상단의 Object.p.. 2020. 1. 10.
200109(목) : 부동소수점, git 경고메세지, 배열 중복 제거 등 1. 0.1 + 0.2 === 0.3가 false인 이유 자바스크립트를 포함한 여러 프로그래밍 언어들에서 동일한 문제가 발생한다. 이는 프로그래밍 언어와는 달리 컴퓨터는 2진법만을 사용하기 때문이다. 자바스크립트에서는 숫자를 다룰 때, '64비트 IEEE 754 배정도(double-precision) 부동소수점 숫자 형식'에 따라서 숫자를 컴퓨터가 이해할 수 있는 2진법으로 변환한 후, 그 결과를 다시 10진법을 바꾸어서 전달한다. 이 때 컴퓨터의 메모리는 무한하지 않은 것에 비해, 부동소수점은 무한한 숫자이기 때문에 컴퓨터는 이를 100% 정확하게 표현할 수가 없다. 따라서 컴퓨터는 무한한 숫자와 가장 가까운 근사치를 대신 돌려주게 된다. 조금 더 살펴보자면.. 10진법은 분모의 소인수가 2 또는 5로.. 2020. 1. 9.
200108(수) : 프로토타입, 객체지향 프로그래밍 오늘 배운 내용은 프토토타입과 객체지향 프로그래밍이다. 본 글에서는 객체, 프로토타입 등에 대해서 공부한 내용을 정리하려 한다. 1. 객체란 무엇인가? 흔히 '자바스크립트에서는 모든 것이 객체다'라는 말을 하는데, 명백하게 사실과 다른 말이다. string, number, boolean, null, undefined와 같은 단순 원시 타입은 객체가 아니다. 다만 함수와 배열의 경우에는 '복합 원시 타입'이라는 객체의 하위 타입의 한 종류이다. # 내장 객체 내장 객체 또한 객체의 하위 타입이다. 이들은 자바스크립트의 타입 중 하나처럼 보이지만 사실은 단지 자바스크립트에 내장된 함수일 뿐이고, 각각 생성자 함수로 사용되어서 주어진 하위 타입의 새로운 객체를 생성하는 역할을 한다. String, Number.. 2020. 1. 9.
200106(월) : 비동기, 고차함수, 일급객체, V8 엔진 등 이번 주는 비동기 프로그래밍에 대해서 집중적으로 배워보는 한 주이다. 그런데 비동기에 대해서 배우고 실습하기 전에 우선적으로 고차함수, 일차함수와 일급 객체 등의 개념을 가르쳐주셨다. 그래서 이것이 비동기 프로그래밍과 어떤 연관이 있는 것인지 이해한 나름대로 정리해보고자 한다. 우선 이 개념들과 비동기의 연관성을 이해하기 위해서는 저 용어들이 무엇을 의미하는지부터 알아야 한다. 1. 일급 객체와 고차 함수 Stack Overflow의 한 글에서 아래와 같이 이야기하고 있다. In short, it means there are no restrictions on the object's use. It's the same as any other object. A first class object is an en.. 2020. 1. 7.
191120(수) : response 순서대로 가져오기 등 1. Response 순서대로 가져오기 바닐라코딩 어드미션 테스트 합격 후 추가과제로 받은 Hacker News API를 이용하여 Hacker News website 카피하기 과제를 며칠 붙잡고 헤맸다. 다른 부분은 큰 문제는 없었는데, 제이쿼리를 이용해 비동기로 데이터를 요청한 후, 요청한 순서대로 데이터를 받아서 DOM에 추가해야 했다. 우선 전체 story의 id가 담긴 정보를 받는 것은 단순한 요청이라 어렵지 않았다. $.get('https://hacker-news.firebaseio.com/v0/topstories.json?print=pretty', (storyArr) => { let top30 = storyArr.slice(0, 30); } 상위 30개 article만 먼저 보여주면 되기 때문.. 2019. 11. 20.
191118(월) : 코딩 인터뷰 완전 분석(1) # Chapter 8. 기술적 문제의 p.96 나중에 면접에서 나의 단점이 무엇인지 물을 때 대답할 수 있는 질문 중 하나이자, 실제로 내가 알고리즘 문제를 풀 때 고쳐야 하는 부분이다. 3. 무식한 방법으로 일단 해보기 예제가 완성됐다면, 무식한 방법(brute force)으로 먼저 시돼보라(문제에 따라 2단계(예제를 직접 그려보기)와 3단계의 순서를 바꿔도 된다.) 이 단계에서 만든 알고리즘이 최적일거라 기대하지도 않고 최적이 아니어도 괜찮다. 어떤 지원자들은 무식한 방법이 너무 명백하고 비효율적이라 언급조차 하지 않으려고 한다. 하지만 여러분이 생각하기에 너무 뻔해 보이더라도 누군가에게는 뻔하지 않을 수도 있다. 면접관은 여러분이 너무 쉬운 문제를 낑낑대고 있다고 생각할 수도 있다. 그렇게 생각하는.. 2019. 11. 18.