[JS] 자바스크립트로 zip파일 생성하기 (JSZip 라이브러리)
·
STUDY/JavaScript
JSZIP 라이브러리는 브라우저나 Nodejs에서 ZIP 압축파일을 만들 수 있게 해줍니다.다운로드 기능은 file-saver 라이브러리를 사용해도 되고, a태그를 만들어서 사용해도 됩니다. JSZip 다운로드1. 아래 링크를 열어줍니다.https://stuk.github.io/jszip/ JSZipJSZip is a javascript library for creating, reading and editing .zip files, with a lovely and simple API. Current version : v3.10.1 License : JSZip is dual-licensed. You may use it under the MIT license or the GPLv3 license. See L..
[JS] contenteditable div태그에서 text만 사용하기
·
STUDY/JavaScript
contenteditable = true 인 div 태그에는 붙여넣기 할 경우 html 요소까지 다 같이 붙여넣기 되는 문제가있다.div태그안에 오직 텍스트만 사용하고 싶을때 아래 코드를 참고하여 작성하면 된다. (jquery) /* html tag 가 붙여넣기 했을때 딸려오지않도록 텍스트만 사용 */$('#text_messagearea').on('paste', function(e) {    e.preventDefault(); // 기본 붙여넣기 동작을 막습니다.    const clipboardData = e.originalEvent.clipboardData; // 클립보드 데이터를 가져옵니다.    const getText = clipboardData.getData('text/plain'); // 클..
[JS] 자바스크립트 new URL 오탈자 chrome 브라우저 보정
·
STUDY/JavaScript
별건 아니지만 새로 알아낸 사실 😎자바스크립트 new URL 에 주소를 https 를 ttps 로 오기입했을때 ..Chrome: "ttps://example.com"을 입력하면 자동으로 "https://example.com"으로 보정하여 URL을 생성합니다.Edge: "ttps://example.com"을 입력하면 유효하지 않은 URL로 인식하여 오류가 발생하고, host를 추출할 수 없습니다.
[JS] 자바스크립트 소수점 연산 오류 해결 방법
·
STUDY/JavaScript
자바스크립트에서 소수점 연산 시 발생하는 오류는 부동소수점 표현 방식의 한계 때문에 종종 발생합니다.1. 컴퓨터로 숫자를 표현하는 데에는 한계가 있고2. 10진수로 표현되는 소수를 2진수로 표현하려면 몇몇의 경우 무한소수가 발생하는데,3. 무한수를 유한하게 표현하려다 보니 미세한 값들이 초과되거나 손실되어4. 계산 오류가 일어난다. 위와 같은 오류로 자바스크립트에서는 0.1 + 0.2가 정확히 0.3이 나오지 않는 등 예상치 못한 결과가 나올 수 있습니다.이러한 문제를 해결하기 위한 다양한 방법을 알아보겠습니다. 1. toFixed() 메서드소수점 이하 자릿수를 지정하여 반올림한 문자열 값을 반환합니다.주의할 점: 반환값이 문자열이므로 숫자 연산에 사용하려면 다시 숫자로 변환해야 합니다.let a = 0..
async / await 병렬 처리 - Promise.all()
·
STUDY/JavaScript
보고 와야 할 이전글:   https://rebornbb.tistory.com/entry/JS-async%EC%99%80-await-%EB%9E%80 병렬처리란 ?병렬 처리는 여러 가지 일을 한꺼번에 하는 것과 같습니다. (예: 빨래를 돌리는 동안 설거지를 하고 청소기를 돌리는 것) Promise.all 로 비동기 작업 병렬처리하기JavaScript에서 비동기 작업을 병렬적으로 처리하기 위해 Promise.all 메서드를 사용합니다.Promise.all 함수는 여러개의 프로미스를 인자로 받아 하나의 프로미스를 반환하는 함수인데, 전달된 모든 프라미스가 완료될 때 까지 기다리며 그 결과로 프로미스들의 결과를 배열로 반환한다.이러한 동작들 때문에 Promise.all을 사용하면 비동기 작업을 병렬로 실행 할..
[JS] 클립보드 복사 기능 writeText()
·
STUDY/JavaScript
Clipboard: writeText() method 이 기능은 보안 컨텍스트 (HTTPS) 에서만 사용할 수 있으며 , 일부 또는 모든 지원 브라우저 에서 사용할 수 있습니다 .  writeText()인터페이스의 메서드는 지정된 텍스트를 시스템 클립보드에 쓰고클립보드가 업데이트되면 해결되는 Promise 를 반환합니다.writeText(newClipText)newClipText : 클립보드에 기록할 문자열.Promise : 클립보드의 내용이 업데이트되면 반환NotAllowedError DOMException : 클립보드에 쓰는 것이 허용되지 않으면 throw됩니다.  자바스크립트function myFunction() { var copyText = document.getElementById("myI..
[JS] 다운로드 기능 - a 태그 download 속성
·
STUDY/JavaScript
태그의 download 속성은 사용자가 하이퍼링크를 클릭할 때 해당 대상(target)으로 연결되지 않고 대신 해당 콘텐츠가 다운로드됨을 명시합니다. 이 속성은 반드시 href 속성이 설정되어 있어야만 사용할 수 있습니다.이 속성의 속성값은 다운로드되는 파일의 이름이 되며, 그 값에 특별한 제약은 없습니다. 브라우저는 다운로드되는 파일의 정확한 확장자명을 확인하여, 자동으로 파일 이름 끝에 추가합니다. (.html, .pdf, .jpg 등)만약 download 속성의 속성값을 생략하면, 다운로드되는 파일의 원래 이름이 사용됩니다.  var url = "다운로드하고자하는 파일경로";var anchor = document.createElement('a');anchor.href = url;anchor.d..
[JS] encodeURIComponent
·
STUDY/JavaScript
encodeURIComponent요약문자를 유니코드 값으로 인코딩합니다. (영문,숫자 제외) URI로 데이터를 전달하기 위해서 문자열을 인코딩문법encodeURIComponent(string)인자인자명데이터형필수/옵션설명stringstring필수인코딩할 문자열 반환값string, 인코딩된 문자열을 반환설명encodeURIComponentURI(Uniform Resource Identifier) ​​구성 요소를 인코딩하기 위해 JavaScript에서 사용되는 함수입니다. 이는 URL 내에 특수 문자가 포함된 데이터를 포함하려는 경우 특히 유용합니다.작동 방식은 다음과 같습니다.인코딩 : URI 구성 요소의 특정 문자를 해당 이스케이프 시퀀스로 바꿉니다. 이러한 이스케이프 시퀀스는 퍼센트 기호(%)와 문자의..