본문 바로가기

자바스크립트54

[Axios] json이 아닌 파일통신 받는 법

개요 파일 다운로드 기능을 개발하였다. 스펙은 다음과 같다. vue.js2, javascript, axios, file-saver 라이브러리 다운로드를 하게는 만들었는데, 파일을 열어보면, 열리지 않았다. 서버 api는 stream을 내려준다. 서버 개발자가 api를 호출하면 바로 파일이 다운로드 될거라고 했는데, 그렇지 않았다. 원인 axios 요청응답에 responseType을 지정해주지 않았기 때문이다. responseType default value는 json이다. You can configure the type of the data property using Axios' responseType object. By default, responseType is set to 'json' , which.. 2022. 10. 20.

[Javascript] Array.prototype.fill()

const arr = Array(100).fill() console.log(arr); // [ undefined,undefined,undefined,undefined,undefined ...] console.log(arr.length); // 100 const arr = Array(10).fill('👍')// ['👍','👍','👍','👍','👍','👍','👍','👍','👍','👍'] 숫자만큼 1부터 숫자까지 배열 만들기 const arr2 = Array(10).fill().map((_, i) => i+ 1) console.log(arr2); // [1,2,3,4,5,6,7,8,9,10] 2022. 10. 9.

[jest] TypeError: Cannot read property 'components' of undefined

jest 테스트 에러 TypeError: Cannot read property 'components' of undefined 해결 방법 export default { name: '', mixins: [doBookmark], 👈 삭제 ... } 2022. 10. 5.

[Javascript] 메서드? 함수?

메서드란, 객체 프로퍼티에 저장된 함수를 말한다. 메서드는 this로 객체를 참조한다. https://ko.javascript.info/object-methods 2022. 9. 28.

[Javascript]Context란?

런타임에 자바스크립트 함수가 런타임 환경의 콜스텍에 들어갈 때, context는 만들어진다. context는 '문맥'이다. 2022. 9. 28.

[Javascript] mutable과 immutable 데이터 관리하기

mutable 메서드 mutable method로 상태를 변경하면 안됩니다. splice() sort() push() shift() unshift() pop() immutable 메서드 immutable 메서드를 사용해서 상태 관리를 해줘야, 사이드 이펙트가 없다고 한다. 변수가 참조하고 있는 메모리 주소에 값을 변경하는게 아니라, 새로운 값을 가지는 새로운 메모리 주소를 상태가 재할당받는 거임. slice() map() concat() filter() spread(...) 2022. 9. 26.

[Javascript] 파일 용량 포멧 코드

Math.log() 자연로그의 값을 반환한다. 0이면, -Infinity, 음수면, NaN 반환 Math.log는 입력받은 파라미터가 2.718..(자연상수)의 몇 거듭제곱인지 반환해준다. 자연로그 자연로그: ln(x)에서 x에 해당하는 수. 무리수 e를 밑으로 하는 로그 logex를 자연로그라고 lnx로 나타낸다. 자연상수 자연상수: 2.7182... 끝이 없는 무리수.(e), 자연로그 lnx의 밑이다. '오일러의 수'라고 한다. x의 값이 0에 한없이 가까워질 때, 일정한 값에 가까워지며 그 극한값을 e로 나타낸다. 로그를 계산하는 방법 log3^9 = 2 log3^27 = 3 log2^1024 = 10 . . . lnx = loge^x Math.log(980) = ln980 = log2.718..... 2022. 9. 25.

[Javascript] 모르는 부분

reduce javascript에서 가장 강력크한 기능?이다? reduce 함수는 네 개의 인자를 가진다. 1. 누산기(acc) 2. 현재 값(cur) 3. 현재 인덱스(idx) 4. 원본 배열(src) 리듀서 함수의 반환 값은 누산기에 할당되고, 누산기는 순회 중 유지되므로, 결국 최종 결과는 하나의 값이 된다. 배열에 각 요소에 대해 함수를 실행하고 누적된 값을 출력할 때 용이하다. const arr = [1,2,3,4,5]; const result = arr.reduce((acc, cur, idx) => {return acc +=cur}, 0); console.log(result); // 15 const arr2 = [1,2,3,4,5] const result2 = arr2.reduce((acc, .. 2022. 9. 20.

[jest] svg를 import한 vue 컴포넌트 테스트 실행 오류 해결방법

jest 테스트 실행 할 때, 오류 내용 SyntaxError: Unexpected token ' 2022. 9. 19.

API 응답 AXIOS 에러를 컴포넌트로 전달하기

async cancel() { try { 에이피아이 호출 return result; // true } catch (error) { console.error(error.response); throw error; } }, 컴포넌트에서 에러 처리 try { 아시오스 요청 무언가 } catch(error) { console.error(error); this.errorAlert(error.response.data.error); 👈 } 2022. 8. 29.