JavsScript

자바스크립트에서 함수 또는 class에 new 키워드를 통해 호출하면 생성자로 사용할 수 있다.function 생성자로 객체 인스턴스를 사용하려면 이런 식으로 코드를 작성하면 된다.보통 함수 생성자 함수의 변수명은 PascalCase로 작성한다.이렇게 실행을 하게 되면

js의 Array.prototype.reduce 라는 메소드가 있다. 그 함수를 혼자 함수로 구현해보기로 하였다.array의 메소드가 아닌 reduce라는 함수로 만들어서 결과를 return 해주도록 하였다.파라미터는 arr, 실행할 함수, 초기값 순서대로 하였다.초기

map은 Array.prototype에 있는 메소드로써, 콜백함수를 받아서 각 원소마다 배열의 원소마다 콜백함수를 실행한 새로운 배열을 반환한다.filter 또한 Array.prototype에 있는 메소드로써, arr에서 특정 조건의 원소들을 제거하는데에 유용하다. 말

Queue는 기본적인 자료구조이다. first-in first-out으로 먼저 들어온 노드가 먼저 나간다.이러한 Queue는 javascript에서 array.prototype.push 와 array.prototype.shift()로 간단하게 구현할 수 있다. 하지만,

Array.prototype.some, Array.prototype.every라는 메소드가 있다. Array.prototype.some은 콜백함수를 받아 배열의 원소 중에 하나라도 해당 함수를 만족한다면 true를 반환해주는 함수이다. 아니라면 false를 반환한다.A

Debounce는 연속적으로 호출되는 함수들 중 마지막 함수(또는 제일 처음)만 호출하도록 하는 것입니다. 왜 이렇게 하는 것일까요? 우리는 사용자의 마지막 행동에만 관심이 있기 때문입니다. 검색을 하는 방법에도 여러가지가 있을 것입니다. 예를 들어 검색어를 입력하고

Object 생성자는 유독 다른 생성자 보다 메소드가 많은 것 같다. 착각일까? 한번 알아보자콘솔창에 Array. 해서 메소드들을 보면 몇 개 없다. 대부분 Array.prototype에 메소드들이 있는 것을 볼 수 있다. String이나 Number 등도 마찬가지로

javascript는 prototype 기반 언어이다. 그래서 상속을 구현하기 위해 사람들이 여러 방법을 고안 했다. 그 중에 하나가 Bridge라는 다리 역할을 해주는 생성자들 만들어서 하는 방법이다. Bridge 생성자를 만들어 상속하는 방법은 더글라스 크락포드가

Promise.all 과 Promise.allSettled의 차이를 알아보려고 한다. 두 메소드다 여러 개의 Promise들을 병렬적으로 실행시키기 위한 메소드이다. Promise를 3개 만들었다. 그리고 all Method를 통해 실행 시켰다. 그러면 promise1

js에서 일정 길이의 배열을 만드는 방법에는 여러 가지가 있다. 진짜 아무것도 모른다면 다음과 같이 할 수 있을 것이다.이렇게 하면 undefined 10개로 찬 array가 만들어질 것이다. 하지만 이 코드는 반복문을 쓰면서 push를 하나씩 하기 때문에 보기에 좋지

자바스크립트는 저수준 언어와는 다르게 객체가 생성되었을 때 자동으로 메모리를 할당하고 쓸모 없어졌을 때 자동으로 해제한다(가비지 컬렉션).메모리의 생명 주기는 프로그래밍 언어와 상관없이 비슷하다.필요할때 할당한다.사용한다. (읽기, 쓰기)필요없어지면 해제한다. 3번의

이벤트 핸들러가 많은 연산(예 : 무거운 계산 및 기타 DOM 조작)을 수행(이벤트 핸들러의 과도한 횟수가 발생하는 것)하는 경우 에 대해 제약을 걸어 제어할 수 있는 수준으로 이벤트를 발생(그 핸들러를 더 적게 실행하면 빠져 나갈 수 있음)시키는 것을 목표로 하는 기

ES6에 추가 된 화살표 함수(arrow function)은 일반 함수와는 다르게 여러가지가 없다. this가 상위 스코프를 가지며, prototype이 없고, arguments라는 유사배열을 가지지 않으며, 생성자로도 사용할 수 없다. 그리고 익명함수이다. 그렇다면

객체의 확장을 막는 방법으로 가장 유명한 Object.freeze 가 있다. 하지만 Object.freeze도 깊은 freeze는 하지 못한다. 그리고 찾아보니 freeze 말고 다른 메소드로도 객체의 확장을 막는 방법들이 있었다.이를 이해하기 위해서는 먼저 객체의 프

NaN은 Not A Number(숫자가 아님)를 나타낸다.NaN을 반환하는 연산에는 5가지 종류가 있다.숫자로써 읽을 수 없음.(parseInt('문자열'), Number(undefined)결과가 허수인 계산식 (Math.sqrt(-1))피연산자가 NaN (7 \*\*

예전엔 속성명에 \_를 프리픽스 해서 사용했다고 한다. 하지만 private 하게 쓰자라는 컨벤션이지 private하지 않다. 그래서 이제 \_는 거의 사용하지 않는다.근본적으로 접근이 불가능한 private 속성을 만드는 방법으로는 클로저를 이용하는 방법이 있다.비슷

자바스크립트에서 객체를 만들기 위한 템플릿으로 생성자 함수와 class를 사용한다. class는 생성자 함수에서 사용하기만 편하게 한 편의적 문법(syntactic sugar)라고 하는 사람들이 많다. 하지만 동일한 역할을 하는 것 외에도 추가적인 기능들이 있다.cla

자바스크립트는 객체 프로퍼티 키로 문자형과 심볼형만을 허용한다. 숫자형, 불린형 모두 불가능하다.Symbol은 ES6에 새로 추가된 원시 타입이다. 심볼은 유일한 식별자를 만들고 싶을 때 사용한다.심볼은 unique 하기 때문에, description이 같아도 충돌하지

호이스팅은 보통 변수를 위로 끌어올리는 것이라는 표현을 많이한다. 그렇다면 개발자들을 헷갈리게 하는 호이스팅을 왜 만들었을까?? 이를 알기 위해서는 JS엔진이 JS를 어떻게 해석하고, 어떻게 Excution Context를 만들고 어떤 작업을 하는지를 알아야한다.JS엔

bind는 함수 실행시 this 값을 특정한 값으로 고정시킬 수 있는 메소드이다.bind는 ES5에 추가되었기 때문에 ES5 이전에는 call, apply를 통해서만 this를 변경할 수 있었다. bind처럼 this를 변경 한 함수로 만들기 위해서는 직접 구현을 했어

javascript는 prototype을 쓰는 언어이다. prototype을 통해서 다른 class언어의 상속을 구현할 수 있다. 그렇다면 그냥 class 언어와 prototype 언어의 차이가 무엇일까? prototype 언어의 장단점은 무엇인가...내가 생각하고 공

tagged template literal을 활용해서 함수를 만들 수 있다.보통 React를 사용하는 개발자들이면 styled-components, emotion 등을 사용하며 볼 수 있을 것이다.정말 간단한 예제를 한번 살펴보자.그러면 위와 같이 결과가 나올 것이다.