메모장

1. 파일 손상문제 발생 자바스크립트 단에서 파일을 DB에 업로드, 다운로드를 진행하다가 파일이 깨지는 문제가 발생했습니다. 아래는 문제가 발생했을 당시 코드입니다. var reader = new FileReader(); const file = document.getElementById("fileInput").files[0]; const fileName = file.name; const fileSize = file.size; const fileType = file.type; let fileBlob = ""; reader.readAsArrayBuffer(file); reader.onload = function (evt) { fileBlob = evt.target.result; let data = { Nam..

Object.keys() 를 이용해 배열을 순회하려고 하는데 key값이 index로 들어가는 문제가 있었습니다. Object.keys() 함수는 객체의 키들을 배열로 반환합니다. 이 배열의 인덱스는 0부터 시작하므로, for...in 루프를 사용하여 객체의 키들을 순회할 때, 첫 번째 키는 0이 됩니다. 이 경우 for...in 루프 대신 for...of 루프를 사용하면, 배열의 각 요소를 직접 참조할 수 있습니다. for...of 루프는 배열의 값을 순회하며, 배열의 인덱스를 신경쓰지 않기 때문에 위와 같은 문제가 발생하지 않습니다. let data = this.data; let keys = Object.keys(data); for (let key of keys) { this.data[key] = da..

기존 tree 라이브러리의 getNodeByKey함수를 사용하던 것을 div로 바꾸면서 만든 특정 key값를 가진 노드를 찾는 함수입니다. const objArr = [ { id: 1, name: 'Alice', children: [{ id: 11, name: 'Bob' }] }, { id: 2, name: 'Charlie', children: [{ id: 21, name: 'Dave' }] } ]; const key = 'Bob'; let node = getNodeByKey(objArr, key); function getNodeByKey(arr, value) { let result = null; for (let i = 0; i < arr.length; i++) { const obj = arr[i]; i..

아래의 코드에서 setTimeout 함수를 이용하던 중 함수 내부의 this와 함수 외부의 this가 다른 것을 가르키는 것을 확인했습니다. let elem = document.querySelector('#' + this._id + ' #' + elemId); if (elem == null) { setTimeout(function () { elem = document.querySelector('#' + this._id + ' #' + elemId); }); } setTimeout 함수 setTimeout 함수는 비동기 함수로서, 일정 시간이 경과한 후에 함수를 실행하는 기능을 제공합니다. 따라서 setTimeout 함수 내부에서는 콜백 함수를 정의하여 사용해야 합니다. setTimeout 함수의 this..

[요구사항] 1. mian 페이지에서 subPage를 오픈. 2. 어떤 페이지에서 로그아웃되면 전체 페이지에서 로그아웃 (한 창만 로그아웃화면으로 이동하고 나머지는 닫음) 3. 부모창을 닫으면 자식창도 닫침. (부모창 닫을때 컨펌) 4. mian페이지 위에 최상위 부모창이 있을 경우도 있음. subPage1 $scope.logout = function () {//subPage1에서 로그아웃할때 바로 /lougout으로 이동하지 않고 상위 페이지 close sessionStorage.clear(); localStorage.setItem("closeAllTabs", "Y"); localStorage.setItem("closeTabsTrigger", "subPage1"); window.opener.close(..

웹 페이지 로드 과정 Prompt for unload 페이지를 벗어날 때(다른 페이지로 이동할 때) 발생한다. unloadEventStart에서 window에 beforeunload 이벤트가 발생한 후 unload 이벤트가 발생한다. Redirect (redirectStart, redirectEnd) 서버쪽에서 redirect 신호가 오면 발생한다.(HTTP code 301, 302) optional이라서, 발생하지 않을 수 도 있음. AppCache 서버에서 데이터를 받아오기 전에 브라우저에 캐시가 있는지 확인 내부 네트워크 처리 단계(DNS, TCP, Request, Response) DNS(domainLookupStart, domainLookupEnd) DNS에 요청을 보내기 전에 먼저 브라우저에 ..

iframe을 display: none으로 추가하고 load완료 후 show해주면서 화면이 깜빡이는 것을 방지할 수 있음. form생성 전에 로딩창을 띄우고 load완료 후 숨겨줌. function functionOpen(functionName){ var functionInfo = functionModel.getFunction(functionName);//화면 정보 가져옴 $("#maincontents").remove(); var iframeHtml = "" $("#frameDiv").append(iframeHtml);//ifram 추가 commonUtil.showLoadingPage();//화면 로딩 표시 보여주는 함수 var form = document.createElement("form"); // ..

1. setTimeout() 시간지연함수. 함수를 의도적으로 지연한 뒤 실행하고 싶을 때 사용한다. setTimeout(function() { // Code }, delay); 지연시간은 밀리세컨드 단위로 설정해야한다. (1000은 1초) *delay는 실행전 대기 시간이지만 호출 시점이 정확히 몇초 후라는 것을 보장하지 않는다. 2. 작동원리 (delay 0) 그런데 지연시간에 0을 넣거나 아무것도 넣지않아도 setTimeout함수는 다른코드가 실행된 후 마지막에 실행된다. 브라우저가 자바스크립트를 실행할 때 Call Stack(LIFO)에 넣는데 setTimeOut은 Task Queue(FIFO)에 넣음. Stack이 비워야 Queue에 있는걸 꺼내기 때문에 (아래 3번에서 설명) 지연시간으로 0초를..

1. sort() arr.sort([compareFunction]) compare함수 파라미터 가 생력되면, 배열의 element들은 문자열로 취급되어, 유니코드 값 순서대로 정렬됨. 1. 오름차순 (숫자) 일반적인 문자열 배열은 arr.sort()하면 오름차순으로 정렬됨!But, 숫자일 경우 [10, 2, 1].sort()하면 [1, 10, 2]가 됨!!-> int로 parse하는 함수 작성 let brr = arr.sort(function(a, b) { return parseInt(a) - parseInt(b); }); 2. 내림차순 리턴이 b - a let brr = arr.sort(function(a, b) { return b - a; }); 3. 객체 배열 객체로 이루어진 배열일때는 객체의 ke..

.zindex9999{ z-index: 9999; } 팝업창이 2개이상일때 팝업창의 앞뒤순서를 지정하기위해 zindex속성설정 $("#popup").dialog({ height: 300, width: 400, modal: true, //true: 부모화면 클릭 불가능 draggable: true, title: "popup", dialogClass: "zindex9999", //class 적용 buttons: [ { text: 'Ok', click: function () { }, }, { text: 'Close', click: function () { $(this).dialog("close"); }, } ] });