javascript

# 클로저란?원본 "A closure is the combination of a function and the lexical environment within which that function was declared" 번역 "클로저는 어떤 함수와 해당 함수가 선언된 렉시컬 환경의 조합이다" 쉽게 해석 "상위 함수보다 하위 함수가 더 오래 살아있는 경우를 closure라고 한다." # 예시해당 함수를 예로 들어보면function getNumber() { var number = 5; function innerGetNumber() { return number; } return innerGetNumber(); } console.log(getNumber()); 출력 결과5 이 상황은 innerGetNumber ..

위와 같은 오류가 발생해서 뭔지 찾아봤다. 경로에 문제가 생겼다는 에러였다. index.js 에서 App.js를 불러오는데 생긴 에러였는데import App from './App'; const app = new App(); app.play();이렇게 봐서는 모르겠어서 계속 구글링해보았다. 근데 App 을 자동임포트 해주는 기능에서 App에 .js가 빠져서 생긴 에러였다.. import App from './App.js'; const app = new App(); app.play();js 를 붙여서 다시 실행해보니 에러는 사라졌다.

# 쓰로틀링이벤트호출에 강제로 인터벌을 발생시켜서 핸들러함수의 물리적인 호출 횟수 줄임  js 예시 적용전window.addEventListener('scroll', function (e) { console.log('스크롤 이벤트 발생!'); })적용 후settimeout 끝날 때 변수를 null으로 바꿔서 0.2초마다 함수가 실행되게 하는 로직이다.let throttler; window.addEventListener('scroll', function (e) { if (throttler) { return } throttler = setTimeout(function() { console.log('스크롤 이벤트 발생!'); throttler = null; }, 200); })..

자바스크립트 class에 대해 알게되었다. class 끼리 extends 키워드로 상속이라는게 가능하다. class Pet { constructor(name, age){ this.name = name; this.age = age; } eat(){ const {name} = this; return console.log(`${name}(이)가 밥을 먹었다.`); } } class Cat{ constructor(name, age){ this.name = name; this.age = age; } eat(){ const {name} = this; return console.log(`${name}(이)가 밥을 먹었다.`); } meow(){ const {name} = this; return console.log(..

자바스크립트는 멀티-패러다임 언어로 명령형(imperative), 함수형(functional), 프로토타입 기반(prototype-based) 객체지향 언어다 자바스크립트는 이미 생성된 인스턴스의 자료구조와 기능을 동적으로 변경할 수 있다는 특징이 있다. 객체 지향의 상속, 캡슐화(정보 은닉) 등의 개념은 프로토타입 체인과 클로저 등으로 구현할 수 있다. 자바스크립트 객체지향 방법중 팩토리, 생성자, 클래스에 대해 알아보려고 한다. # 팩토리 함수 function makeColor(r, g, b){ const color = {} color.r = r; color.g = g; color.b = b; color.rgb = function(){ const {r,g,b} = this; // 구조 분해 retur..

fetch 함수에 이어서 자바스크립트 내장 함수가 아닌 axios에 대해 알아보려고 한다. 우선 fetch는 구문 분석이 필요하다는 단점이 있었다. axios는 구문 분석을 따로 하지 않아도 된다는 장점이 있다. 내장함수가 아니기 때문에 외부에서 추가 빌드가 필요하다. https://github.com/axios/axios GitHub - axios/axios: Promise based HTTP client for the browser and node.js Promise based HTTP client for the browser and node.js - GitHub - axios/axios: Promise based HTTP client for the browser and node.js github.c..