열코의 프로그래밍 일기

웹뷰를 사용하여 안드로이드와 ios 앱을 동시에 만들면

스크롤 방식이 ios와 android가 다르다는점을 알 수 있습니다.

먼저 android는 모멘텀 스크롤 방식으로

스크롤을 손가락으로 튕구면 멈추지 않고 힘의 크기에 비례하여 계속해서 스크롤 됩니다.

이를 모멘텀 스크롤 방식이라합니다.

반면에 ios는 스크롤을 하면 손가락이 떼어지는(touchend) 순간 스크롤은 멈추게됩니다.

이를 해결하기 위해 스크롤 되는(overflow) element에 다음과 같은 css를 추가하면 해결됩니다.

-webkit-overflow-scrolling : touch;

auto는 기존 멈추는 방식(default)이며 touch 옵션을 사용하면 안드로이드처럼 

모멘텀 스크롤을 사용할 수 있게됩니다.

또한 안드로이드에서 ios처럼 멈추게 하고싶다면

스크롤되는 element의 자식들 모두에게 z-index : 0; css를 추가합니다.

만약 스크롤 되는 element의 id가 scroll이라면

#scroll * {

z-index: 0;

}

을 추가하면 모든 자식에게 한번에 css를 적용시킬수있습니다.

* date 변수 format을 변경하는 방법

- timestamp를 date로 변경하는 등 date변수를 불러오면 다음과 같이 format이 이상하다.

ex) Thu May 09 2019 10:23:18 GMT+0900 (한국 표준시)

- 간단한 함수를 통해 다음과 같이 변경해보려고 한다.]

ex) 2019-05-09 10:23:18

- 먼저 timestamp 변수를 date변수로 변경하는 방법이다.

var sysdate = new Date(timestamp); 

여기서 timestamp는 timestamp형식의 변수를 의미한다.

이상태에서 sysdate를 출력해보면 맨위의 한국 표준시 어쩌고 하는 이상한 format이 적용된다.

이를 변경하기위해 아래 함수를 정의하여 사용한다.

function date_to_str(format)

{

    var year = format.getFullYear();

    var month = format.getMonth() + 1;

    if(month<10) month = '0' + month;

    var date = format.getDate();

    if(date<10) date = '0' + date;

    var hour = format.getHours();

    if(hour<10) hour = '0' + hour;

    var min = format.getMinutes();

    if(min<10) min = '0' + min;

    var sec = format.getSeconds();

    if(sec10) sec = '0' + sec;

    return year + "-" + month + "-" + date + " " + hour + ":" + min + ":" + sec;

}

위 함수를 정의하여 다음과 같이 사용한다.

sysdate = date_to_str(sysdate);

완료

--------------------------------------------------------------------------------------

여기서 date format을 자신이 원하는 format으로 변경하고싶다면

date_to_str 함수에 마지막 return 값을 수정하면된다.

ex) 연도와 날짜까지만 출력하고 싶다면 date 뒤를 지우면된다.

기본적인 배열은 일반 변수들이 나열된 모양이다.

이런 일반적인 배열에서 인덱스를 통해 배열의 값을 구할수있다.

반대로 배열의 값을 아는경우에 해당 배열의 몇번째 인덱스인지 indexOf함수를 사용하여 다음처럼 구할수있다.

하지만 자바스크립트에서 배열의 원소들이 객체(object)라면 어떻게 될까?

아래의 예를 살펴보자.

위와 같은 객체배열이 존재한다고 가정하자.

객체 배열에서 객체안의 변수를 구하려면 다음과 같이 사용한다.

그렇다면 반대로 "강호동"이라는 문자열을 가지고 2라는 인덱스를 구하려면 어떻게해야할까?

(실제로 프로그래밍도중 해당 지식이 필요하여 찾아서 정리한것이다..)

답은 findIndex() 함수를 사용하면 된다. 예를 통해 살펴보자.

여기서 index의 값으로 2를 반환받는다.

i라는 변수명은 아무거나 적어도 작동하는것을 보였다. 하지만 다른 변수이름과 중복되면 왠지모를 찝찝함이 생기므로

obj나 안쓰는 다른 변수명을 사용하자.

그럼이제 저 index를 사용하여 해당 배열에 접근할수있겠지?

질문이나 오타는 댓글로 남겨주길.