JSON

[TIL] JS fetch 비동기 통신을 이용한 CRUD

✍ Today I Learned [Read] 서버와 통신하여 가져오는 데이터의 개수를 알 수 없기 때문에 html의 item card를 미리 만들어 놓는 것이 아니라 1개의 card를 데이터 개수만큼 찍어내야 한다. 대략적인 흐름 [클라이언트가 서버에 데이터 요청 -> 서버가 데이터베이스에서 요청된 데이터를 받아옴 -> 그걸 string으로 클라이언트에게 보냄 -> 프론트에서 데이터의 개수만큼 html을 생성 -> 화면단에 출력] button 타입이 submit 일 경우 자동으로 페이지 이동이 되기 때문에 preventDefault() 메서드를 이용해 기본 속성을 막아주어야 한다. [Read - Detail] 비표준 속성(Non-Standard Attribute)이란? html 태그의 속성이 제한적이므로..

[TIL] JS 클래스, JSON

✍ Today I Learned 스스로 하지 않으면 발전은 없다! 분발하자! [Style Guide] operator 양쪽에 공백 두기 변수 이름 시작에 숫자나 대문자 X 달러($) 기호로 이름을 시작하지 않기 파일명은 소문자로 하는 것을 추천 [Best practices] 전역 변수, new, ==, eval() 가급적 사용하지 않기 변수는 상단에 선언하고, 선언하면서 초기화 객체, 배열 선언은 const 자바스크립트는 자동형변환 되는 경우가 많으므로 언제나 데이터 타입에 유의하기 switch 문은 언제나 default로 끝내기 eval() 함수 사용하지 않기 [Mistakes] = 할당 연산자와 == 비교 연산자 헷갈리지 말기(할당은 할당 값을 반환) switch문은 타입까지 비교하는 엄격한 비교를 ..

[TIL] JS forEach(), map(), filter()

✍ Today I Learned [절기를 맞춰라] 결괏값 저장은 전역 변수뿐만 아니라 배열도 활용할 수 있다. 가져오려는 데이터가 값 자체인지, 배열의 길이인지, 데이터 타입이 무엇인지 흐름을 놓치지 말자. 배열을 전체 순회하려면 for of 문을 활용한다. (반복문 안에서 삼항 연산자도 사용 가능) 데이터를 다룰 때 배열과 객체를 혼용하여 다루는 경우가 많다. (JSON 데이터가 그런 형태) // https://finance.naver.com/ 의 TOP 종목 데이터를 구조화 해보기 const top = { "거래상위": [ { name: 'KODEX 200선물인버스2X', price: 2515, updown: -100, ratio: -3.82, }, { name: '메이슨캐피탈', price: 786..