분류 전체보기(81)
-
[Javascript] : 국제화 지원 API Intl - supportedValuesOf
Intl의 함수를 사용하다 보면 옵션값으로 다양한 문자열을 넣게 된다. 이 때 어떤 문자열이 유효한지 조회하고 싶을 때 유용하게 사용할 수 있는 함수가 있다. 어떤 값을 넣어야 할지 헷갈리거나 모르겠을 때 Intl.supportedValuesOf함수의 리턴값을 참고하면 된다. Intl.supportedValuesOf 먼저 이 함수를 브라우저에서 사용할 수 있는지 체크하려면 undefined와 비교하면 된다. if (typeof Intl.supportedValuesOf !== "undefined") { // undefined이 아니라면 사용이 가능한 것! } currency 조회하기 // currency옵션에 넣을 수 있는 나라별 금액표기 값이 출력된다. console.log(Intl.supportedVa..
2023.02.18 -
[Javascript] : 국제화 지원 API Intl - NumberFormat
Intl(Internationalization) API는 Javascript에서 국제화 지원을 가능하게 하는 API다. Intl API를 사용하면 날짜, 시간, 통화, 메시지 등을 사용자의 지역에 맞게 표시할 수 있다. Intl API를 사용하려면 브라우저에서 지원하는지 먼저 확인해야 한다. 지원하지 않는 브라우저일 경우 Intl 폴리필 라이브러리를 사용하여 Intl API를 사용할 수 있다. 확인해보니 대부분의 브라우저를 22년도 4월에 업데이트 한 적이 있다면 Intl API를 사용할 수 있다. Intl.NumberFormat Intl.NumberFormat을 사용하면 언어별로 지정된 규칙에 따라 숫자를 서식화할 수 있다. 숫자를 해당 언어와 지역에 맞게 표시하고, 구분 기호(separator), 소..
2023.02.18 -
[Javascript] : 국제화 지원 API Intl - DateTimeFormat
Intl(Internationalization) API는 Javascript에서 국제화 지원을 가능하게 하는 API다. Intl API를 사용하면 날짜, 시간, 통화, 메시지 등을 사용자의 지역에 맞게 표시할 수 있다. Intl API를 사용하려면 브라우저에서 지원하는지 먼저 확인해야 한다. 지원하지 않는 브라우저일 경우 Intl 폴리필 라이브러리를 사용하여 Intl API를 사용할 수 있다. 확인해보니 대부분의 브라우저를 22년도 4월에 업데이트 한 적이 있다면 Intl API를 사용할 수 있다. Intl.DateTimeFormat Intl.DateTimeFormat 함수는 언어와 지역(국가)에 맞는 날짜와 시간 형식을 찾아준다. 기본 사용법 const date = new Date(Date.UTC(20..
2023.02.15 -
좋은 겨울이었다~ (feat.제주도)
작지만 아늑하고 따뜻했던 숙소 제주토끼. 밤에 도착했을 땐 단출한 숙소에 실망했지만 다음 날 아침 블라인드를 열었을 때는 헉 소리가 났다. 주황색 초록색으로 가득 찬 귤나무 뷰와 반짝이는 햇살이 방 안으로 쏟아져 들어오는 느낌! 날씨가 너무 좋았다. 햇살이 찰랑찰랑~~ 기분 좋게 아침 산책을 오래 했다. 귤이 가득 열려 추욱 고개를 숙인 귤나무들이 지천에 가~~~득 널렸다. 제주 바람에 둥개둥개 흔들거리는게 너무 이뻤다. 밤 산책을 나갔을 땐 담장 너머로 튀어나온 귤을 두어개 서리해 먹었는데 시원하고 달고 맛있었다. 햐 봐도 봐도 너무나 이쁘고 탐스러운 귤나무. 짙은 나뭇잎과 쨍한 주황색 귤 열매의 대비가 정말 눈을 시원하게 해준다! 요로코롬 무화가 나무도 보았다. 제주도는 여름에만 가봤는데 겨울 제주도..
2023.02.13 -
[Javascript] Carousel 구현
Javascript : Carousel 구현 carousel을 구현하는 다양한 방법이 있지만, 내가 신경쓴 부분은 3가지였다 : 터치패드로 슬라이딩이 될 것 무한 슬라이딩이 될 것 이미지가 좌/우로 넘어갈 때 슬라이딩 애니메이션으로 넘어갈 것 swiperJS를 사용했고, 이 라이브러리는 리액트전용 버전도 존재한다. 오늘은 자바스크립트로만 구현해보았다. 먼저 세 가지 파일을 생성한다 : index.html, main.js, style.css index.html 코드 Carousel 여러분의 스타일을 찾아보세요! style.css 코드 html, body { height: 100%; background-image: url('./background.svg'); background-repeat: no-repea..
2023.02.13 -
[Javascript] null, undefined, NaN의 차이
null, undefined, NaN은 자바스크립트에서 모두 falshy한 값으로 통용된다. 보통 코딩을 할 때 이 값이 falshy하냐 아니냐로 삼항 연산자나 논리연산자를 많이 사용한다. 그럼 이 세 값의 차이는 뭘까? null, undefined, NaN의 차이 null과 undefined는 자바스크립트에서 값이 없음을 의미하는 특수한 값이다. undefined는 변수가 선언되었지만 값이 할당되지 않은 경우에 대한 기본 값이다. null은 개발자가 명시적으로 값이 없음을 의미하고자 할 때 사용한다. NaN은 자바스크립트에서 숫자로 표현할 수 없는 값을 나타내는 특수 값이다. NaN은 숫자 연산에서 어떤 값을 잘못 처리하여 발생한다. 예를 들어, 문자열과 숫자를 계산하려 할 때 등이 있다. consol..
2023.02.12