Javascript40 [javascript] 자바스크립트 "[object Object]" is not valid JSON 에러 알아보기 안녕하세요! 오늘은 자바스크립트에서 종종 마주치게 되는 "[object Object]" is not valid JSON 에러에 대해 알아보려고 해요. 이 에러는 주로 JSON.parse() 함수를 사용할 때 발생하곤 합니다. JSON.parse() 함수는 JSON 형식의 문자열을 자바스크립트 객체로 변환해 주는데, 그런데 JSON 형식이 아닌 문자열을 이 함수에 전달하면 에러가 나타나게 됩니다. 정말 간단하게 말하면, JSON 형식의 규칙에 맞지 않는 문자열을 사용하면서 JSON.parse() 함수를 호출하면 이 에러가 나타나게 됩니다. 그러면 어떤 상황에서 위와 같은 에러가 발생을 하는지 간단한 예제 코드를 통해서 정리해 보도록 하겠습니다. JSON.parse() JSON.parse()는 자바스크립트의.. 2023. 7. 26. [vue] Echart bar 차트 만들기 Vue Echarts는 Vue.js에서 사용되는 데이터 시각화 차트 라이브러리이다. Vue.js 애플리케이션에서 쉽게 Echarts를 통합하고 사용할 수 있도록 도와주는 도구로, Vue 컴포넌트로 차트를 감싸고 데이터를 손쉽게 바인딩할 수 있다. 목차 오늘은 Vue에서 훌륭한 차트 라이브러리인 vue3-echart을 활용하여 bar 형태의 차트를 만들어보려고 합니다. Vue를 개발하는 업무에서 여러 가지 차트 라이브러리를 사용해 봤지만, Apache에서 나온 오픈소스인 vue3-echart는 다양한 기능과 뛰어난 성능으로 좋은 결과를 만든 기억이 있습니다. 라이브러리 이름에 Vue3가 들어갔듯이, 이번 예제에는 Vue3 기반으로 만들어졌습니다. 그럼 예제를 통해서 하나씩 정리해 보도록 하겠습니다. vue.. 2023. 7. 23. [javascript] 자바스크립트 천단위 콤마 찍기 자바스크립트의 숫자 데이터에 천 단위 콤마를 찍어주는 함수를 공통으로 만들어 숫자 데이터의 가독성을 향상시키고, 코드의 품질 또한 올려줄 수 있다. 목차 오늘은 자바스크립트에서 숫자형 데이터를 처리할 때 자주 사용되는, 천 단위 콤마를 찍는 방법에 대해 정리하려고 합니다. 이 기능은 정말 간단하지만 많이 필요한 기능 중 하나입니다. 숫자형 데이터에 천 단위마다 콤마를 찍어주는 것과 그렇지 않은 것은 가독성에 엄청난 차이를 만들어냅니다. 사용자 입장에서도 콤마가 있는 숫자를 보는 것이 훨씬 편리하고 이해하기 쉬워지기 때문에, 이 기능은 매우 유용하고 필수적입니다. 그러면 예제를 통해서 하나씩 정리해 보도록 하겠습니다. 예제 소스 코드 적용 전 금액 : 적용 후 금액 : 위의 소스 코드는 자바스크립트를 사용.. 2023. 7. 22. [jQuery] 제이쿼리 animate를 활용한 텍스트 문구 자동 롤링 만들기 jQuery의 animate() 함수는 HTML 요소를 부드럽게 애니메이션 하는 데 사용되는 메서드입니다. 이 함수를 사용하면 CSS 속성 값을 변경하면서 웹 페이지에서 효과적인 애니메이션 효과를 적용할 수 있습니다. 목차 오늘은 jQuery의 animate를 활용한 텍스트 문구 자동 롤링 기능에 대해 포스팅하려고 합니다. 직접 만들어 보기 전에는 어려워 보이는 기능이지만 직접 해보면 의외로 간단한 기능입니다. animate 사용 방법 $(selector).animate({styles}, duration, easing, complete); selector 애니메이션을 적용할 HTML 요소를 선택하는 CSS 선택자입니다. styles 애니메이션을 적용할 CSS 속성과 해당 값들을 객체 형태로 전달합니다... 2023. 7. 21. 이전 1 ··· 4 5 6 7 다음
