코딩하는 둥둥

Bolb (Binary Large Object) 이미지, 사운드, 비디오와 같은 멀티미디어 데이터를 다룰 때 사용한다. 즉, JavaScript 네이티브 형식이 아닌 데이터를 나타낼 수 있다. 데이터의 크기(Byte) 및 MIME 타입을 알아내거나, 데이터를 송수신을 위한 작은 Bolb 객체로 나누는 등의 작업에 주로 사용된다. References. https://heropy.blog/2019/02/28/blob/ https://developer.mozilla.org/en-US/docs/Web/API/Blob

Uncatched TypeError : this.'X' is not a function 함수에서 값을 호출하려고 했지만 값이 실제로는 함수가 아닌 경우 발생하는 error 1. 함수 이름에 오타가 있는 경우 const x = document.getElementByID('foo'); // // TypeError: document.getElementByID is not a function const x = document.getElementById('foo'); 2. 잘못된 객체에서 호출된 함수 특정 메서드의 경우 콜백 함수를 제공해야 하며, 특정 개체에서만 작동한다. 아래 코드에서는 Array.prototype.map()을 사용했으며 해당 함수는 Array 개체에서만 작동하기때문에 TypeE..

[Violation] 'setInterval' handler took 158msChrome 위반은 Chrome 또는 자체 웹 앱의 오류를 나타내지 않고, 앱을 개선하는데 도움이 되는 경고이다.이 경고가 발생할 경우 스크립트 속도를 높일 수 있는 기회가 있다.오래 걸리는 스크립트의 경우 무조건 비동기 메서드(promise 등) 쓰라는 가이드setTimeout과 같은 비동기 함수 내부에서 중단점을 사용해 코드를 디버깅할때도 이러한 종류의 메세지가 표시될 수 있다.이 경우 숫자는 비동기 함수에서 멈추는 시간에 따라 다르다.나의 경우 setInterval 함수를 중단하는 과정에서 발생하는 경고였다.okky에서 본바에 따르면 실 사용시 추천하지 않는다고,,,? DOM 이벤트 사용?References.https:/..

호출 스케줄링 scheduling a call 일정 시간이 지난 이후에 원하는 함수를 실행(호출)할 수 있게 하는것을 말한다. 자바스크립트 명세서에는 해당 내용이 명시되어 있지 않지만, 시중에 나와있는 자바스크립트 호스트 환경 대부분이 이와 유사한 메서드와 내부 스케줄러를 지원한다. setTimeout let timerId = setTimeout(func|code, [delay], [arg1], [arg2], ...) func/code 실행하고자 하는 코드로, 함수 또는 문자열 형태 대개 함수가 들어가며, 하위 호환성을 위해 문자열도 받을수 있지만 추천하지 않는다. delay 실행 전 대기 시간. 단위는 밀리초(millisecond, 1000밀리초 = 1초)이며 기본값은 0이다. arg1, arg2.....

호출 스케줄링 scheduling a call 일정 시간이 지난 이후에 원하는 함수를 실행(호출)할 수 있게 하는것을 말한다. 자바스크립트 명세서에는 해당 내용이 명시되어 있지 않지만, 시중에 나와있는 자바스크립트 호스트 환경 대부분이 이와 유사한 메서드와 내부 스케줄러를 지원한다. setInterval let timerId = setInterval(func|code, [delay], [arg1], [arg2], ...) func/code 실행하고자 하는 코드로, 함수 또는 문자열 형태 대개 함수가 들어가며, 하위 호환성을 위해 문자열도 받을수 있지만 추천하지 않는다. delay 실행 전 대기 시간. 단위는 밀리초(millisecond, 1000밀리초 = 1초)이며 기본값은 0이다. arg1, arg2...

Math.floor 숫자를 항상 가까운 정수로 반올림한다. Math.floor(1.6); // 1 Math.floor(2.2); // 2 References. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/floor https://www.w3schools.com/jsref/jsref_floor.asp

Math.abs 메서드 숫자의 절대값을 반환한다. 따라서 결과값은 항상 양수 아니면 0이다. NaN : 값이 숫자가 아닐 경우 Math.abs(-1) // 1 Math.abs(1) // 1 Math.abs(0) // 0 References. https://www.w3schools.com/jsref/jsref_abs.asp https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/abs

이벤트(Event) 프로그래밍하고 있는 시스템에서 일어나는 사건(action) 혹은 발생(occurrence) 시스템은 이벤트가 발생될 때 몇몇 종류의 신호를 생산/발생 시키고, 이벤트가 발생되었을 때 사건이 자동적으로 취해질수 있는 메커니즘(코드의 실행)을 제공한다. 이벤트는 브라우저 내에서 발생하며 다양한 이벤트 타입이 있다. (이벤트 타입) 이벤트 핸들러(Event Handler) 이벤트가 발생되면 실행되는 코드 블럭(JavaScript)를 말한다. 이러한 코드 블럭이 이벤트에 응답해 실행되기 위해 정의되었을때 이벤트 핸들러를 등록(register)했다고 한다. 이벤트 리스너(Event Listener)라고 불리기도 한다. 이벤트 핸들러와 이벤트 리스너 엄밀히 말하면 이벤트 리스너는 발생되는 이벤트..

콜백 함수(Callback) 다른 함수의 인자로써 이용되는 함수 어떤 이벤트에 의해 호출되어지는 함수 어떤 이벤트가 발생했거나 특정 시점에 도달했을때 시스템에서 호출하는 함수를 말한다. 콜백함수는 가독성이나 코드 재사용에 유리하다? 주로 비동기방식으로 작성된 함수를 동기 처리하기위해 필요하다. 비동기 작업이 완료된 후 코드 실행을 계속하기 위해 사용된다. (비동기 콜백) 비동기 방식을 사용하는 이유는? 사용자 이벤트 처리 : 브라우저 화면에서 발생하는 사용자의 이벤트가 예측이 불가능하기때문에, 특정이벤트가 발생할때 호출해 원하는 내용을 callback함수에 전달하게 된다. 네트워크 응답 처리 : 클라이언트에서 서버에 요청을 보냈을때 그 응답이 언제 올 지 알수 없기때문에 비동기적으로 처리한다. 파일을 읽..

Object.entries entries : 입구, 들어감 Object.entries : 객체가 (배열로) 들어간다. Object.entries(obj) // 객체 → 배열 객체를 2차원 배열로 만들어 준다. 객체의 키와 값을 [key, value]의 배열로 반환한다. 객체가 배열로 바뀜에 따라 key와 value는 순서성을 가지게된다. Object.formEntries entries : 입구, 들어감 Object.formEntries : 배열이 객체의 엔트리로 부터 들어간다. Object.formEntries(arr) // 배열 → 객체 2차원으로 구성된 배열(key-value 쌍으로 이루어져있음)의 키 값 쌍 목록을 객체로 바꾼다. References. https://velog.io/@loocia19..