hsunny study blog

document.querySelector 노드의 서브트리에서 매칭되는 첫번째 노드의 값을 반환한다. 만약 매칭되는 노드가 없으면 null을 반환한다. document.querySelectorAll 노드의 서브트리 내에서 매칭되는 모든 요소를 포함한 노드리스트를 반환하고, 매칭되는 것이 없다면 빈 노드리스트를 반환한다. querySelector && querySelectorAll querySelector(), querySelectorAll()로 생성된 순간의 셀렉터들로 채워진 요소들을 포함한다. (이 값은 변하지 않는다.) They can be a complete CSS(3)-Selector with IDs and Classes and Pseudo-Classes #id.class:pseudo tag #id..

정렬하기 javascript에서는 배열을 정렬할 수 있는 자체 함수를 제공합니다. Array.prototype.sort() arr.sort([compareFunction]) sort() 메서드는 배열의 요소를 적절한 위치에 정렬한 후 그 배열을 반환합니다. 정렬은 stable sort가 아닐 수 있습니다. 기본 정렬 순서는 문자열의 유니코드 코드 포인트를 따릅니다. 문서보기 매개변수 compareFunction (Optional) 정렬 순서를 정의하는 함수. 생략하면 배열은 각 요소의 문자열 변환에 따라 각 문자의 유니 코드 코드 포인트 값에 따라 정렬됩니다. 반환 값 정렬한 배열. 원 배열이 정렬되는 것에 유의하세요. 복사본이 만들어지는 것이 아닙니다. 문자열의 유니코드 코드값에 따라 소팅하기 때문에 ..

Array.filter() 를 통해 배열에 존재하는 중복 요소를 제거할 수 있습니다. arr.filter(callback(element[, index[, array]])[, thisArg) filter() 메서드는 주어진 함수의 테스트를 통과하는 모든 요소를 모아 새로운 배열로 반환합니다. 문서보기 방법 Array.filter((item, index) => nums.indexOf(item) === index ) 예제 let nums = [1,1,2,5,1,3]; nums라는 배열에 1이 3개가 존재합니다. let filteredArray = nums.filter((item, index) => nums.indexOf(item) === index ); filter를 이용하여 새로운 변수 filteredArr..

개발 중인 IONIC 앱에서는 Angular에서 제공하는 HttpClientModule을 이용하여 서버와 통신하고 있습니다. HttpClientModule은 Angular 4.3.0 버전에 추가되었습니다. Angular에서 제공하는 HTTP 모듈은 RxJS Observable 객체를 기반으로 만들어졌습니다. RxJS이지만 RxJS의 장점들을 이용하지 못하고 단순히 결과를 받는 데에만 이용하고 있었습니다. 이 부분에 대해 어떻게 개선해나갔는지 내용을 공유합니다. 기존 이런 생각을 시작으로 코드를 개선해나갔습니다. - 통신에 실패하는 이유를 timeout으로만 두어도 될까 - http 응답에 따라 처리를 다르게 주는 것이 괜찮을 것 같다! 첫 번째 개선 개선한 것 - 서버에 보낼 최종 데이터를 세팅하는 부분..

웹서비스 배포를 위해 서버에 Git을 설정해봤습니다. GitLab에서 프로젝트를 생성하고 생성된 프로젝트에 꾸준히 작업해오고 있었지만, 서버에 직접 설치해본 것은 처음이었습니다. 여러 블로그들의 글을 읽으며 도움을 받았던 이유로, 저도 도움을 드리고자 제가 겪었던 내용들에 대해서 글로 작성해보려고 합니다! ※ 정리에 참고한 페이지는 링크 연결하였습니다. 간단히 개념 집고 넘어가겠습니다! * Git이란 소스코드를 효과적으로 관리하기 위해 개발된 '분산형 버전 관리 시스템'입니다. Git으로 파일을 관리하면, 업데이트 이력이 Git에 저장되므로 백업용 파일 복사본을 만들 필요가 없어 가볍습니다. * 저장소란 파일이나 폴더를 저장해두는 곳으로 두 종류의 저장소를 제공합니다. Remote 저장소와 Local 저..

http 통신을 위해 사용했던 @angular/http 는Deprecated in favor of @angular/common/http.@angular/common/http를 위해 deprecate 되었습니다.*새로운 API는 Angular 4.3.0 이상의 버전에서 사용 가능합니다. 새로운 API는 아래와 같이 개선되었습니다. 1. JSON 포맷 형식의 데이터를 object 형식으로 자동 변환해줍니다. 2. HttpClient 가 리턴하는 객체의 타입을 지정할 수 있습니다. 3. 요청을 보내거나 받을 때, 이벤트를 발생시킬 수 있습니다. 4. Header 설정을 위한 syntax가 간결합니다. 5. HTTP 인터셉터가 추가되었습니다. HTTP 요청에 인증토큰헤더를 추가할 수 있습니다. HttpClien..

constructor()* 자바스크립트 엔진에서 호출됩니다.ES6 개념이며 라이프사이클 후크의 일부입니다.Angular가 구성요소 초기화를 언제 했는지 알 수 있는 위치는 아닙니다. 이용: 의존성 주입 import { NavController } from 'ionic-angular'; class MyComponent { constructor(public navCtrl: NavController) { //의존성 주입 }} ngOnInit()* Angular 라이프 사이클 후크입니다.Angular 컴포넌트 설정이 완료되면 실행됩니다.즉, 이 시점에서 속성 바인딩이 수행됩니다. 이용: 구성요소 데이터 초기화 (정적 데이터나 NavParams을 통해 온 데이터) ionViewDidLoad()* Ionic 네비게..

기획 요구사항에 따라 앱 내부 페이지 중 특정 페이지의 밝기는 강제로 밝게 적용해야 했다. 간단히 보기 사용한 플러그인cordova-plugin-brightness[사용방법]// After device ready, create a local aliasvar brightness = cordova.plugins.brightness;// value should be float in range from 0 to 1.brightness.setBrightness(value, success, error);// success([-1,0-1]) float 0-1 is a brightness level, -1 represents a system defaultbrightness.getBrightness(success, er..