Dlog

Dlog

  • 분류 전체보기 (19)
    • Study (17)
      • Javascript (7)
      • HTML+CSS (1)
      • React+Next (5)
      • Svelte (0)
      • Node (0)
      • Error (3)
      • CS (1)
    • 프로젝트 (1)
    • 잡담 (0)
RSS 피드
로그인
로그아웃 글쓰기 관리

Dlog

컨텐츠 검색

태그

최근글

댓글

공지사항

아카이브

Study/Javascript(7)

  • [javascript] Timezone

    실시간으로 당첨된 내역을 불러오면서 몇시간 전인지 보여주는 뱃지를 구현해야했다. 당첨 내역이 한시간 이내면 n분 전, 이상이면 n시간 전으로 나오게끔 해놓았는데 로컬에서는 문제가 없었으나 배포하고나니 -nnnn분 전 이런 시간으로 출력되었다. 계산을 해보니 얼추 9시간 정도의 오차가 나왔고 아 이게 그 timezone 문제구나를 깨달았다. Timezone이란 동일한 로컬 시간을 따르는 지역을 의미한다. 예를 들어 미국의 경우 다양한 timezone으로 나눠진다. Central Standard Time Mountain Standard Time Pacific Standard Time Eastern Standard Time 등 ... 참고: https://docs.oracle.com/middleware/122..

    2023.12.19
  • [javascript] Session storage, Local storage, Cookie

    세션 스토리지(Session storage)와 로컬 스토리지(Local storage)는 HTML5에서 추가된 저장소로 간단한 키와 값을 저장할 수 있다. 여기에 저장하면 새로고침을 해도 데이터가 날아가지 않는다. 세션 스토리지는 브라우저를 닫으면 데이터가 사라지지만 로컬 스토리지는 브라우저를 닫아도 남아있다. 저장 제한 용량은 모바일은 2.5mb, 데스크탑은 5mb~10mb 정도이며 기기마다 다를 수 있다. Local Storage 로컬 스토리지는 window.localStorage에 위치한다. Origin(도메인, 포트, 프로토콜)이 같다면 url 경로가 달라도 공유된다. 한 창에서 데이터를 설정하면 다른 창에서도 변동 사항을 확인할 수 있다. 메소드 setItem(key, value) - 키-값 쌍..

    2022.12.02
  • [javascript] 이벤트 버블링, 캡처링

    이벤트 버블링, 캡처링이란 해당 요소에 바인딩 된 이벤트를 실행할 때, 내가 실행시키려는 요소를 감싼 부모 요소들의 이벤트까지도 실행(전파)되는 것을 말한다. 아래 코드를 실행해보면 나는 버튼을 클릭했는데 버튼에 바인딩 된 이벤트 뿐만이 아니라 parant와 child에 바인딩 된 이벤트 까지 실행된다. const parant = document.querySelector('.parant'); const child = document.querySelector('.child'); const button = document.querySelector('button'); function parantClick(e){ alert('I am parant!') } function childClick(e){ alert('..

    2022.05.28
  • [javascript] 배열 고차함수 map, filter, reduce

    고차함수란? 다른 함수를 전달 인자(매개변수)로 받거나, 함수를 결과로 반환하는 함수를 뜻한다. 1. map 기존의 배열을 순회하여 새로운 배열을 만들 때 사용된다. 이 때 기존의 배열은 변경되지 않는다. let array = [1, 2, 3, 4, 5] let arrayMap = array.map((item) => { return item + 1; }); console.log(arrayMap); //[2, 3, 4, 5, 6] console.log(array); //[1, 2, 3, 4, 5] ❓ forEach와의 차이점은? map은 콜백 함수를 반복적으로 실행한 결과를 반환하여 새로운 배열을 생성한다. forEach는 콜백 함수를 반복적으로 실행하지만 값을 반환하지 않아 리턴값을 사용할 수 없다. 2..

    2022.03.26
  • [javascript] for in, for of, forEach

    for in문 for in문은 객체의 반복문으로 객체의 프로퍼티를 순회하며 작업을 수행한다. 이 때, 열거가 가능한 ([[Enumerable]]속성이 true인) 객체만 사용이 가능하다. 객체의 key값에 접근할 수 있으며, 이를 이용하여 속성값을 출력하거나 저장할 수 있다. 예제 const obj = { name: 'nabi', age: 2, type: 'korean shothair', } for(const key in obj){ console.log(`${key}:${obj[key]}`) } //name:nabi //age:2 //type:korean shothair const list = { person1: { id: 1, name: "kim", age: 20, }, person2: { id: 2,..

    2022.03.21
  • [javascript] http와 https

    http란? HyperText Transfer Protocol의 약자로 웹에서 데이터를 주고 받을 수 있는 프로토콜을 말한다. 웹에서 이루어지는 모든 데이터 교환의 기초이며, 클라이언트-서버 프로토콜이기도 하다. 프로토콜이란 데이터를 주고 받을 때 주고 받는 방법에 대한 규칙 및 약속을 말한다. 클라이언트(사용자 브라우저)가 서버에 메세지를 보내면 서버가 그 메세지에 맞는 결과를 보내주는데 이러한 동작을 요청(request), 응답(response)이라고 칭한다. Request Method 데이터를 요청할 때는 요청의 종류를 서버에게 알려줘야 하는데 이러한 요청방법(Request Method)은 다음과 같다. GET: 데이터를 요청하기위해 사용 POST: 데이터를 생성하기위해 사용 PUT: 데이터를 수정..

    2022.03.04
이전
1 2
다음
티스토리
© 2018 TISTORY. All rights reserved.

티스토리툴바