[React] React-Query
2022. 6. 2. 22:27
공부/JavaScript
React-query는 fetcher 함수를 만들수 있게 해준다. export function fetchCoins(){ return fetch(`${BASE_URL}/coins`).then(response=>response.json()) } 기본적으로 fetcher 함수와 연결시켜서 isLoading과 같은 함수가 불렸는지 아닌지를 알려준다. 그리고 함수가 끝났을 때는 결과 값을 data에 넣어준다. const { isLoading, data }=useQuery("allCoins", fetchCoins) 그리고 여러개의 query를 사용하게 되어 key값을 겹치지 않게 하고 싶고, argument가 필요한 경우에는 아래와 같이 작성한다. const {isLoading: infoLoading, data:i..
[JS] JSON 메서드, JSON 배열
2022. 1. 30. 15:27
공부/JavaScript
JSON JSON은 자바스크립트의 객체 표기법을 제한하여 만든 텍스트 기반의 데이터 교환 표준이다. JSON 메서드 자바스크립트에선 아래와 같은 JSON 데이터 처리를 위한 메서드를 제공하고 있다. JSON.stringify(), JSON.parse(), toJSON() JSON.stringify() : 인수로 전달받은 자바스크립트의 객체를 문자열로 변환 후 반환한다. JSON.parse() : 인수로 전달받은 문자열을 자바스크립트의 객체로 변환 후 반환한다. toJSON() : 자바스크립트 Date 객체의 데이터를 JSON 형식의 문자열로 변환 후 반환한다. 따라서 Date.prototype 객체에서만 사용할 수 있다. JSON 배열 var personList=[ {name:'박덕팔',age:20,he..
[JS] 사용자 정의 객체
2022. 1. 30. 15:13
공부/JavaScript
자바스크립트에서는 내장된 객체를 사용하기도 하지만 사용자가 직접 객체를 정의할 수도 있다. var person={ name:'김철수', age:20, height:170, introduce:function(){ document.write("이름:"+this.name," ") document.write("나이:"+this.age," ") document.write("키:"+this.height," ") } } person.introduce()
[JS] 1차원 동적배열
2022. 1. 30. 15:10
공부/JavaScript
자바스크립트 배열은 단순 배열이 아닌 배열 객체이다. 길이도 자유자재로 변경이 가능하다. var score=new Array(0) var num=prompt("과목 갯수 입력") num = Number(num) var input = 0 var total = 0 for(i=1; i
[JS] openweathermap api 날씨 아이콘 표시
2022. 1. 24. 14:40
공부/JavaScript
https://openweathermap.org/ 의 api를 이용하여 날씨 아이콘을 표시하려고 한다. 일단 기본적인 지역과 날씨 정보는 가져왔는데 아이콘은 어떻게 가져오나 많이 알아봤다. 그래도 내가 원하는 답은 딱히 나오지 않았는데 아마도 너무 당연하고 쉬운 일이라 그렇지 않았나 싶다. 일단 아래처럼 openweather api 안에 있는 data.weather.icon 데이터를 가져와야 했다. const iconData = data.weather[0].icon; 그리고 아래처럼 html에 준비해둔 img 태그에 .src로 url을 지정해주는데, 이때 미리 가져왔던 ${iconData}를 넣어준다. const icon = document.querySelector("#weathericon img").s..
[JS] 중첩 반복문, for문 (while, for)
2022. 1. 19. 20:16
공부/JavaScript
중첩 반복문 중첩 반복문 while을 이용하여 구구단 전체 출력하기 var dan=2 var i=1 while(dan
2진수, 8진수, 16진수
2022. 1. 19. 20:05
공부
2진수: 단위가 2씩 곱해지고, 0~1을 사용한다. 8진수: 단위가 8씩 곱해지고, 0~7을 사용한다. 10진수 8진수 7 7(1x7) 8 10 (1x8 + 0x1) 9 11 (1x8 + 1x1) 10 12 (1x8 + 2x1) 11 13 (1x8 + 3x1) ... 16 20 (2x8 + 0x1) 16진수: 단위가 16씩 곱해지고, 0~9까지는 숫자, 10~15부터는 문자를 사용한다. 10진수 16진수 1 1 2 2 ... 10 A 11 B ... 16 10 (1x16 + 0x1) 17 11 (1x16 + 1x1) ... 26 1A (1x16 + Ax1) 27 1B (1x16 + Bx1) ... 31 1F (1x16 + Fx1) 32 20 (2x16 + 0x1)
[JS] break, continue
2022. 1. 19. 19:37
공부/HTML, CSS
break : 반복문 탈출 continue : 반복문의 처음으로 BREAK : for(let i=1; i
[JS] 객체 내부에 함수 넣기
2022. 1. 18. 00:55
공부/JavaScript
객체 내부에 함수를 어떻게 넣는지 알아내기 위해 구글링을 하며 열심히 공부한 결과 key:value 형식이라고 한다. function hello () { //내용 }; 그러니까 일반적인 함수는 위와 같은데, 이걸 객체 내에 그대로 넣게 되면 에러가 발생한다. 해결 방법은 되게 간단했는데 방법은 아래와 같다. const hello = { hi: function () { //내용 }, hola: function () { //내용 } }; 위와 같이 key:value로 작성한다. 즉, function hello는 hello: function으로 바꿔주면 된다. 그리고 함수와 함수 사이엔 무조건 콤마(,)로 구분해야 한다. 이거 찾느라 30분 버렸다. 그렇다면 이제 객체 외부에서 사용해야 하는데 방법은 간단했다..