JS4 [JS] React에서 자주 사용되는 JS 문법 몇가지 오늘은 React에서 자주 사용되는 JS 최신 문법(es6) 몇가지에 대해 알아보자. 1. Object Shorthand Assignment 예를 들어 name, age라는 2개의 변수와 person이라는 객체가 있다고 가정하자. 그 객체 안의 key와 value의 값은 아래와 같다. let name = "Lee" let age = "20" let person = { name: name, age: age } console.log(person); 콘솔창에 찍어보면 name에 변수 name이 age에는 변수 age가 잘 들어간 것을 볼 수 있다. 위의 경우처럼 key의 이름과 value의 이름이 서로 같다면 아래처럼 위의 코드보다 간결하게 코드를 작성할 수 있다. let name = "Lee" let age.. 2023. 2. 1. [JS] setInterval()과 setTimeout() 함수 setInterval() 웹페이지의 특정 부분을 주기적으로 업데이트해줘야 하거나, 어떤 API로 부터 변경된 데이터를 주기적으로 받아와야 하는 경우가 있다. 이럴 때는 자바스크립트의 setInterval() 함수를 사용할 수 있다. setInterval() 함수는 원하는 코드를 일정한 시간 간격을 두고 반복해서 실행하고 싶을 때 사용한다. 사용법 setInterval( 함수명, 시간 ); 예를 들어 현재 시간을 1초 간격으로 출력하고 싶다면 const getClock= () => { const date = new Date(); console.log(`${date.getHours()}:${date.getMinutes()}:${date.getSeconds()}`); }; getClock(); setInter.. 2022. 11. 14. [JS] localStorage란? localStorage 브라우저에 key-value 값을 Storage에 저장한다. 이 저장한 데이터는 세션 간 공유가 된다. 다시말하자면, 세션이 바뀌어도 저장한 데이터는 그대로 유지된다는 것이다. localStorage 사용법 localStorage.setItem(): key와 value값 추가 localStorage.removeItem(): item 삭제 localStorage.clear(): 도메인 내의 localStorage 값 삭제 localStorage.length: 전체 item의 개수 *localStorage에는 문자열만을 저장할 수 있다. localStorage.setItem() localStorage에 아이템을 추가하기 위해서 setItem을 사용한다. localStorage.setI.. 2022. 11. 11. [WEB/JS] 출력/이벤트 처리 자바스크립트는 HTML 위에서 동작하기때문에 HTML 코드 중간에 코드를 작성해주면 된다. 아래처럼 HTML 코드가 있을 때 자바스크립트를 중간에 삽입하고 싶으면 body태그 안에 script태그가 위치해 있는 것을 볼 수 있다. script 태그 안에는 document.write()라는 문법이 나와 있는데 이것은 출력을 의미한다. 자바로 치면 System.out.print() 느낌(?) 웹페이지에서도 출력된 것을 확인할 수 있다. *자바스크립트는 HTML과 달리 계산도 출력해준다. JavaScript HTML 1+1 자바스크립트와 HTML 모두에게 1+1이라는 코드를 입력했을때 HTML은 1+1을 그대로 출력하지만 자바스크립트 같은 경우는 1과 1을 더한 2가 출력이 된다. 자바스크립트는 이벤트도 처리.. 2022. 7. 6. 이전 1 다음
