dev in Serengeti

[넥사크로17] 넥사크로 데이터셋 메소드 정리 데이터셋에서 row 생성 (맨아래 row 로 생성) var row = this.ds.addRow(); 데이터셋에서 row 생성 (맨위에 row 로 생성) var row = this.ds.insertRow(); 데이터셋에서 row 삭제 this.ds.deleteRow(this.ds.rowposition); this.ds.deleteRow(rowIndex); 데이터셋에서 컬럼 가져오기 this.ds.getColumn(rowIndex, "columnName"); 데이터셋에서 특정컬럼 세팅하기 this.ds.setColumn(row, "columnName", value); 데이터셋에서 컬럼정보 가져오기 this.ds.getColumnInfo(columnIndex);..

[AngularJS] AngulrJS 깊은복사 vs Javascript 로 깊은복사 깊은복사와 얕은복사의 차이점은 모두 안다고 가정하고, AngularJS 에서 깊은복사하는 법과 Plain Javascript 로 깊은복사하는 법만 간략히 정리해본다. [AngularJS 함수] var array = [1,2,3,4,5]; //angular.copy() var array2 = angular.copy(array); //깊은복사가 완료되었다 // array = [1,2,3,4,5] // array2 = [1,2,3,4,5] [Javascript 에서 깊은복사하기] var array = [1,2,3,4,5]; //JSON.parse() & JSON.stringify() var array2 = JSON.parse(..

[자바스크립트] page load 이후 script 실행하기 - onload() 와 ready() 사용하기 자바스크립트와 제이쿼리를 섞어쓰다보면 헷갈릴 때가 있다. 차이점과 사용법을 정리해보자 onload() 와 $.ready() 의 차이점은? onload() 는 페이지 내 모든 content 가 load 되면 실행된다 (DOM, image, script 등 모두를 포함) $.ready() 는 반면에 DOM (HTML Structure) 만 load 되면 실행된다 (image, script 등을 기다리지 않음) => 결과적으로 실행시점은 $.ready() 가 훨씬 빠르다 [사용법] 1) onload() window.onload = function() { //type your code alert('모든 c..

[자바스크립트] 기본형과 참조형의 차이 / deep copy & shallow copy [요점정리] 기본형은 변수를 할당한 후, 해당 저장소에 값을 저장하며, 참조형은 변수를 할당한 후, 해당 저장소에 주소를 저장한다. 이런 차이점으로 인하여, 기본형은 복사 후 원본값이 변경될 경우, 복사본의 값은 변하지 않고 그대로인 반면, 참조형은 복사 후 원본값이 변경될 경우, 서로가 참조하고 있는 주소값이 같은므로, 원본값과 복사본의 값이 둘다 변경된다. 여기서 깊은복사(deep copy) 와 얕은복사(shallow copy)가 구별된다. [데이터의 구조] 1) 기본형(primitive type) : String, Number, Boolean, Null, Undefined, Symbols 기본형은 하나의 저장소가..

[AngularJS] $location 메소드/이벤트 사용하기 AngularJS 에서 제공하는 $location! URL 을 조작하거나, 페이지 이동기능에 많이 쓰이는 친구인데, 간단하게 정리해보자 [메소드] 1) absUrl() 전체 URL 을 return 한다 getter 의 역할만 수행한다 //예시 URL : https://example.com:8080/#/12?category=901018 var temp = $location.absUrl(); // => "https://example.com:8080/#/12?category=901018" 2) url([url]) 파라미터가 없다면, slash(/) 이후의 URL 을 return 한다 파라미터가 있다면, slash(/) 이후의 URL 을 변경한 후,..

[자바스크립트] throttling - 이벤트 실행횟수 제한 너무 많은 이벤트가 지속적으로 발생할 시, 과부화를 일으켜 사용자 환경에 버벅거림을 줄 수 있다. 이를 막기위해, 하나의 이벤트가 실행되는 동안은 같은 이벤트가 또 실행되지 않도록 제한을 주는 기술이다. [사용법] var temp; document.addEventListener('scroll', function() { if(!temp) { temp = setTimeout(function() { temp = null; //type your code here }, 500); } }) [간단원리] 이벤트 발생시, 먼저 timeout 이 존재하는지 확인 후, 존재한다면 아무것도 안함 만약 timeout 이 존재하지 않는다면, 새로운 timeout 을 ..

[자바스크립트] debouncing - 맨 마지막 이벤트만 캐치하기 너무 많은 이벤트가 지속적으로 발생할 시, 과부화를 일으켜 사용자 환경에 버벅거림을 줄 수 있다. 이를 막기위해 동일한 이벤트를 묶어서, 맨 마지막에 발생한 이벤트만 실행되게 만드는 기술이다. 특히 Ajax call 을 동반한 스크롤, 검색창, 버튼클릭 이벤트에 주로 쓰일 수 있겠다. (Ajax 요청을 최소화) [사용법] var temp; document.addEventListener('scroll', function() { if(temp) { clearTimeout(temp); } temp = setTimeout(function() { //type your code here }, 500); }) [간단원리] 이벤트 발생시, 먼저 tim..

[자바스크립트] Object 빈값? empty Object 확인하기 자바스크립트 객체가 비어있는지 확인하고자 할 때! 일반적인 null 값 체크로는 애매하다. 그럼 어떻게 할까? 1) Object.keys() 를 사용 [예시] var obj = {}; if(Object.keys(obj).length == 0 && obj.constructor === Object) { //type your code } Object.keys() 로 변환해서 length 를 체크하는 건 알겠는데, 왜 constructor 체크를 할까? constructor 체크를 안한다면 어떻게 될까? function constructorCheck(val) { // return Object.keys(val).length == 0 && val...

[자바스크립트] javascript Object.values() 사용하기 자바스크립트 객체를 배열로 변환해주는 메소드! 객체의 value 로만 이루어진 배열을 반환한다. [사용법] var son = { name : 'Son', age : 30, position : 'forward', team : 'Spurs' } Object.values(son); // 결과값 : // ['Son', 30, 'forward', 'Spurs'] // 응용해보기! // 'Spurs' 만 골라내고 싶다면, Array함수 중, find() 를 사용! // 화살표함수 말고 일반함수를 사용해보자 var temp = Object.keys(son).find(function(el,idx) { if(el == 'Spurs') return ..

[자바스크립트] javascript Object.keys() 사용하기 자바스크립트 객체를 배열로 변환해주는 메소드! 객체의 key 로만 이루어진 배열을 반환한다. [사용법] var son = { name : 'Son', age : 30, position : 'forward', team : 'Spurs' } Object.keys(son); // 결과값 : // ['name', 'age', 'position', 'team'] // 응용해보기! // 결과값 안에 'team' 만 골라내려면 Array함수 중, find 를 사용 var temp = Object.keys(son).find(el => el == 'team'); // temp 의 값은 'team' [간단설명] 객체의 key 값에만 접근하고 싶을 때 사..