728x90

dev/javascript 8

[javascript] XMLHttpRequest 파일 업로드 진행바 (with Progressbar 부트스트랩 컴퍼넌트)

파일을 업로드 진행 상태의 진행바(progressbar) 구현 진행바는 부트스트랩 콤포넌트를 이용한다. 콤포넌트 · 부트스트랩 Some default panel content here. Nulla vitae elit libero, a pharetra augue. Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam id dolor id nibh ultricies vehicula ut id elit. bootstrapk.com XMLHttpRequest: progress event 를 통해서 진행상태를 리턴받는다. XMLHt..

dev/javascript 2022.12.07

[javascript] 배열 다루기 - sort() 함수(정렬)

array.sort() 배열의 요소를 정렬 후 정렬된 배열을 반환(복사본이 아닌 원배열이 정렬됨) 구문 arr.sort([compare]) 매개변수 compare : 정렬의 순서를 정의하는 함수, 없으면 기본적으로 유니코드 값에 따라 정렬 compare 형식의 반환값에 따라서 정하여지며 형식은 아래와 같다. function compare(a, b) { if (a is less than b by some ordering criterion) { return -1; } if (a is greater than b by the ordering criterion) { return 1; } // a must be equal to b return 0; } * 0보다 작은 경우 a가 먼저온다. * 0보다 큰 경우 b가 ..

dev/javascript 2021.01.29

[javascript] 배열 다루기 - Array.map() 배열순회

map() 배열내 모든 요소들에 대하여 호출한 함수의 결과를 새로운 배열로 리턴 구문 Array.map(callback(currentValue[, index[, array]])[, thisArg]) 매개변수 callback 함수 : 배열 요소들에 대해서 실행되는 함수로 3개의 파라미터를 가진다. currentValue : 처리할 현재 배열의 요소 (필수) index : 처리할 현재 배열의 인데스 (선택) array : 호출한 배열 (선택) thisArg : callback을 실행할때 this (선택) 예제

dev/javascript 2020.12.30

[javascript] 배열 다루기 - push(), pop() 함수(배열 추가, 삭제)

push() 배열의 마지막에 새로운 요소를 추가하고 배열의 길이를 리턴 구문 Array.push(element1 [, element2 ...]) 매개변수 element : 배열에 추가할 요소 pop() 배열의 마지막요소를 삭제 후 삭제된 요소를 리턴 구문 Array.pop() 예제 const nums = [1,2,3]; const count = nums.push(10,20); console.log("push") console.log(count); console.log(nums); console.log("pop") console.log(nums.pop()); console.log(nums);

dev/javascript 2020.12.30

[javascript] 배열 다루기 - Array.reduce() 함수, 배열의 합, 최대값, 최소값 구하기

javascript 함수 reduce() reduce() 를 저는 자주 사용하지 않지만 간혹 사용할때가 있다.(자주 사용하지 않는것을 기록하면서 다시한번 상기해본다.) reduce() 함수는 배열의 요소들에 대하여 실행 후 하나의 결과를 반환 구문 Array.reduce(callback [, initialValue]) 매개변수 callback 함수 : 베열 요소들에 대해서 실행되는 함수로 4개의 파라미터를 가진다. accumulator (acc) : 콜백함수의 반환값 누적 (필수) currentValue (cur) : 처리할 현재 배열의 요소 (필수) currentIndex (idx) : 처리할 현재 배열의 인데스 (선택) array (src) : 호출한 배열 (선택) initialValue : 첫번째 ..

dev/javascript 2020.12.11

[javascript] Date 객체 - 날짜 형식(yyyyMMdd), 날짜더하기( DateAdd)

* Date 객체 및 메서드에 대한 자세한 내용은 아래 사이트에서 참고 Date Date 생성자는 시간의 특정 지점을 나타내는 Date 객체를 생성합니다. developer.mozilla.org 오늘날짜 구하기 및 형식 변환(yyyy-MM-dd) // Date string 형식 let now = new Date(); console.log(now.toString());// "Fri Nov 27 2020 16:56:53 GMT+0900 (대한민국 표준시)" console.log(now.toJSON());// "2020-11-27T07:56:53.606Z" console.log(now.toISOString());// "2020-11-27T07:56:53.606Z" // Date객체의 toJSON() 이나 to..

dev/javascript 2020.11.27

[javascript] null vs undefined

자바스크립트는 변수의 선언시 var 키워드를 사용하고 변수를 선언시에 자료형이 결정되지 않으며 값이 변수에 할당이 될 때 자료형이 결정이 됩니다. 자바스크립트에서는 null 과 undefined 라는 상수가 존재하고 있습니다. null 은 "유효한 값이 아닌 것" 으로 값 자체가 없다는 의미가 아니라 유효한 값이 아니라는 의미 입니다. var tmpVal1 = null; var tmpVal2; 변수 tmpVal 은 null 값을 가지게 되고, 값은 유요한 의미를 가지고 있지 아닌것입니다. tmpVal2 와 같이 아무런 값이 할당이 안되어 자료형을 알 수 없는 타입이 undefined 입니다 이와 마찬가지로 선언되지 않은 변수에 접근을 하게 되면 undefined 를 리턴합니다. null 과 undefin..

dev/javascript 2020.10.15

dropzone.js (드롭존) 드래그앤드롭 파일 업로드

진행하던 업무에 파일업로드 관련해서 UI 가 조금 변경을 하게 되었습니다. 검색을 해보니 많은 분 들이 dropzone 에 대해 많은 게시 글과 칭찬을 보게 되어 dropzone 훑어 보았습니다. https://www.dropzonejs.com/ Dropzone.js dropzone.js DropzoneJS is an open source library that provides drag’n’drop file uploads with image previews. It’s lightweight, doesn’t depend on any other library (like jQuery) and is highly customizable. Scroll down! www.dropzonejs.com 보시다시피 usage..

dev/javascript 2020.10.06
728x90